Container是一个组合类容器,它本身不对应具体的RenderObject,它是DecoratedBox、ConstrainedBox、Transform、Padding、Align等组件组合的一个多功能容器,。
Container({
this.alignment,
this.padding, //内边距
Color color, // 背景色
Decoration decoration, // 背景装饰
Decoration foregroundDecoration, //前景装饰
double width,//宽度
double height, //高度
BoxConstraints constraints, //容器大小的限制条件
this.margin,//外边距
this.transform, //变换
this.child,
})
容器的大小可以通过width、height属性来指定,也可以通过constraints来指定;如果它们同时存在时,width、height优先。实际上Container内部会根据width、height来生成一个constraints。
color和decoration是互斥的,如果同时设置它们则会报错!
示例
import 'package:flutter/material.dart';
import 'dart:math';
class StudyContainer extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Container"),
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
margin: const EdgeInsets.fromLTRB(50, 30, 50, 30),//外边距
width: 300,
height: 100,
// color: Colors.lightBlue,
padding: const EdgeInsets.fromLTRB(50, 0, 50, 0),
child: Text("斯是陋室,惟吾德馨。"),
alignment: Alignment.center,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [Colors.yellow,Colors.deepOrange],
),
boxShadow: [
BoxShadow(
blurRadius: 10,
color: Colors.blue
)
],
),
transform: Matrix4.rotationZ(0.2),
),
],
),
);
}
}
效果