flutter - 背景模糊不更新

Question

我尝试通过警报对话框滑块增加背景模糊，但它没有更新。当我打印值时，它显示更新值。这是什么原因造成的。

这是我的警报对话框

_blurdialog(BuildContext context){

showDialog<void>(context:context,builder:(context){
   return AlertDialog(
    title: const Text('Background Blur'),
    content: StatefulBuilder(
    builder:(BuildContext context, StateSetter setState) {
     return Column(
       mainAxisSize:MainAxisSize.min,
       children:[
             Container(

          child: Slider(
                value: _blurvalue,
                min: 0,
                max: 5,
                divisions: 5,
                onChanged: (value) {
                setState(() {
                  _blurvalue = value;
                });
              }
            ),
        ),
       ]);
    }),
    actions: <Widget>[
      FlatButton(
        child: const Text('Done'),
        onPressed: () {

          Navigator.of(context).pop(_blurvalue);
          print(_blurvalue);
        },
      ),
    ]
  );});
}

我想要模糊的容器

Stack(children: <Widget>[ClipRect(
       child: BackdropFilter(filter: ui.ImageFilter.blur(sigmaX: _blurvalue, 
                                       sigmaY: _blurvalue),
                                  child: Container(color: Colors.black.withOpacity(0),
                                       height: 400,
                                       width: 400,),
                                   ),

标签： flutterdart

Answer 1

showDialog() 之后有 setState() 吗？请尝试如下操作。

当您使用 await 调用 showDialog 并接收数据时。并调用 setState()。

_blurdialog(BuildContext context) async {
   var newBlurValue = await showDialog<void>(context:context,builder:(context){    return
   AlertDialog(
       title: const Text('Background Blur'),
       content: StatefulBuilder(
       builder:(BuildContext context, StateSetter setState) {
        return Column(
          mainAxisSize:MainAxisSize.min,
          children:[
                Container(

             child: Slider(
                   value: _blurvalue,
                   min: 0,
                   max: 5,
                   divisions: 5,
                   onChanged: (value) {
                   setState(() {
                     _blurvalue = value;
                   });
                 }
               ),
           ),
          ]);
       }),
       actions: <Widget>[
         FlatButton(
           child: const Text('Done'),
           onPressed: () {

             Navigator.of(context).pop(_blurvalue);
             print(_blurvalue);
           },
         ),
       ]   );});
   setState(() => _blurvalue = newBlurValue);
}

------------- or ---------------
Future<dynamic> _blurdialog(BuildContext context) async {
   return await showDialog<void>(context:context,builder:(context){    return
   AlertDialog(
       title: const Text('Background Blur'),
       content: StatefulBuilder(
       builder:(BuildContext context, StateSetter setState) {
        return Column(
          mainAxisSize:MainAxisSize.min,
          children:[
                Container(

             child: Slider(
                   value: _blurvalue,
                   min: 0,
                   max: 5,
                   divisions: 5,
                   onChanged: (value) {
                   setState(() {
                     _blurvalue = value;
                   });
                 }
               ),
           ),
          ]);
       }),
       actions: <Widget>[
         FlatButton(
           child: const Text('Done'),
           onPressed: () {

             Navigator.of(context).pop(_blurvalue);
             print(_blurvalue);
           },
         ),
       ]   );});
}

...

var newBlur = await _blurdialog(context);
setState(() => _blurvalue = newBlur);