flutter_easyhub 1.0.2+1 flutter_easyhub: ^1.0.2+1 copied to clipboard
easy for hub, When you do a lot of calculation, you need this animation. When you make a network error or finish downloading files, you also need this animation。
flutter_easyhub #
A pure flutter, supporting android and iOS, no native code, simpler loading animation, more than 20 existing animations, support for custom foreground and background colors.
中文文档 | English documentation |
---|
easy use to use this package as a library #
dependencies:
flutter_easyhub: ^1.0.1
$ flutter pub get
import 'package:flutter_easyhub/flutter_easy_hub.dart';
how to use #
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
builder: (ctx, child) =>
FlutterEasyHub(child: MyHomePage(title: 'Flutter Demo Home Page')),
);
}
}
then, enjoy yourself:
EasyHub.show('loading');
EasyHub.show('loading', duration: Duration(seconds: 2));
///toast 2s later dismiss
EasyHub.showInfoHub('network miss');
///default 2s
EasyHub.showMsg('download success');
///default 2s
EasyHub.showErrorHub('An error occurred');
///default 2s
EasyHub.showCompleteHub('done');
/// only hub without msg
/// when you did call EasyHub.dismiss(),it is dismissed;
EasyHub.showHub();
///dismiss
EasyHub.dismiss();
/// custom your widget
EasyHub.showCustom(Container(
child: Text('my test'),
));
used just like it #
how to chose style #
light
style:light
maskStyle:dark
dark
style:dark
maskStyle:light
change Progress bar color when EasyHubIndicatorType.defaultType #
EasyHub.instance.indicatorType = EasyHubIndicatorType.defaultType;
EasyHub.instance
..backgroundColor = Colors.white
..animationForegroundColor = AlwaysStoppedAnimation(Colors.red)
..style = EasyHubStyle.custom;
EasyHub.showHub();
other EasyHubIndicatorType,you only #
EasyHub.instance
..backgroundColor = Colors.white
..animationForegroundColor = AlwaysStoppedAnimation(Colors.red);
when you want touch widget,then hiden it. #
/// only used for maskStyle!= none.
EasyHub.instance.onTap = () {
EasyHub.dismiss();
};
Renderings Provide more than 30 animations #
default | CircularProgress | showErrorHub | showComplateHub |
---|---|---|---|
LineProgress | CircularProgressEasyOutEasyIn | CircularProgressEasy | singleFlipingRect |
beattingCircle | singlebeattingCircle | beatingRects | rotatingCircles |
rotatingDeformedCircles | rotatingTwoRect | rotatingTwoCircles | foldingRect |
pendulumingBall |
waves |
spitBubbles | movingCube |
rotatingTwoColorBall | dancingBall | flashingBalls | fallingBall |
hourglass |
dancingCube | swingingBall | creepingBug |
rubberBand |
rainCouplet | flipDiamond | fragmentRect |
Customize #
/// just available when [EasyHubType] is [msg]
String msg;
/// msg of padding ,used for [EasyHubType.all] and [EasyHubType.msg]
EdgeInsets msgPadding;
/// msg of margin ,used for [EasyHubType.all] and [EasyHubType.msg]
EdgeInsets msgMargin;
/// style of msg,used for [EasyHubStyle.custom]
TextStyle textStyle;
/// color of msg font,used for [EasyHubStyle.custom]
/// if textStyle is not null, it is ignored
Color fontColor;
///maskStyle. default [EasyHubMaskStyle.dark]
EasyHubMaskStyle maskStyle;
/// center view style
/// default [EasyHubType.all]
EasyHubStyle style;
/// loading indicator type, default [EasyHubType.all]
EasyHubType _easyHubType;
/// Animation type
/// see detail in [EasyHubIndicatorType]
/// when [EasyHubType] is [hub] or [all],it is available.
EasyHubIndicatorType indicatorType;
/// color of Mask,only used for [EasyHubMaskStyle.custom]
Color maskColor;
///color of main View background
/// used for [EasyHubStyle.custom]
Color backgroundColor;
///color of main animation background
///used for most of [EasyHubIndicatorType]
///when animationWidget colors more than [two], ignored.
Color animationBackgroundColor;
/// main animation foreground color,type is [Animation<Color>]
/// like[AlwaysStoppedAnimation]
/// used for most of [EasyHubIndicatorType]
/// when animationWidget colors more than [two], ignored.
Animation<Color> animationForegroundColor;
/// animation progress value [bounds] is [0...1]
/// used for [EasyHubIndicatorType.lineProgress]
/// TODO - [EasyHubIndicatorType.waves]
double progress; //进度条
/// display duration of [showSuccess] [showErrorHub] [showCompleteHub], default 2000ms.
Duration displayDuration;
/// touch action
/// you can set dismissed when touch
/// ```dark
/// EasyHub.instance.onTap = () {
/// EasyHub.dismiss();
/// };
/// ```
GestureTapCallback onTap;
/// display animation duration, default duration is [300ms]
Duration showHubDuration = Duration(milliseconds: 300);
/// hide animation duration, default duration is [300ms]
Duration hideHubDuration = Duration(milliseconds: 300);
/// display animation curve, default curve is [Curves.linear]
Curve showHubCurve = Curves.linear;
/// hide animation curve, default curve is [Curves.linear]
Curve hideHubCurve = Curves.linear;
see example #
enjoy youself with animation if you only like animations; #
any animation is widget,you can use it ,see detail