flutter_advanced_switch

Last updated:

0 purchases

flutter_advanced_switch Image
flutter_advanced_switch Images
Add to Cart

Description:

flutter advanced switch

flutter_advanced_switch #
An advanced switch widget, that can be fully customized with size, text, color, radius of corners.




Switch Light
Switch Dark









Getting Started #
In the pubspec.yaml of your flutter project, add the following dependency:
dependencies:
...
flutter_advanced_switch: <latest_version>
copied to clipboard
Import in your project:
import 'package:flutter_advanced_switch/flutter_advanced_switch.dart';
copied to clipboard
Examples #
How to use #
// ...
// 1. Create a controller in the state of the StatefulWidget
final _controller = ValueNotifier<bool>(false);

// 2. In case, you want to call setState on switch changes.
// 2.1. Add event listener, for example in the initState() method.
// ...
bool _checked = false;

// ...
@override
void initState() {
super.initState();

_controller.addListener(() {
setState(() {
if (_controller00.value) {
_checked = true;
} else {
_checked = false;
}
});
});
}

// 3. Add AdvancedSwitch to the build method.
// ...
AdvancedSwitch(
controller: _controller,
),
// ...
copied to clipboard
Regular Switch
// ...
final _controller = ValueNotifier<bool>(false);
// ...
AdvancedSwitch(
controller: _controller,
)
// ...
copied to clipboard
Customized Switch
// ...
final _controller = ValueNotifier<bool>(false);
// ...
AdvancedSwitch(
controller: _controller,
activeColor: Colors.green,
inactiveColor: Colors.grey,
activeChild: Text('ON'),
inactiveChild: Text('OFF'),
activeImage: AssetImage('assets/images/on.png'),
inactiveImage: AssetImage('assets/images/off.png'),
borderRadius: BorderRadius.all(const Radius.circular(15)),
width: 50.0,
height: 30.0,
enabled: true,
disabledOpacity: 0.5,
),
// ...
copied to clipboard
Custom thumb
// ...
final _controller = ValueNotifier<bool>(false);
// ...
AdvancedSwitch(
controller: _controller,
thumb: ValueListenableBuilder(
valueListenable: _controller,
builder: (_, value, __) {
return Icon(value
? Icons.lightbulb
: Icons.lightbulb_outline);
},
),
),
// ...
copied to clipboard
AdvancedSwitch Parameters #



Parameter
Description
Type
Default




controller
Determines if widget is enabled.
ValueNotifier



activeColor
Determines current state.
Color
Colors.green


inactiveColor
Determines background color for the active state.
Color
Colors.grey


activeChild
Determines background color for the inactive state.
Widget



inactiveChild
Determines label for the active state.
Widget



activeImage
Determines label for the inactive state.
ImageProvider



inactiveImage
Determines background image for the active state.
ImageProvider



borderRadius
Determines background image for the inactive state.
BorderRadius
Radius.circular(15)


width
Determines border radius.
Double
50.0


height
Determines width.
Double
30.0


enabled
Determines height.
bool
true


disabledOpacity
Determines opacity of disabled control.
double
0.5


thumb
Custom thumb widget
Widget



initialValue
Initial value
bool
false


onChanged
Changed callback
ValueChanged




Demo #

License:

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Customer Reviews

There are no reviews.