title: Hero animation with an AlertDialog
body: <p>I'd like to implement a hero animation for an image on my main screen while presenting an AlertDialog widget with the same image in the dialog's content.</p>
  
  <p>I'd like the presentation to appear as in the screenshot below. When I tap the image in the bottom left, I'd like the hero animation and an inset preview of the image along with a transparent overlay that can be tapped to dismiss.</p>
  
  <p><a href="https://i.stack.imgur.com/mEJyx.png" rel="noreferrer"><img src="https://i.stack.imgur.com/mEJyx.png" alt="enter image description here"></a></p>
  
  <p>The below code doesn't perform the hero animation.</p>
  
  <pre><code>class AlertDialogTest extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return new Material(
        child: new InkWell(
          child: new Hero(
            tag: "preview",
            child: new Container(
              alignment: FractionalOffset.bottomLeft,
              child: new Image(
                image: new AssetImage('assets/images/theater.png'),
              ),
            ),
          ),
          onTap: () {
            showDialog(
              context: context,
              child: new AlertDialog(
                content: new Hero(
                  tag: "preview",
                  child: new Image(
                    image: new AssetImage('assets/images/theater.png'),
                  ),
                ),
              ),
            );
          },
        ),
      );
    }
  }
  </code></pre>