flutter

Flutter控件之Container

2018-09-11  本文已影响693人  Mr丶xi先森

Container 给一个组件添加padding,margins,边界(borders),背景颜色或者其他装饰 (decorations)。

import 'package:flutter/material.dart';
class LearnContainer extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return new _LearnContainer();
  }
}
class _LearnContainer extends State<LearnContainer>{
  @override
  Widget build(BuildContext context) {
    return new Container(
      width: 10.0,
      height: 10.0,
      alignment: new Alignment(0.0, 0.0),//设置子控件的位置
//      color: Colors.brown,
      child: new Text('这是一个Container',
        textAlign:TextAlign.center ,//设置文字居中
        style: new TextStyle(
          color: Colors.white,
        ),
      ),//显示的内容
      padding: EdgeInsets.all(0.0),//设置子控件padding
      margin: EdgeInsets.all(50.0),//设置子控件margin
//      foregroundDecoration:,  设置子控件上面的装饰
//      constraints:  设置子控件尺寸约束的条件 比如 宽高
      decoration: new BoxDecoration(//设置子控件背后的装饰
          color: Colors.blue,  //和Container下面的color会冲突 具体原因不详
          border: new Border.all(//添加边框
            width: 10.0,//边框宽度
            color: Colors.green,//边框颜色
          ),
          borderRadius: new BorderRadius.all(Radius.circular(20.0)),//设置圆角
          boxShadow: <BoxShadow>[//设置阴影
//          new BoxShadow(
//            color: Colors.black,
//            blurRadius: 20.0,
//          ),
            new BoxShadow(
              color: Colors.red,//阴影颜色
              blurRadius: 20.0,//阴影大小
            ),
//          new BoxShadow(
//            color: Colors.yellowAccent,
//            blurRadius: 20.0,
//          ),
//          new BoxShadow(
//            color: Colors.blue,
//            blurRadius: 30.0,
//          )
          ]
      ),
    );
  }
}
上一篇下一篇

猜你喜欢

热点阅读