make photo bigger when click on flutter-CodePudding

how to make the picture zoomable when the photo is clicked, here's the code I made to display the image

     Column(
      children: [
        image11 != null
            ? Image.file(
                image11,
                width: 50,
                height: 50,
                fit: BoxFit.cover,
              )
            : Text("  Bagian Belakang"),
        Container(
          margin: const EdgeInsets.fromLTRB(14, 5, 0, 0),
          child: RaisedButton(
            padding: EdgeInsets.all(10),
            onPressed: () {
              pickImage11(ImageSource.camera);
            },
            child: Icon(Icons.camera),
          ),
        ),
      ],
    ),

CodePudding user response：

Taking inspiration from this answer Hero animation with an AlertDialog

You can use a Hero widget combined with a PageRouteBuilder to imitate a zoom feature:

Navigator.of(context).push(
           PageRouteBuilder(
                opaque: false,
                barrierDismissible:true,
                pageBuilder: (BuildContext context, _, __) {
                  return Hero(
                      tag: "zoom",
                      child: Image.file(...),
                    );
                }
            )
        );

EDIT: I found barrier dismissable not working and found the solution here: Flutter SizeTransition and PageRouteBuilder not working You will have to wrap the Hero widget with a defined width and height to get the optimum zoom level.