第四回：Container Widget介绍

我们在上一章回中介绍了Row和Column两种Widget,本章回中将介绍 Container这种Widget，闲话休提，让我们一起Talk Flutter吧。

概念介绍

Container是一种布局类Widget,它主要用来存放其它的Widget,比如我们在上一章回中介绍的Row和Column。它相当于一种Widget容器，它提供了相关的成员变量来修改容器的属性，进而影响到容器中其它的Widget.常用的的属性有长度、宽度，背景颜色等。

常用功能

Container类提供了相应的成员来控制自身的属性，我们只需要给成员赋值就可以修改它的属性，常用的成员如下：

  width:      用来控制它的宽度
  height:     用来控制它的长度
  alignment:  用来控制被它包含widget的对齐方式
  padding:    用来控制它的内边距
  margin:     用来控制它的外边距
  transform:  用来控制它的平移和旋转
  decoration: 用来装饰它的外表，比如边框和背景图片或者背景颜色

示例代码

    Widget wechatBottom = Container(
      width: 900,
      height: 100,
      alignment: Alignment.center,
      padding: EdgeInsets.all(10),
      margin: EdgeInsets.all(20),
      transform: Matrix4.rotationZ(0.2),
      transformAlignment: Alignment.bottomCenter,
      decoration: BoxDecoration(
          color: Colors.green[300],
          border: Border.all(color: Colors.red,width: 3),
          borderRadius:BorderRadius.all(Radius.circular(20)) ),

      child: Row( //row中的代码复用上一章回中的代码，这里省略不写
          ),
    );

在上面的代码中，我们设置了布局(container)的长度和宽度，以及内外边距，给布局在z方向上做了旋转，最后是在布局的外侧添加了一个红色边框，边框进行了圆角设计，同时在边框内使用咖啡色背景。编译并且运行上面的程序可以得到以下效果。

看官们，关于Container Widget的内容就介绍到这里，欢迎大家在评论区交流与讨论!