flutter_transition_animation 1.0.1+2 flutter_transition_animation: ^1.0.1+2 copied to clipboard
A shwo wondfull messge Flutter package.if you like used in other cases,it is also nice.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_transition_animation/flutter_easy_message.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Easy show message Demo'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
enum ChildType { msg, img, view }
class _MyHomePageState extends State<MyHomePage> {
EasyAnimationDirection showFlipStyle = EasyAnimationDirection.btt;
EasyAnimationDirection hideFlipStyle = EasyAnimationDirection.btt;
EasyShowOrHideStyle style = EasyShowOrHideStyle.defaultStyle;
EasyShowOrHideStyle dismissStyle = EasyShowOrHideStyle.defaultStyle;
Curve _showCurve = Curves.linear;
Curve _hideCurve = Curves.linear;
ChildType type = ChildType.msg;
bool _show = false;
ValueKey<int> _key = ValueKey(0);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: SingleChildScrollView(
child: Column(
// mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SizedBox(
height: 50,
),
Container(
height: 200,
width: 300,
color: Colors.black12,
alignment: Alignment.topCenter,
child: Stack(
children: [
Positioned.fill(child: child),
Positioned(
left: 0,
right: 0,
height: 30,
child: Container(
key: _key,
child: FlutterEasyMessage(
shouldShow: _key.value != 0,
messageChild: messageChild,
duration: Duration(seconds: 2),
hideAnimationStyle: dismissStyle,
showAnimationStyle: style,
showAnimaitonDirection: showFlipStyle,
hideAnimaitonDirection: hideFlipStyle,
hideDuration: Duration(seconds: 1),
showDuration: Duration(seconds: 1),
curve: _showCurve,
reverseCurve: _hideCurve,
),
),
)
],
),
),
Text('是否展示动画'),
_widgetShowOrHiden(),
Text('浮窗类型'),
_widgetChild(),
Text('出现动画类型'),
_widgetStyle(true),
Text('消失动画类型'),
_widgetStyle(false),
Text('隐藏方向 style==EasyShowOrHideStyle.size 可用 \n '),
Text('出现动画方向'),
_widget(true),
Text('隐藏动画方向'),
_widget(false),
Text('进入动画曲线<左右滑动选择更多>'),
CupertinoScrollbar(
child: SingleChildScrollView(
child: _curve(true),
scrollDirection: Axis.horizontal,
),
),
Text('隐藏动画曲线<左右滑动选择更多>'),
CupertinoScrollbar(
child: SingleChildScrollView(
child: _curve(false),
scrollDirection: Axis.horizontal,
),
),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
setState(() {});
},
tooltip: 'Increment',
child: Icon(Icons.refresh),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
/// 这里刷新 动画不弹出 因为_key没变化
void fresh() {
if (mounted) setState(() {});
}
/// 动画类型
Widget _widgetShowOrHiden() {
return CupertinoSegmentedControl<bool>(
children: {
false: Padding(
padding: EdgeInsets.all(5.0),
child: Text("不展示动画"),
),
true: Padding(
padding: EdgeInsets.all(5.0),
child: Text("展示动画"),
),
},
selectedColor: Colors.blueAccent,
onValueChanged: (v) {
_show = v;
fresh();
},
groupValue: _show);
}
/// 动画类型
Widget _widgetStyle(bool show) {
return CupertinoSegmentedControl<EasyShowOrHideStyle>(
children: {
EasyShowOrHideStyle.defaultStyle: Padding(
padding: EdgeInsets.all(5.0),
child: Text("defaultStyle"),
),
EasyShowOrHideStyle.size: Padding(
padding: EdgeInsets.all(5.0),
child: Text("size"),
),
EasyShowOrHideStyle.fade: Padding(
padding: EdgeInsets.all(5.0),
child: Text("fade"),
),
EasyShowOrHideStyle.flip: Padding(
padding: EdgeInsets.all(5.0),
child: Text("翻转"),
)
},
selectedColor: Colors.blueAccent,
onValueChanged: (v) {
if (show == false) {
dismissStyle = v;
} else {
style = v;
}
fresh();
},
groupValue: show == true ? style : dismissStyle);
}
Widget _widget(bool show) {
return CupertinoSegmentedControl<EasyAnimationDirection>(
children: {
EasyAnimationDirection.rtl: Padding(
padding: EdgeInsets.all(5.0),
child: Text("<-"),
),
EasyAnimationDirection.ltr: Padding(
padding: EdgeInsets.all(5.0),
child: Text("->"),
),
EasyAnimationDirection.btt: Padding(
padding: EdgeInsets.all(5.0),
child: Text("↑"),
),
EasyAnimationDirection.ttb: Padding(
padding: EdgeInsets.all(5.0),
child: Text("↓"),
),
EasyAnimationDirection.tvc: Padding(
padding: EdgeInsets.all(5.0),
child: Text(show ? "<-->" : ">-<"),
),
EasyAnimationDirection.thv: Padding(
padding: EdgeInsets.all(5.0),
child: Text(show ? "↕" : "--"),
)
},
selectedColor: Colors.blueAccent,
onValueChanged: (v) {
if (show) {
showFlipStyle = v;
} else {
hideFlipStyle = v;
}
fresh();
},
groupValue: show == true ? showFlipStyle : hideFlipStyle);
}
Widget _widgetChild() {
return CupertinoSegmentedControl<ChildType>(
children: {
ChildType.msg: Padding(
padding: EdgeInsets.all(5.0),
child: Text("msg"),
),
ChildType.img: Padding(
padding: EdgeInsets.all(5.0),
child: Text("img"),
),
ChildType.view: Padding(
padding: EdgeInsets.all(5.0),
child: Text("view"),
),
},
groupValue: type,
onValueChanged: (v) {
type = v;
fresh();
},
);
}
Widget _curve(bool show) {
return CupertinoSegmentedControl<Curve>(
children: {
Curves.linear: Padding(
padding: EdgeInsets.all(5.0),
child: Text('linear'),
),
Curves.bounceInOut: Padding(
padding: EdgeInsets.all(5.0),
child: Text('bounceInOut'),
),
Curves.bounceOut: Padding(
padding: EdgeInsets.all(5.0),
child: Text('bounceOut'),
),
Curves.bounceIn: Padding(
padding: EdgeInsets.all(5.0),
child: Text('bounceIn'),
),
Curves.easeIn: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeIn'),
),
Curves.easeInToLinear: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInToLinear'),
),
Curves.linearToEaseOut: Padding(
padding: EdgeInsets.all(5.0),
child: Text('linearToEaseOut'),
),
Curves.bounceIn: Padding(
padding: EdgeInsets.all(5.0),
child: Text('bounceIn'),
),
Curves.decelerate: Padding(
padding: EdgeInsets.all(5.0),
child: Text('decelerate'),
),
Curves.easeInBack: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInBack'),
),
Curves.easeInCirc: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInCirc'),
),
Curves.easeInCubic: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInCubic'),
),
Curves.easeInExpo: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInExpo'),
),
Curves.easeInOut: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInOut'),
),
Curves.easeInOutBack: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInOutBack'),
),
Curves.easeInOutCirc: Padding(
padding: EdgeInsets.all(5.0),
child: Text('easeInOutCirc'),
),
Curves.slowMiddle: Padding(
padding: EdgeInsets.all(5.0),
child: Text('slowMiddle'),
),
Curves.fastOutSlowIn: Padding(
padding: EdgeInsets.all(5.0),
child: Text('fastOutSlowIn'),
),
},
onValueChanged: (v) {
if (show == true) {
_showCurve = v;
} else {
_hideCurve = v;
}
fresh();
},
groupValue: show == true ? _showCurve : _hideCurve,
);
}
// ignore: missing_return
Widget get messageChild {
switch (type) {
case ChildType.msg:
return Container(
child: Text(
'今天有大雨,记得带伞🌲😯',
),
height: 30,
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.black38,
borderRadius: BorderRadius.all(Radius.circular(10))),
);
case ChildType.img:
return Container(
child: Image.asset(
'img/0.jpeg',
fit: BoxFit.fitWidth,
),
height: 100,
width: 200,
decoration: BoxDecoration(
color: Colors.black38,
borderRadius: BorderRadius.all(Radius.circular(10))),
);
case ChildType.view:
return ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(10)),
child: Container(
child: Row(
children: [
Image.asset(
'img/0.jpeg',
fit: BoxFit.fitWidth,
),
SizedBox(
width: 50,
),
Expanded(
child: Text(
'www.fgyong.cn \n 快来关注我 www.github/ifgyong',
style: TextStyle(color: Colors.white),
),
)
],
),
height: 80,
// width: 200,
color: Colors.black38),
);
}
}
Widget get child => Container(
padding: EdgeInsets.only(top: 100),
child: OutlineButton(
child: Text('我是 child,可以 \n 点击 弹出提示框'),
onPressed: () {
/// 执行动画 因为_key 地址变了
_key = ValueKey(_key.value + 1);
setState(() {});
},
),
);
}