Flutter中实现整个App变为灰色
生活随笔
收集整理的這篇文章主要介紹了
Flutter中实现整个App变为灰色
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
前言
為了讓更多的人永遠(yuǎn)記住12月13日,各大廠都在這一天將應(yīng)用變灰了。
那么接下來(lái)我們看一下Flutter是如何實(shí)現(xiàn)的。
Flutter中實(shí)現(xiàn)整個(gè)App變?yōu)榛疑?/h2>
在Flutter中實(shí)現(xiàn)整個(gè)App變?yōu)榛疑欠浅:?jiǎn)單的,
只需要在最外層的控件上包裹ColorFiltered,用法如下:
ColorFiltered(顏色過(guò)濾器)
看名字就知道是增加顏色濾鏡效果的,
ColorFiltered(colorFilter:ColorFilter.mode(Colors.grey, BlendMode.color),child: child,);將上面代碼放到全局根widget下,即可設(shè)置全部頁(yè)面顏色變灰
通過(guò)colorFilter可設(shè)置某種顏色過(guò)濾,比如變灰設(shè)置灰色即可,以及顏色混合模式
ColorFiltered 小部件繼承SingleChildRenderObjectWidget,因此會(huì)提供一個(gè)child子布局,這里可以放置想要過(guò)濾顏色的頁(yè)面;
最終我們就合成一張這樣帶濾鏡效果
追蹤源碼
我我們持續(xù)追蹤源碼到 RenderImage 類中,可以看到最終也是創(chuàng)建了一個(gè) ColorFilter 。
class ColorFiltered extends SingleChildRenderObjectWidget {/// Creates a widget that applies a [ColorFilter] to its child.////// The [colorFilter] must not be null.const ColorFiltered({required this.colorFilter, Widget? child, Key? key}): assert(colorFilter != null),super(key: key, child: child);/// The color filter to apply to the child of this widget.final ColorFilter colorFilter;@overrideRenderObject createRenderObject(BuildContext context) => _ColorFilterRenderObject(colorFilter);@overridevoid updateRenderObject(BuildContext context, RenderObject renderObject) {(renderObject as _ColorFilterRenderObject).colorFilter = colorFilter;}@overridevoid debugFillProperties(DiagnosticPropertiesBuilder properties) {super.debugFillProperties(properties);properties.add(DiagnosticsProperty<ColorFilter>('colorFilter', colorFilter));} }設(shè)置前
設(shè)置后
功能就這樣實(shí)現(xiàn)了,功能簡(jiǎn)單,意義不凡。
總結(jié)
以上是生活随笔為你收集整理的Flutter中实现整个App变为灰色的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: JavaScript入门【JavaScr
- 下一篇: 常用邮箱申请渠道有哪些?此文给你讲清楚了