我有一个 AnimatedContainer,作为它的孩子,我有一个包含文本和图标按钮的行。单击某个按钮后,我在 0 到 100 之间切换 Container 的高度。当 Container 高度为零时,IconButton 仍然可见(不是文本)并且不可单击。
Widget _myAnimatedContainer() {
return AnimatedContainer(
curve: Curves.easeOut,
alignment: Alignment.center,
duration: Duration(milliseconds: 300),
height: height,
color: Colors.green,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Text(
'Animated Container',
style: TextStyle(fontSize: 20),
overflow: TextOverflow.ellipsis,
),
IconButton(icon: Icon(Icons.favorite_border), onPressed: () {},)
],
),
);
}
class _AnimatedContainerExampleState extends State<AnimatedContainerExample> {
double height = 100;
bool isExpanded = false;
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
_myAnimatedContainer(),
SizedBox(height: 20,),
RaisedButton(
child: Text('Expand'),
onPressed: () {
setState(() {
isExpanded = !isExpanded;
height = isExpanded ? 100 : 0;
});
},
),
],
),
);
}
请建议如何解决这个问题。