Flutter基础总结(9) 层叠布局高斯模糊

日常生活需要良性循环。人生只有一次,休息是为了走更远的路。每个月定出一天可以彻底休息,放自己一天假。

1: 效果图

image.png

2: 代码:

import 'dart:ui' as prefix0;

import 'package:flutter/material.dart';
import 'dart:ui';
void main() => runApp(MyApp());

class MyApp extends StatelessWidget{

@override
Widget build(BuildContext context) {
return MaterialApp(
  title: 'Flutter Demo',
  theme: ThemeData(
    primarySwatch: Colors.blue
  ),      
  home: Scaffold(
    body:FrosterGlassDemo(),
  ),
);
  }
}

class FrosterGlassDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
  body: Stack(
    children: [
      ConstrainedBox(
        constraints: const BoxConstraints.expand(),
        child: Image.network("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1545738629147&di=22e12a65bbc6c4123ae5596e24dbc5d3&imgtype=0&src=http%3A%2F%2Fpic30.photophoto.cn%2F20140309%2F0034034413812339_b.jpg"),
      ),
      Center(
        child: ClipRect(
          child: BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 5.0,sigmaY: 5.0),
            child: Opacity(
              opacity: 0.5,
              child: Container(
                width: 500,
                height: 700,
                decoration: BoxDecoration(color: Colors.grey.shade200),
                child: Center(
                  child: Text(
                    'varenyzc',
                    style: Theme.of(context).textTheme.display3,
                  ),
                ),
              ),
            )
          ),
        ),
      )
    ],
  ),
);
}
}

githup :https://github.com/xuezhihuixzh/Flutter_demo.git

你可能感兴趣的:(Flutter基础总结(9) 层叠布局高斯模糊)