zoukankan      html  css  js  c++  java
  • flutter 毛玻璃

    代码:

    import 'package:flutter/material.dart';
    import 'dart:ui';//过滤器组件

    class MaoBaoLi extends StatelessWidget {
    const MaoBaoLi({Key key}) : super(key: key);

    @override
    Widget build(BuildContext context) {
    return Scaffold(
    body: Stack(
    children: <Widget>[
    ConstrainedBox(
    //约束条件
    constraints: const BoxConstraints.expand(),//随着里面的东西扩展
    child: Image.network('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1578312966654&di=09a975b6c05a1447fc6f8aeae463cf41&imgtype=0&src=http%3A%2F%2Fp2.qhimgs4.com%2Ft0128307802c64fd817.jpg'),
    ),//约束性盒子,添加额外的约束条件 约束在child 上
    Center(
    //可裁切的矩形
    child: ClipRect(
    //背景过滤器
    child: BackdropFilter(
    //图片过滤器
    filter: ImageFilter.blur(sigmaX:5.0 ,sigmaY: 5.0),
    //透明度
    child: Opacity(opacity: 0.5,child: Container(
    500.0,
    height: 700.0,
    decoration: BoxDecoration(color: Colors.orange.shade200),//盒子修饰器
    child: Center(
    child: Text('嵌套真多',style: Theme.of(context).textTheme.display2,),//字体皮肤---就是字号的区别
     
    ),
    ),),
    ),


    ),
    )
    ],
     

    ),//层叠组件
    );
    }
    }
    总结:

    毛玻璃

     

    图片过滤器

    filter:ImageFilter.blur//模糊效果

    stack()//层叠组件

  • 相关阅读:
    Vue的基本使用
    django中的跨表查询梳理
    docker安装及配置
    大数据分析(一)探索性分析
    搜索引擎-一种提示词推荐算法
    shell变量详解
    机器学习之寻找KMeans的最优K
    大数据系统之监控系统(二)Flume的扩展
    大数据系统之监控系统(一)
    大数据系统之系统设计
  • 原文地址:https://www.cnblogs.com/pp-pping/p/12180379.html
Copyright © 2011-2022 走看看