要使AnimatedContainer和Row一起进行动画处理,需要将它们包装在AnimatedBuilder中。下面是代码示例:
class MyWidget extends StatefulWidget {
@override
_MyWidgetState createState() => _MyWidgetState();
}
class _MyWidgetState extends State {
bool _isExpanded = false;
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: _animationController,
builder: (BuildContext context, Widget child) {
return Row(
children: [
SizedBox(
width: 50.0,
child: IconButton(
onPressed: () {
setState(() {
_isExpanded = !_isExpanded;
});
},
icon: Icon(Icons.info),
),
),
Expanded(
child: AnimatedContainer(
duration: const Duration(milliseconds: 500),
width: _isExpanded ? 200.0 : 100.0,
height: _isExpanded ? 200.0 : 100.0,
color: _isExpanded ? Colors.red : Colors.blue,
child: Center(
child: Text('Hello World'),
),
),
),
],
);
},
);
}
}
在上面的代码示例中,我们将AnimatedContainer包装在AnimatedBuilder中,并将其子项设置为Row。这样可以确保AnimatedContainer和Row一起进行动画处理。在setState中更改_isExpanded变量,从而根据需要切换显示AnimatedContainer的宽度,高度和颜色。