'error with PhotoView : Looking up a deactivated widget's ancestor is unsafe

I have read few stackoverflow posts about "Looking up a deactivated widget's ancestor is unsafe" error but couldn't find an answer which work.

I've tried to set a global key with the scaffold, and to use WidgetsBinding.instance.addPostFrameCallback() without success.

I'm pretty sure I'm doing something stupid and easy to fix, but I can't figure out what.

This is a simple version of the code which replicates the error when you go back from PhotoViewPage (photo_view package) :

my_home_page.dart

import 'package:flutter/material.dart';
import 'package:phototest/photo_view_page.dart';


class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return TextButton(
      child: const Text("to PhotoView"),
      onPressed: () => _toPhotoView(context),
    );
  }

  void _toPhotoView(BuildContext context) {
    Navigator.of(context).push(
      MaterialPageRoute<dynamic>(
        builder: (BuildContext context) => const PhotoViewPage(),
      ),
    );
  }
}

photo_view_page.dart

import 'package:flutter/material.dart';
import 'package:photo_view/photo_view.dart';

class PhotoViewPage extends StatelessWidget {
  const PhotoViewPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return PhotoView(imageProvider: AssetImage("assets/image.png"));
  }
}


Solution 1:[1]

The problem is coming from photo_view package.

In pubspec.yaml remove photo_view from dependecies

dependencies:
  photo_view: ^0.13.0

Add:

dependency_overrides:
  photo_view:
    git:
      url: https://github.com/bluefireteam/photo_view
      ref: master

This way you will avoid errors in dependencies that come from the same version.

Solution 2:[2]

I'm not sure where the error was from, but switching flutter channel from master to stable fixed it.

flutter channel stable

flutter upgrade --force

Solution 3:[3]

To be honest you would be better off using InteractiveViewer than some unstable library for example

child: InteractiveViewer(
                child: Container(
                  height: double.infinity,
                  width: double.infinity,
                  decoration: BoxDecoration(color: Colors.transparent, borderRadius: BorderRadius.circular(0)),
                  child: CachedNetworkImage( imageUrl: image,
                    imageBuilder: (context, imageProvider) => Container(
                      width: double.infinity,
                      height: double.infinity,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(5) ,
                        image: DecorationImage(
                          image: imageProvider, fit: BoxFit.scaleDown,
                        ),
                      ),
                    ),
                    placeholder: (context, url) => const Center(child: CircularProgressIndicator(color: Colors.black,)),
                    errorWidget: (context, url, error) => const Icon(Icons.error),),
                  margin: const EdgeInsets.symmetric(horizontal: 20),
                ),
              ),

you archieve the same effect if all you need is to zoom in

OR

You can rebuild and stop using hot reload

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Yoann Far
Solution 3