Wrap(每日Flutter 小部件)
Wrap({ Key key, this.direction = Axis.horizontal,//主轴(mainAxis)的方向,默认为水平。 this.alignment = WrapAlignment.start,//主轴方向上的对齐方式,默认为start。 this.spacing = 0.0,//主轴方向上的间距。 this.runAlignment = WrapAlignment.start,//run的对齐方式。run可以理解为新的行或者列,如果是水平方向布局的话,run可以理解为新的一行。 this.runSpacing = 0.0,//run的间距。 this.crossAxisAlignment = WrapCrossAlignment.start,//交叉轴(crossAxis)方向上的对齐方式。 this.textDirection,//文本方向。 this.verticalDirection = VerticalDirection.down,//定义了children摆放顺序,默认是down,见Flex相关属性介绍。 List<Widget> children = const <Widget>[],// }) */
import 'package:flutter/material.dart'; class WrapWidget extends StatelessWidget { @override Widget build(BuildContext context) { return getV(context); } Widget getV(BuildContext context) { var children = <Widget>[]; for (String item in tags) { children.add(TagItem(item)); } return Container( child: Wrap(children: children), ); } } const List<String> tags = [ "肯德基", "小哥哥你的东西掉了", "小姐姐好漂亮啊", "这个东西是啥", "哈哈哈", "好困啊", "今天好运", "明天好运来", "今年快结束了", "我累啊", "你写的什么代码", "多多多" ]; class TagItem extends StatelessWidget { final String text; TagItem(this.text); @override Widget build(BuildContext context) { return Container( height: 40, margin: EdgeInsets.symmetric(vertical: 5, horizontal: 5), decoration: BoxDecoration( border: Border.all(color: Colors.blueAccent.withAlpha(60), width: 1.0), borderRadius: BorderRadius.all(Radius.circular(5))), child: Container( margin: EdgeInsets.all(8), child: Text(text), ), ); } }