flutter 怎么实现app整体灰度

2,098 阅读1分钟

今天举国哀悼, 进入各种大厂的app也可以看到主色都变成灰色的了

作为程序员我们肯定会想怎么可以实现的, 我简单研究了10分钟, flutter中只要在整体外面套一个ShaderMask, 然后修改blendMode即可

核心代码:

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return ShaderMask(
      child: OKToast(
        child: MaterialApp(
          title: 'Pick Image Demo',
          theme: ThemeData(
            primarySwatch: Colors.lime,
          ),
          home: MyHomePage(title: 'Pick Image Demo'),
        ),
      ),
      shaderCallback: (Rect bounds) {
        return ui.Gradient.linear(Offset.zero,
            Offset(bounds.width, bounds.height), [Colors.grey, Colors.grey]);
      },
      // blendMode: BlendMode.dst,
      blendMode: BlendMode.saturation,
    );
  }
}

在最外层套一个ShaderMask, 然后返回一个shader就可以了, 这里我用的是渐变的Gradient ,还有别的方式可以用

效果: 之前: [文件]

之后: