flutter_advance_slider 1.2.0 copy "flutter_advance_slider: ^1.2.0" to clipboard
flutter_advance_slider: ^1.2.0 copied to clipboard

Flutter Advance Slider: Create sleek, interactive sliders in your apps. Customize colors, divisions, and thumb shape. Engage users with rhombus-shaped markers..

example/example.dart

import 'package:flutter/material.dart';
import 'package:flutter_advance_slider/AdvanceSlider.dart';

class ExampleApp extends StatefulWidget {
  @override
  _ExampleAppState createState() => _ExampleAppState();
}

class _ExampleAppState extends State<ExampleApp> {
  double value = 0.0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: SizedBox(
          width: double.infinity,
          child: Padding(
            padding: const EdgeInsets.all(15.0),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                const SizedBox(height: 80,),
                // Title
                const Text(
                  "Flutter Advance Slider",
                  style: TextStyle(color: Colors.blue, fontSize: 24),
                ),

                const SizedBox(height: 130,),
                // Simple slider without dividers and labels
                const FlutterAdvanceSlider(
                  min: 0,
                  max: 20,
                  displayDivders: false,
                  showLable: false,
                ),

                const SizedBox(height: 30),

                // Normal slider without dividers, labels, and custom thumb 
                const FlutterAdvanceSlider(
                  min: 0,
                  max: 20,
                  displayDivders: false,
                  showLable: false,
                  showCustomThumb: false,
                ),

                const SizedBox(height: 30),

                //  Add colours to your track
                 FlutterAdvanceSlider(
                  min: 0,
                  max: 20,
                  displayDivders: false,
                  showLable: false,
                  showCustomThumb: false,
                  activeTrackColor: Colors.red,
                  inactiveTrackColor: Colors.green[300]!,
                ),

                const SizedBox(height: 30),

                // Rhombus slider with default 5 dividers
                const FlutterAdvanceSlider(
                  min: 0,
                  max: 100,
                ),

                const SizedBox(height: 30),

                // Rhombus slider with 8 dividers
                const FlutterAdvanceSlider(
                  min: 0,
                  max: 100,
                  displayDivders: false,
                  showLable: false,
                ),

                const SizedBox(height: 40),

                // Slider with custom divider icons and no custom thumb
                Text("Value $value"),

                const SizedBox(height: 20),
                FlutterAdvanceSlider(
                  min: 0,
                  max: 100,
                  customIcon: const Icon(
                    Icons.radio_button_checked,
                    color: Colors.blue,
                  ),
                  showCustomThumb: false,
                  onChanged: (value) {
                    setState(() {
                      this.value = value;
                    });
                  },
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
copied to clipboard
3
likes
140
points
51
downloads

Publisher

unverified uploader

Weekly Downloads

2024.09.05 - 2025.03.20

Flutter Advance Slider: Create sleek, interactive sliders in your apps. Customize colors, divisions, and thumb shape. Engage users with rhombus-shaped markers..

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_advance_slider