Flutter笔记6：DecoratedBox装饰盒子

DecoratedBox装饰盒子，是用来给别的容器进行装饰的widget，使用方法如下：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'BottomAppBar组件',
      home: Scaffold(
        appBar: AppBar(title: Text('BottomAppBar组件')),
        body: Center(
          child: Container(
            width: 200.0,
            height: 200.0,
            //装饰盒子，对父组件进行装饰
            child: DecoratedBox(
              //背景和内容位置 background：背景在内容之下， foreground：背景在内容之上
              position: DecorationPosition.foreground,
              decoration: BoxDecoration(
                  //背景颜色
                  color: Colors.grey,
                  //背景图片
                  image: DecorationImage(
                    //背景色填充方式
                    fit: BoxFit.cover,
                    image: ExactAssetImage('assets/bg.jpg'),
                  ),
                  //圆角
                  borderRadius: BorderRadius.circular(150),
                  //边框
                  border: Border.all(
                      color: Colors.red,
                      //边框粗细
                      width: 6.0),
                  shape: BoxShape.circle),
              child: Text(
                '定位演示',
                style: TextStyle(fontSize: 30.0),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

部分素材资源来源网站，本站提供免费下载，如有侵权请联系站长马上删除！