Flutter学习基础组件之Container

Container相当于iOS中的UIView,可以设置大小，颜色，边框，圆角等属性

MaterialApp、Center和Scaffold也是基础组件，这里先做简单了解

void main() => runApp(MyApp());//入口函数

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override//代表重写build方法，build方法类似于ViewControllerr里的ViewDidLoad
  Widget build(BuildContext context) {
    return MaterialApp(//MaterialApp和Scaffold
      home: Scaffold(
        appBar: AppBar(
          title: Text('Demo',
            style: TextStyle(
              color: Colors.red
            ),),
        ),
        body: HomeContent(),//页面展示的内容
      )
    );
  }
}

Container用法在这里，它的属性有
width、height、child、decoration（背景色，圆角，边框都在这里设置）

class HomeContent extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Center(//让Container在屏幕中居中显示
      child: Container(
        width: 200,
        height: 200,
        decoration: BoxDecoration(
          color: Colors.red,//背景色
          border: Border.all(//边框
            color: Colors.black,//边框色
            width: 5//边框宽度
          ),
          borderRadius: BorderRadius.all(
            Radius.circular(10),//设置圆角
          ),
        ),
        padding: EdgeInsets.all(20),//内边距
        alignment: Alignment.bottomRight,//内部内容的对齐方式
        child: Text('内容',
        textAlign: TextAlign.center,//对齐方式
          overflow: TextOverflow.ellipsis,//超出范围的显示方式为3个.
          maxLines: 1,//最大显示行数
        style: TextStyle(fontSize: 30,
          color: Colors.orange
        ),
        ),
      ),
    );
  }
}