[英]Animated FloatingActionButton in Stack don't trigger onPressed event
[英]Animated FloatingActionButton in Stack don't trigger onPressed event in Flutter
我在動畫浮動操作按鈕中嘗試了多個按鈕。 但是當我點擊按鈕時,沒有任何反應。 這段代碼來自示例代碼,我做了一點改動。
有人回答這是類似於 Stack 小部件的區域問題。 所以我測試了堆棧包裝容器。 我還測試了將 FAB 更改為 IconButtons,因為有人解釋說這可能是 FAB 的 hashTag 問題。
但是現在不知道是什么問題。 你能告訴我如何解決這個問題......? 謝謝。
class RadialMenu extends StatefulWidget {
@override
_RadialMenuState createState() => _RadialMenuState();
}
class _RadialMenuState extends State<RadialMenu>
with SingleTickerProviderStateMixin
{
AnimationController controller;
@override
void initState() {
// TODO: implement initState
super.initState();
controller = AnimationController(duration: Duration(milliseconds: 900), vsync: this);
}
@override
Widget build(BuildContext context) {
return RadialAnimation(controller: controller);
}
}
class RadialAnimation extends StatelessWidget {
final AnimationController controller;
final Animation<double> scale;
final Animation<double> translation;
final Animation<double> rotation;
RadialAnimation({ Key key, this.controller}):
scale = Tween<double>(
begin: 1.3,
end: 0.0,
).animate(
CurvedAnimation(
parent: controller,
curve: Curves.fastOutSlowIn,
),
),
translation = Tween<double>(
begin: 0.0,
end: 70.0,
).animate(
CurvedAnimation(
parent: controller,
curve: Curves.elasticOut,
)
),
rotation = Tween<double>(
begin: 0.0,
end: 360.0,
).animate(
CurvedAnimation(
parent: controller,
curve: Interval(
0.0, 0.7,
curve: Curves.decelerate,
)
)
),
super(key : key);
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: controller,
builder: (context, builder) {
return Transform.rotate(
angle: radians(rotation.value),
child: Container(
height: 150,
width: 150,
color: Colors.blueGrey,
child: Center(
child: Stack(
children: <Widget>[
_buildButton(225, color:Colors.orange, icon: Icons.accessibility_new),
//_buildButton(270, ,color:Colors.green, icon: Icons.accessible_forward),
_buildButton(315, color:Colors.yellow, icon:Icons.account_balance),
Transform.scale(
scale: scale.value -1.3,
child: FloatingActionButton(
heroTag: "btn1",
child: Icon(Icons.ac_unit),
backgroundColor: Colors.blue,
onPressed: _close,
),
),
Transform.scale(
scale: scale.value,
child: FloatingActionButton(
heroTag: "btn2",
child: Icon(Icons.add_box),
onPressed: _open,
),
)
],
),
),
),
);
},
);
}
_buildButton(double angle, {Color color, IconData icon}) {
final double rad = radians(angle);
return Transform(
transform: Matrix4.identity()
..translate(
(translation.value) * cos(rad),
(translation.value) * sin(rad),
),
// child: FloatingActionButton(
// heroTag: null,
// child: Icon(icon),
// backgroundColor: color,
// onPressed: () {
// //_close;
// print("I'm " );
// },
// ),
child: IconButton(icon: Icon(Icons.add), onPressed: () {
print('hello??11');
},),
);
}
_open() {
controller.forward();
print("my name is open!");
}
_close() {
controller.reverse();
print("my name is closed");
}
}
我只是從 main.dart 調用這個小部件
...
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
floatingActionButton: RadialMenu(),
...
這是我的錯誤。
我錯過了示例代碼中的一行。
堆棧應具有以下屬性:alignment:Alignment.center
插入后,子按鈕的 onPresseds 正在工作。
對不起,我錯了。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.