Flutter 浅析之 Container容器

技术无止境，只怕不学习啊，Flutter我们开始吧

Flutter Container容器
在Container容器添加Text文本以及字体大写

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),),),),);}
}

Alignment子空间的对齐方式

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),alignment: Alignment.topLeft, // 字内容的对齐方式 center居中，centerLeft居中左侧 centerRight居中右侧// bottomCenter 下居中对齐 ，bottomLeft 下左对齐，bottomRight 下右对齐// topCenter 上居中对齐，topLeft 上左对齐，topRight 上右对齐),),),);}
}

Container容器的高度宽度 以及背景色

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),alignment: Alignment.topLeft, // 字内容的对齐方式 center居中，centerLeft居中左侧 centerRight居中右侧// bottomCenter 下居中对齐 ，bottomLeft 下左对齐，bottomRight 下右对齐// topCenter 上居中对齐，topLeft 上左对齐，topRight 上右对齐width: 500,   // 宽height: 400,  // 高color: Colors.red, //颜色   color和decoration不可以同时存在),),),);}
}

Container内边距 padding

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),alignment: Alignment.topLeft, // 字内容的对齐方式 center居中，centerLeft居中左侧 centerRight居中右侧// bottomCenter 下居中对齐 ，bottomLeft 下左对齐，bottomRight 下右对齐// topCenter 上居中对齐，topLeft 上左对齐，topRight 上右对齐width: 500,   // 宽height: 400,  // 高color: Colors.red, //颜色   color和decoration不可以同时存在padding: const EdgeInsets.fromLTRB(20.0,20.0,20.0,20.0), // 边距 all 包括上下左右  fromLTRB 上下左右分别设置边距fromLTRB(20.0,20.0,20.0,20.0)),),),);}
}

Container外边距margin

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),alignment: Alignment.topLeft, // 字内容的对齐方式 center居中，centerLeft居中左侧 centerRight居中右侧// bottomCenter 下居中对齐 ，bottomLeft 下左对齐，bottomRight 下右对齐// topCenter 上居中对齐，topLeft 上左对齐，topRight 上右对齐width: 500,   // 宽height: 400,  // 高color: Colors.red, //颜色   color和decoration不可以同时存在padding: const EdgeInsets.fromLTRB(20.0,20.0,20.0,20.0), // 边距 all 包括上下左右  fromLTRB 上下左右分别设置边距fromLTRB(20.0,20.0,20.0,20.0)margin: const EdgeInsets.all(30.0), // 外间距),),),);}

Container渐变色decoration

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),alignment: Alignment.topLeft, // 字内容的对齐方式 center居中，centerLeft居中左侧 centerRight居中右侧// bottomCenter 下居中对齐 ，bottomLeft 下左对齐，bottomRight 下右对齐// topCenter 上居中对齐，topLeft 上左对齐，topRight 上右对齐width: 500,   // 宽height: 400,  // 高
//            color: Colors.red, //颜色   color和decoration不可以同时存在padding: const EdgeInsets.fromLTRB(20.0,20.0,20.0,20.0), // 边距 all 包括上下左右  fromLTRB 上下左右分别设置边距fromLTRB(20.0,20.0,20.0,20.0)margin: const EdgeInsets.all(30.0), // 外间距decoration: new BoxDecoration( // 渐变gradient: const LinearGradient(colors:[Colors.lightBlue,Colors.greenAccent,Colors.purple],),),),),),);}
}

Container边框border

class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new MaterialApp(title: 'Startup Name Generator',theme: new ThemeData(primaryColor: Colors.white,),home: Scaffold(body: Center(child: Container(child: Text("Hello xinge", // 文字内容style: TextStyle(fontSize: 40.0), // 字体样式 字体大小),alignment: Alignment.topLeft, // 字内容的对齐方式 center居中，centerLeft居中左侧 centerRight居中右侧// bottomCenter 下居中对齐 ，bottomLeft 下左对齐，bottomRight 下右对齐// topCenter 上居中对齐，topLeft 上左对齐，topRight 上右对齐width: 500,   // 宽height: 400,  // 高
//            color: Colors.red, //颜色   color和decoration不可以同时存在padding: const EdgeInsets.fromLTRB(20.0,20.0,20.0,20.0), // 边距 all 包括上下左右  fromLTRB 上下左右分别设置边距fromLTRB(20.0,20.0,20.0,20.0)margin: const EdgeInsets.all(30.0), // 外间距decoration: new BoxDecoration( // 渐变gradient: const LinearGradient(colors:[Colors.lightBlue,Colors.greenAccent,Colors.purple],),border: Border.all(width: 5.0,color: Colors.red),  // 边框),),),),);}
}

Container 到此为止，其他的大家可以自行查询API