How to control null when bulding widget

Question

Can you tell me how can I include the condition for Image.file on the following page? I would like to build it only when controller.image is not null.

I got an error: The following NoSuchMethodError was thrown building Container(padding: EdgeInsets.all(32.0)): The method '[]' was called on null. Receiver: null Tried calling:

when I first redirect to this page (and controller.image is null):

class HomePage extends GetView<HomeController> {


  final myController1 = TextEditingController();
  final myController2 = TextEditingController();


  @override
  Widget build(BuildContext context) {



    return Scaffold(
      appBar: AppBar(
        title: Text('Grobonet'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
            children: <Widget>[
              TextField(
                controller: myController1,
                decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: 'Nazwisko'),

              ),
              TextField(
                controller: myController2,
                decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: 'Miejscowosc'),

              ),
              IconButton(
                icon: Icon(
                  Icons.add,
                  size: 30,
                ),
                onPressed: () =>
                    Get.toNamed(
                        AppRoutes.PICK_IMAGE
                    ),
                color: Colors.pink,
              ),
              IconButton(
                icon: Icon(
                  Icons.save_outlined,
                  size: 30,
                ),
                /*onPressed: () =>
                    Get.toNamed(
                        AppRoutes.PICK_IMAGE
                    ),*/
                color: Colors.pink,
              ),


              Container(
                padding: EdgeInsets.all(32),
                child:  GetBuilder<HomeController>(
                  builder: (_) {
                    return Image.file(controller.image);
                  },
                ),
              ),

            ]
        ),
      ),

    );

  }
}

Controller:

class HomeController extends GetxController {

 final image = Get.arguments['image'];
 final file_loaded = Get.arguments['file_loaded'];

}

Answer 1

You can use collection-if. Just add if (controller.image != null) like so:

          if (controller?.image != null)
          Container(
            padding: EdgeInsets.all(32),
            child:  GetBuilder<HomeController>(
              builder: (_) {
                return Image.file(controller.image);
              },
            ),
          ),

Answer 2

Use Get your arguments on the controller's onInit() method:

class HomeController extends GetxController {

   final File image;
   final File file_loaded;

   onInit(){
    image = Get.arguments['image'];
    file_loaded = Get.arguments['file_loaded'];
  }

}

In this way, you don't need to perform additional null checks except Get.arguments is actually null.

Update And you also need to update your view like this:

 Container(
        padding: EdgeInsets.all(32),
        child:  GetBuilder<HomeController>(
          builder: (_) {
            return Image.file(_.image); // not return Image.file(controller.image);
                                                // _ here is the instance of HomeController given by the GetBuilder
          },
        ),
      ),

Update 2 As you mentioned in the comments, you want to send data to a previously opened page (HomePage) from a second page (OCRDetailsPage). Then you don't need to pass arguments. You can get the HomeController instance in your OCRDetailsPage with Get.find() and set the variables and update the state like:

class OCRDetailsPage extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      final OCRDetailsController controller = Get.find();
      return Scaffold(
      appBar: AppBar(title: Text('OCR Details Page')),
      body: Center(
        child: FlatButton(
          color: Colors.blue,
          child: Icon(Icons.save_outlined),
          onPressed: () {
            final HomeController homeController = Get.find();
            homeController.ocr_text = controller.text;
            homeController.update();
            Get.toNamed(
              AppRoutes.HOME,
            );
           
          }),
       ),
     );
   }
 }