selected image not showing on showModalBottomSheet

I used imagePicker inside my showModalBottomSheet. when user select images need to show images on another widget.

Problem: Selected image is now showing after capture image from camera/gallery. need to close and reopen the bottom sheet.

This is my application structure looks like:

PostPage > Scaffold > BottomAppBar > RaisedButton(onPressed:()=> showModelSheet

class _PostPageState extends State<PostPage> {

 List<File> camera = [];

  updateImage(File updateCamera) {
        setState(() {
          print(updateCamera);
          camera.add(updateCamera);
        });
      }
...
Scaffold(
     body: PostList(),
     bottomNavigationBar: BottomAppBar(
     ...
    onPressed: () =>showModelSheet(context, widget.subPost);
}

}//closed build method

then,

  void showModelSheet(BuildContext context, PostModel subPost) {
    showModalBottomSheet(
        context: context,
        isScrollControlled: true,
        builder: (builder) {
          return StatefulBuilder(
              builder: (BuildContext context, StateSetter setModelState) {
            return SingleChildScrollView(
              child: Container(
                child: Padding(
                  padding: EdgeInsets.only(...),
                  child: Column(
                    children: <Widget>[
                      TopLayer(context, subPost, setModelState),
                      line(context),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Camera(camera: updateImage),
                            Gallery(camera: updateImage),

                            camera != null
                                ? Container(
                                child: ListView.builder(
                                scrollDirection: Axis.horizontal,
                                itemCount: camera.length,
                                itemBuilder: (context, index) {
                                  return Container(
                                    child: Image.file(
                                      camera[index],
                                      fit: BoxFit.fill,
                                    ),
                                  );
                                }))
                                : Container(
                                    height: 43,
                                    width: 45,
                                    color: Colors.red,
                                  )

CAMERA class

class Camera extends StatefulWidget {
  var camera;
  Camera({this.camera});
  @override
  _CameraState createState() => _CameraState();
}

class _CameraState extends State<Camera> with SingleTickerProviderStateMixin {
  final FocusNode myFocusNode = FocusNode();
  File _image;
  String profilePath;

  Future getImage() async {
    File image = await ImagePicker.pickImage(source: ImageSource.camera);
    setState(() {
      widget.camera(_image);
    });
  }

Solution 1: Praneeth Dhanushka Fernando

This is because showModalBottomSheet is not stateful. It will not rebuild when you call set state in parent class. So it will not trigger to camera != null. The solution for this is you need to pass a stateful widget into the showModalBottomSheet.

void showDigiemosBottomSheet(context) {
showModalBottomSheet(
  context: context,
  builder: (BuildContext buildContext) => NewStatefulWidget());
}

and then you can change state inside NewStatefulWidget which will rebuild on state change. You can also pass parameters from parent to NewStatefulWidget through its constructor NewStatefulWidget(camera)