Flutter 3.29.0 BackdropGroup 共享背景滤镜层将提高多个滤镜的性能

101 阅读1分钟

2025年2月12日:3.29.0发布 。

Flutter中显示多个背景区滤镜的应用程序现在可以使用新的widget BackdropGroup 和新的 BackdropFilter.grouped 构造函数。这些可以在 Skia 后端的基础上进一步提高多个模糊效果的性能,

BackdropFilter 为所有子项建立共享背景层的小部件,共享背景滤镜层将提高多个滤镜的性能,同时必须使用[BackdropFilter.grouped]构造函数。

如下案例,ListView下所的的子Item者有滤镜,使用BackdropGroup来优化使用。

  BackdropGroup buildBackdropGroup() {
    return BackdropGroup(
      child: ListView.builder(
        itemCount: 60,
        itemBuilder: (BuildContext context, int index) {
          return ClipRect(
            child: BackdropFilter.grouped(
              filter: ui.ImageFilter.blur(sigmaX: 40, sigmaY: 40),
              child: Container(
                color: Colors.black.withOpacity(0.2),
                height: 200,
                child: const Text('Blur item'),
              ),
            ),
          );
        },
      ),
    );
  }