floating_action_wheel 0.9.1 floating_action_wheel: ^0.9.1 copied to clipboard
A new Floating Action button widget for Flutter with a multi-functional, immersive buttons wheel
floating_action_wheel #
Floating Action Wheel
A new Floating Action button widget for Flutter with a multi-functional, immersive buttons wheel
Getting Started #
💻 Installation #
Add the following dependency to your pubspec.yaml
dependencies:
floating_action_wheel: <latest version>
Usage: #
You have two options to use the FloatingActionWheel, you can use it as a normal FAB in Scaffold(floatingActionButton) or you can put it in other compatible widgets like a Container or a Stack Simply import the main classes and use the main FloatingActionWheel() constructor with its parameters, the mandatory parameter is the buttons list where you pass a list of WheelButton each has its own parameters, internal documentation for the parameters available
import 'package:floating_action_wheel/floating_action_wheel.dart';
import 'package:floating_action_wheel/wheel_button.dart';
- Implementation #
FloatingActionWheel(
buttons: [
WheelButton(onPressed: () {
setState(() {
demoText = "button #1 pressed";
backgroundColor= Colors.orangeAccent;
});
},
text: 'button 1',
backgroundColor: Colors.orange),
WheelButton(onPressed: () {
setState(() {
demoText = "button #2 pressed";
backgroundColor= Colors.greenAccent;
});
},
icon: Icons.ac_unit,
backgroundColor: Colors.green),
WheelButton(onPressed: () {
setState(() {
demoText = "button #3 pressed";
backgroundColor= Colors.cyanAccent;
});
},
text: 'button 3',
backgroundColor: Colors.cyan),
WheelButton(
onPressed: () {
setState(() {
demoText = "button #4 pressed";
backgroundColor= Colors.pinkAccent;
});
},
icon: Icons.home,
backgroundColor: Colors.pink),
],
angleOffset: 90,
visiblePart: 0.5,
animationType: WheelAnimationType.around,
wheelSize: WheelSize.wheel_medium_120,
fabForegroundColor: Colors.white,
fabBackgroundColor: Colors.blue,
separated: false,
);
)
- Demonstration example #