flutter_web_buttons
A quick way to add a growing list of customizable flat or animated buttons to your app.
Features
- Each button features it's own constructor with plenty of options for customization.
- Includes most commonly used Social Icons
- Buttons can be used as a Hero
Installation
In the dependencies:
section of your pubspec.yaml
, add the following line:
dependencies:
flutter_web_buttons: <latest_version>
In your library add the following import:
import 'package:flutter_web_buttons/flutter_web_buttons.dart';
Getting Started
FlutterWebButton.textScroll(
'Text Scroll',
onPressed: () {},
animationDuration: const Duration(milliseconds: 500),
flutterWebButtonOptions: FlutterWebButtonOptions(
buttonWidth: 200,
buttonRadius: 30,
textColor: Colors.pink,
buttonBackgroundColor: Colors.transparent,
buttonBorderColor: Colors.pink),
),
Examples
Button | Animation |
---|---|
backgroundColorChange | |
backgroundFill | |
grow | |
iconGrow | |
textMove | |
simple | Simple button with no animation |
socialIcon | Social icon with no animation (see list) |
socialIconGrow | Scales a social icon to a given size |
textColorChange | |
textScroll | |
textUnderline | |
buttonHighlightIconFill |
Button Customization Properties
Animation Properties
Some properties are not applicable for all buttons.
Animation Specific Property | Availabilty |
---|---|
Animation Duration | All Animated Buttons |
Animated Text Color | Button Specific |
Animated Background Color | Button Specific |
growAmount | Grow effect buttons only |
Decoration Properties
FlutterWebButtonOptions | FlutterWebIconButtonOptions |
---|---|
Height | Icon Size |
Width | Icon Color |
Background Color | Padding |
Text Color | Hero Tag |
Font Size | IsHeroWidget |
Font Family | |
Padding | |
Eliminate Decoration | |
Button Radius | |
Border Color | |
Border Width | |
Shadow Color | |
Spread Radius | |
Blur Radius | |
Shadow Offset | |
Hero Tag | |
IsHeroWidget |