Question

我是Flutter的新手，如何实现Flutter中的线性布局？版式视图的水平和垂直方向。

Answer 1

Row是水平线性布局

new Row(
  children: <Widget>[
   ///display children in a horizontal manner
  ],

Column是垂直的线性布局

new Column (
  children: <Widget>[
   ///display children in a vertical manner 
  ],

Answer 2

首先，您应该尝试了解下面给出的颤振链接中的线性布局。

https://flutter.io/flutter-for-android/#what-is-the-equivalent-of-a-linearlayout

之后，您将能够实现它。

Answer 3

对于水平布局是Column，其中子级将按其顺序从上到下排序，对于{em> vertical 方向则是Row ，分别将其 children 从开始到结束。

就像 LinearLayout 一样，它们都表示以下内容：

Create[ ] [...] array[s] of children.

然后他们要么水平地（Row）要么垂直地（Column）做到这一点。

以下是两个小部件的两个不言自明的示例：

Widget column() => Column(children: <Widget>[
    Text('top'),
    Text('middle'),
    Text('bottom'),
  ]);

Widget row() => Row(children: <Widget>[
    Text('left'), // actually start
    Text('middle'),
    Text('right'),
  ]);

您可以访问相应的文档页面，以进一步了解 alignment ：

Column
Row

Answer 4

要在Flutter中实现纯线性布局，请在管理主轴和横轴对齐时使用行小部件

示例

让我们说您要水平显示两个等重的图标，即每个1-1 使用这样的行

Container(
            color: Colors.yellowAccent,
            child: new Row(
              mainAxisSize: MainAxisSize.max,
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                new Icon(
                  Icons.access_time,
                  size: 50.0,
                ),
                new Icon(
                  Icons.pie_chart,
                  size: 100.0,
                ),
              ],
            ),
          )

如何在Flutter中实现LinearLayout之类的布局？

4 个答案: