Flutter Container 使用介绍

Flutter中的Container是一个用于布局和绘制的小部件，它提供了很多常用的布局和样式属性，用于定位、大小调整和装饰子小部件。

以下是Container小部件的一些常见属性：

1. alignment：控制子小部件在Container内的对齐方式。常见的值包括Alignment.topLeft、Alignment.center、Alignment.bottomRight等。

2. padding：设置Container内边距。可以使用EdgeInsets类指定不同的内边距，如EdgeInsets.all(10.0)表示四个边的内边距都是10.0。

3. color：设置Container的背景颜色。

4. width和height：设置Container的宽度和高度。

5. constraints：通过BoxConstraints类来指定Container的最小和最大宽度、高度等约束条件。

6. margin：设置Container的外边距。

7. decoration：使用BoxDecoration类来设置Container的装饰效果，如背景图片、边框等。

8. child：设置Container的子小部件。

下面是一个示例代码，展示了如何使用Container小部件：

Container(
  alignment: Alignment.center,
  padding: EdgeInsets.all(10.0),
  color: Colors.blue,
  width: 200.0,
  height: 200.0,
  margin: EdgeInsets.symmetric(vertical: 20.0),
  decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(10.0),
    border: Border.all(color: Colors.black),
  ),
  child: Text(
    'Hello, Container!',
    style: TextStyle(fontSize: 20.0),
  ),
)

Container 添加渐变色

Container(
  decoration: BoxDecoration(
    gradient: LinearGradient(
      colors: [Colors.blue, Colors.green], // 渐变色的起始颜色和结束颜色
      begin: Alignment.topLeft, // 渐变色的起始位置
      end: Alignment.bottomRight, // 渐变色的结束位置
    ),
  ),
  child: // Container的子小部件
)