Flutter常用組件之Container

Container是一個組合類容器。

       /// Container介紹
         /* alignment  位置
           padding 內邊距
           margin 外邊距
           constraints 盒子 寬高的限制
           width 容器寬
           height 容器高
           decoration 裝飾
          foregroundDecoration 前景裝飾
          child 子組件
          transform 旋轉 轉換效果*/
         new Container(
          alignment: Alignment.center,
           padding: const EdgeInsets.all(8.0),
              margin: const EdgeInsets.all(8.0),
              constraints: new BoxConstraints.expand(
              height:
                  //盒子約束的高度
                  Theme.of(context).textTheme.display1.fontSize * 1.1 + 200.0,
             ),
             width: 300.0,
             height: 200.0,
            //decoration: buildBoxDecoration(),
            foregroundDecoration: buildBoxDecorations(),
            child: new Text('容器演示'),
            transform: new Matrix4.rotationZ(0.2),
          ),



  // 注意：BoxDecoration返回的是Decoration對象
  Decoration buildBoxDecoration() {
    return new BoxDecoration(
      color: const Color(0xfffce5cd),
      //設置Border屬性給容器添加邊框
      border: new Border.all(
        //爲邊框添加顏色
        color: const Color(0xff6d9eeb),
        //邊框寬度
        width: 8.0,
      ),
    );
  }


  Decoration buildBoxDecorations() {
    return BoxDecoration(
      color: Colors.blue,
      border: Border.all(
        color: Colors.red,
        width: 10.0,
        style: BorderStyle.solid,
      ),
    );
  }