flutter blur effect between two views

Question

I am trying to use blur in a view. One the first view, the user is supposed to tap on a widget so he can preview a pdf in the second view. During the process of getting the pdf file, i want to use blur. When the user has viewed his pdf, the user can come back to the view one. But my problem is that the blur effect is still on. Please, can you advise on how to cancel the blur effect when the user comeback to the view one. I have done research but did not find any information. Thank you.

    return Stack(
      children: [

        blur == false?

        Scaffold(
          appBar: AppBar(
            title: const Text ('DETAILS'),
            leading: InkWell(
                child: const Icon(Icons.close),
                onTap: () {
                  setState(() {
                   
                  });
                  Navigator.of(context).pop();
                }
            ),
            actions: [

              Padding(
                padding: const EdgeInsets.fromLTRB(0, 0, 16.0, 0),

                ///saving the modification done to a record
                child: InkWell(
                    child: const Center(
                      child: Text('Preview',
                        textScaleFactor: 1.5,
                        style: TextStyle(
                          fontSize: 12.0,
                          fontWeight: FontWeight.bold,
                          color: Colors.white,
                        ),
                      ),),

                    onTap: () async {
                      Navigator.push(context, MaterialPageRoute(builder: (context) =>
          Display_Image_From_Storage(pathSelectedImage: url,
            imageIndex: 0, //TODO voir comment modifier index
            fileName: currentFile,)));

                      setState(() {
                        blur = true;
                      });

                     

                    }),
              ),
            ],
          ),

score 1 · Accepted Answer · answered Nov 09 '22 at 21:16

Assuming the blur variable controls your blur implementation, you need to set it to false at some point in your code. The most apparent way I see from the snippet you provided can be done in your Preview Inkwell's onTap argument:

...
onTap: () async {
  setState(() => blur = true); // apply the blur

  // push the route and wait for their return
  await Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => Display_Image_From_Storage(
        pathSelectedImage: url,
        imageIndex: 0, //TODO voir comment modifier index
        fileName: currentFile,
      ),
    ),
  );

  setState(() => blur = false);  // remove the blur after returning
},
...

flutter blur effect between two views

1 Answers1