美文网首页
flutter BoxDecoration装饰基础

flutter BoxDecoration装饰基础

作者: 喜剧收尾_XWX | 来源:发表于2020-08-16 22:15 被阅读0次
    import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        // TODO: implement build
        return MaterialApp(
          title: "BoxDecoration装饰基础",
          home: Scaffold(
            appBar: AppBar(
              title: Text('BoxDecoration装饰基础'),
            ),
            body: Center(
                child: Opacity(
              //设置透明度
              opacity: 0.8,
              child: Container(
                width: 200,
                height: 200,
                //装饰盒子
                decoration: BoxDecoration(
                    //背景色
                    color: Colors.yellow,
                    //背景图
                    image: DecorationImage(
                        image: ExactAssetImage('images/1.jpeg'),
                        fit: BoxFit.fill //填充类型
                        ),
    
                    //添加边框
                    border: Border.all(color: Colors.grey, width: 4.0),
                    //添加边框弧度
                    borderRadius: BorderRadius.circular(30.0),
    
                    //设置阴影效果
                    boxShadow: <BoxShadow>[
                      BoxShadow(
                          color: Colors.red, //阴影颜色
                          blurRadius: 8.0, //模糊值
                          spreadRadius: 8.0, //扩展阴影半径
                          offset: Offset(-1.0, 1.0) //x和y方向的偏移量
    
                          ),
                    ]),
              ),
            )),
          ),
        );
      }
    }
    

    相关文章

      网友评论

          本文标题:flutter BoxDecoration装饰基础

          本文链接:https://www.haomeiwen.com/subject/vpiydktx.html