Flutter容器类组件(Row和Column)

Flutter容器类组件(Row和Column)

Row和Column组件是最常用的容器类组件，可以控制多个子控件，Row是水平方向，Column是垂直方向。酷客教程还介绍了Flutter容器类组件(Container)供你参考。

主要属性参如表所示：

有3个Container子控件分别为1、2、3，子控件平均分布在Row内，代码如下：

Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
  Container(
    width: 50,
    height: 30,
    decoration: BoxDecoration(
        border: Border.all(
            color: Colors.red, width: 1, style: BorderStyle.solid)),
    child: new Text("1"),
    alignment: AlignmentDirectional.center,
  ),
  Container(
    width: 50,
    height: 30,
    decoration: BoxDecoration(
        border: Border.all(
            color: Colors.red, width: 1, style: BorderStyle.solid)),
    child: new Text("2"),
    alignment: AlignmentDirectional.center,
  ),
  Container(
    width: 50,
    height: 30,
    decoration: BoxDecoration(
        border: Border.all(
            color: Colors.red, width: 1, style: BorderStyle.solid)),
    child: new Text("3"),
    alignment: AlignmentDirectional.center,
  ),
],
  )

代码运行效果如图所示:

对齐方式属性参如表所示：

酷客网相关文章：

• Flutter容器类组件(Container)
• Flutter按钮组件(Button)
• Flutter图片组件(Image)
• Flutter文本输入组件(TextField)