Flutter Row 横向排列、水平排列

参数详解

属性	说明
mainAxisAlignment	主轴的排序方式 MainAxisAlignment.start MainAxisAlignment.end MainAxisAlignment.center MainAxisAlignment.spaceBetween ： 间距相同  首尾没有间距 MainAxisAlignment.spaceAround ： 子元素平均充满 MainAxisAlignment.spaceEvenly ： 间距相同 首尾有间距
crossAxisAlignment	次轴的排序方式 CrossAxisAlignment.start CrossAxisAlignment.end CrossAxisAlignment.center CrossAxisAlignment.stretch  ： 子元素宽充满 CrossAxisAlignment.baseline
mainAxisSize	默认MainAxisSize.max
textDirection	正反排序 TextDirection.ltr TextDirection.rtl
verticalDirection	默认VerticalDirection.down
textBaseline	官方：如果根据基线对齐项目，则使用哪个基线。
children	子元素

代码示例

class MyBody extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.red,
      // width: 400,
      height: 400,
      child:Row(
        children: [
          MyImage('https://raw.githubusercontent.com/think-ing/flutter_demo/master/images/a.jpg'),
          MyImage('https://raw.githubusercontent.com/think-ing/flutter_demo/master/images/b.jpg'),
          MyImage('https://raw.githubusercontent.com/think-ing/flutter_demo/master/images/c.jpg'),
          Text('abcdefg'),
          Text('cdefg'),
          Text('bcdefg'),
          Text('你好'),
        ],
      )
    );
  }
}



//定义一个 公共类
class MyImage extends StatelessWidget {
  String imgUrl;
  MyImage(this.imgUrl);
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 100,
      width: 100,
      child: Image.network(this.imgUrl,fit: BoxFit.cover,),
    );
  }
}

 效果图