1. 程式人生 > 程式設計 >flutter 怎麼實現app整體灰色效果

flutter 怎麼實現app整體灰色效果

Flutter 是 Google 開源的 UI 工具包,幫助開發者通過一套程式碼庫高效構建多平臺精美應用,支援移動、Web、桌面和嵌入式平臺。Flutter 開源、免費,擁有寬鬆的開源協議,適合商業專案。

舉國哀悼,進入各種大廠的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,還有別的方式可以用

效果:

之前:

[檔案]

flutter 怎麼實現app整體灰色效果

之後:

flutter 怎麼實現app整體灰色效果

總結

到此這篇關於flutter 怎麼實現app整體灰度效果的文章就介紹到這了,更多相關flutter app灰度內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!