搜索了一下,并没有现成的方案,捣鼓了一下,发现有如下方案可以实现:
class MainPage extends StatefulWidget {
const MainPage({super.key});
@override State<MainPage> createState() => _MainPageState();
}
class _MainPageState extends State<MainPage> with WidgetsBindingObserver {
int _currentIndex = 0;
final PageController _pageController = PageController();
final OverlayEntry _oe = OverlayEntry(
builder: (context) => BackdropFilter(
filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
child: const SizedBox(
width: double.infinity,
height: double.infinity,
),
),
);
@override void initState() {
super.initState();
// 注册 WidgetsBinding 观察器以监听生命周期事件
WidgetsBinding.instance.addObserver(this);
}
@override void dispose() {
// 移除 WidgetsBinding 观察器
WidgetsBinding.instance.removeObserver(this);
super.dispose();
}
@override void didChangeAppLifecycleState(AppLifecycleState state) {
super.didChangeAppLifecycleState(state);
//状态有更新时
switch (state) {
case AppLifecycleState.inactive:
//实现遮罩
Overlay.of(context).insert(_oe);
break;
case AppLifecycleState.resumed:
_oe.remove();
break;
default:
break;
}
}
//这里写build代码
}
现在有个问题就是,发现无法在其他生命周期里实现遮罩,比如实现当APP切换到后台后才实现遮罩。
大家如果有什么更好的解决方案和想法欢迎提出~