toggle_rotate

Creator: coderz1093

Last updated:

0 purchases

toggle_rotate Image
toggle_rotate Images

Languages

Categories

Add to Cart

Description:

toggle rotate

【pub地址 】 【github地址】
dependencies:
toggle_rotate: 1.0.1
copied to clipboard

一、描述

目标: 让一个组件点击时执行旋转,再点击旋转回去。




最简使用
时长、曲线、方向
一切组件
旋转角度











1.所有属性:



名称
类型
功能
备注
默认




beginAngle
double
起始角度
角度制
0


endAngle
double
终止角度
角度制
90


durationMs
int
动画时长
毫秒
200


curve
Curve
动画曲线
-
Curves.fastOutSlowIn


clockwise
bool
是否顺时针旋转
-
true


onTap
void Function
点击事件
-
null


onEnd
void Function(bool)
动画结束回调
-
null


child
Widget
子组件
@required
null




2.最简使用:

ToggleRotate(
child: Icon(Icons.arrow_upward,size: 60,color: Colors.orangeAccent),
onEnd: (bool isExpanded) { // 动画结束时间
print("---expanded---:$isExpanded-------");
},
onTap: () {}, //点击事件
),
copied to clipboard

3.指定时长和曲线和方向

ToggleRotate(
curve: Curves.decelerate,
durationMs: 400,//动画时长
clockwise: false, //是否是顺时针
child: Icon(Icons.arrow_upward,size: 60,color: Colors.orangeAccent),
onTap: () {},
),
copied to clipboard

4.可使一切组件进行旋转切换

ToggleRotate(
curve: Curves.decelerate,
durationMs: 400,
child: Image(width:60,height: 60,image: AssetImage("assets/images/icon_28.jpg")),
onTap: () {},

)
copied to clipboard

5.可使旋转的角度

ToggleRotate(
beginAngle: 0, // 起始角度
endAngle: 45, // 终止角度
curve: Curves.linear,
child: Image(width:60,height: 60,image: AssetImage("assets/images/icon_28.jpg")),
onTap: () {},
)
copied to clipboard

License

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

Customer Reviews

There are no reviews.