flutter间距,flutter需要

Flutter初学 —— 常用控件使用

在编写几个 Flutter 项目后，发现 Flutter 的强大之处在于业务中所有用到的控件以及场景都有对应的处理方案；而 Dart 语言也与 Java 、 Kotlin 类似，所以对 Android 开发者来说门槛非常低；特意记录一下常用的控件及其使用：

成都创新互联公司于2013年创立，先为塔河等服务建站，塔河等地企业，进行企业商务咨询服务。为塔河企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

StatelessWidget 不需要额外的创建 State

StatefulWidget 创建 State 类，并可以在其中保存一些状态

only 可以单独设置每个方向的内边距

类似于 LinearLayout 中的 orientation 设置为 vertical ， mainAxisAlignment 表示竖向的一个对齐方式， crossAxisAlignment 表示横向的对齐方式

与 Column 相反，主轴是横向，对齐方式类似， crossAxisAlignment 表示竖向的对齐方式

类似 SizedBox ，一个容器，但是主要功能是有一个 decoration —— 装饰器，作用是绘制背景，或者使用 item 中的阴影

栈，先入后出，类似于 Android 上的 FrameLayout

通常配合 Stack 使用，固定显示在某一个位置

配合多 child 使用，会填充剩余的空间

Image 功能强大，使用不同的方法可以加载不同来源的图片

看到这些方法，突然觉得 Flutter 太香了，而且 Image 可以配置 clip 等裁剪出不同形状的图片，无论是圆形还是五角星都不在话下，然而 Android 要实现不规则的形状，可是要下不少功夫的。

名字和 Android 的一模一样，但是用法却比 Android 的简单很多：

主要就是 itemCount 与 itemBuilder ,其余就是配置样式， itemBuilder 需要返回一个 widget ，当然了，每个 ListView 都有其对应的 item ，在里面的方法中编写 widget 即可

与 ListView 类似，但是需要有一个 delegate 类，作用是设置有多少列，每一列之间的间距是多少

GridView 没有 build ， children 表示所有的子 view

最常用的控件之一，有非常多的样式， Flutter 中通常是使用装饰器来处理控件的，如背景使用 BoxDecoration , TextFiled 使用 InputDecoration ; 使用如下

Flutter 布局 - Container详解

Container的组成如下：

- width  和  height ：宽和高。

- color ：背景色，值为一个 Color 对象，不能与 decoration 属性同时设置。

-  margin ：外边距，值为一个 EdgeInsets 对象。EdgeInsets 对象即可调用EdgeInsets.all() 方法统一设置左上右下四条边的边距，也可以调用 EdgeInsets.fromLTRB() 分别设置左上右下四条边的边距。

-  padding ：内间距，值同 margin。

-  alignment ：元素对齐方式

-  decoration ：装饰、背景颜色、边框、背景图片、等，不能与 color 属性同时设置

-  child ：子组件

-参数 alignment：

topCenter ：顶部居中对齐     topLeft ：顶部左对齐      topRight ：顶部右对齐      center ：水平垂直居中对齐      centerLeft ：垂直居中水平居左对齐      centerRight ：垂直居中水平居右对齐      bottomCenter 底部居中对齐     bottomLeft ：底部居左对齐     bottomRight ：底部居右对齐

-参数 decoration ：

Container参数的使用如下：

flutter 组件之间怎么设置相对距离

1.使用sizebox保持间距

2.使用Spacer填充尽可能大的空间

Row(

children: Widget[

Text("1"),

Spacer(), // use Spacer

Text("2"),

],

)

3.使用mainAxisAlignment对齐方式控制彼此间距

4.如果不用行的话，还可以使用Wrap并指定spacing

5）同样是使用Wrap，设置spaceAround

Wrap(

alignment: WrapAlignment.spaceAround, // 空白包围住元素

children: Widget[

Text("1"),

Text("2"),

],

)

该方案来自于 这位博主请点击查看

如何设置TileList各个item之间的间距

用两层listview，第一个listview的adapter里面放的还是listview，第二层里面再放你要放的元素，这样的话你设置好第一层listview的元素间距就好

flutter中如何让Column或Row的子组件相互之间保持一定的间距？

Column或者Row控件的子组件相互之间保持间距的方式有很多种，比较简单直接的实现方式如下：

Column(

children: Widget[

FirstWidget(),

SizedBox(height: 10),//保留间距10

SecondWidget(),

],

),

如果是行的话，参考以下：

Row(

children: Widget[

FirstWidget(),

SizedBox(width: 10),

SecondWidget(),

],

),