【Flutter】Container组件添加背景图片

Container属性介绍:

Container({
    Key? key,
    this.alignment,//对齐方式
    this.padding,//内边距
    this.color,//颜色
    this.decoration,//背景装饰,背景图片就是在这里设置
    this.foregroundDecoration,
    double? width,//宽度
    double? height,//高度
    BoxConstraints? constraints,
    this.margin,//外边距
    this.transform,
    this.transformAlignment,
    this.child,
    this.clipBehavior = Clip.none,
  })

decoration背景图片添加代码r , W格式

Container(
      decoration: BoxDecoration(
        borderRadius:
            BorderRadius.all(Radius.circular(8.0)), 
            //这是添加圆角,'8.0'为圆角大小,
        // 背景圖片代码
        image: DecorationImage(
          image: NetworkImage('url'),
          //url为图片网络路径
          fit: BoxFit.cover,
          //'cover'显示方式为平铺
          // 可选格式:fill,contain,cover,fitWidth,fitHeight,none,scaleDown
        ),
      ),
    )

© 版权声明
THE END
喜欢就支持一下吧
分享