「 Flutter」Container、Image 和 ListView 控件

Container 控件

Container widget 可以用来创建一个可见的矩形元素。 Container 可以使用 BoxDecoration 来进行装饰，如背景，边框，或阴影等。 Container 还可以设置外边距、内边距和尺寸的约束条件等。另外，Container可以使用矩阵在三维空间进行转换。

class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
        child: Text('Hello Flutter'),
        alignment: Alignment.topCenter,
        height: 300.0,
        width: 300.0,
        decoration: BoxDecoration(
          color: Colors.yellow,
          border: Border.all(
            color: Colors.blue,
            width: 2.0,
          ),
        ),
      ),
    );
  }
} 

Image 控件

图片控件是显示图像的控件，常用 Image.asset 导入本地图片、Image.network 导入网络图片。

引入网络图片

class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
        width: 300,
        height: 300,
        decoration: BoxDecoration(
          color: Colors.yellow,
        ),
        child: Image.network(
          "https://flutter.cn/static/4ea7d7f5f72649f0bcec.png",
          alignment: Alignment.topLeft,
          // color: Colors.blue,
          // colorBlendMode: BlendMode.luminosity,
          fit: BoxFit.contain,
          repeat: ImageRepeat.repeat,
        ),
      ),
    );
  }
} 

实现图片的圆角

1. 使用 BoxDecoration 实现

class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
          width: 300,
          height: 300,
          decoration: BoxDecoration(
            color: Colors.yellow,
            borderRadius: BorderRadius.circular(150),
            image: DecorationImage(
              image: NetworkImage(
                  "https://flutter.cn/static/4ea7d7f5f72649f0bcec.png"),
              fit: BoxFit.contain,
              repeat: ImageRepeat.repeat,
            ),
          )),
    );
  }
} 

2. 使用 ClipOval 实现

class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      c