flutter布局组件:wrap组件实现瀑布流
Wrap实现瀑布流效果
direction: 主轴方向,默认为水平方向 alignment: 主轴方向的对齐方式 spacing: 主轴方向上的间距 textDirection: 文本方向 verticalDirection: 定义了children的摆放顺序,默认是down runSpacing: 次轴方向上的间距 runAlignment: 次轴的对齐方式
示例代码:
class WrapDemo extends StatelessWidget{
@override
Widget build(BuildContext context) {
// TODO: implement build
return Wrap(
direction: Axis.horizontal,///主轴方向,默认为水平方向
alignment: WrapAlignment.center,///主轴方向的对齐方式
spacing: 10,///主轴方向上的间距
textDirection: TextDirection.ltr,///文本方向
verticalDirection: VerticalDirection.down,///定义了children的摆放顺序,默认是down
runSpacing: 20,///次轴方向上的间距
runAlignment: WrapAlignment.center,///次轴的对齐方式
children: <Widget>[
BlueButton("算死草"),
BlueButton("喜剧之王"),
BlueButton("唐伯虎点秋香"),
BlueButton("无敌破坏王"),
BlueButton("逃学威龙"),
BlueButton("少林足球"),
BlueButton("算死草"),
BlueButton("喜剧之王"),
BlueButton("唐伯虎点秋香"),
BlueButton("无敌破坏王"),
BlueButton("逃学威龙"),
BlueButton("少林足球"),
],
);
}
}
上一篇:
IDEA上Java项目控制台中文乱码
