Flutter: I don't want to uploading an image into server but i want to make it optional but an error appears "null check operator used on a null value"

Question

I make uploading an image into server and it work but i want to make it optional, its up to user whether want to upload or not. But an error appears "null check operator used on a null value" if did not pick any image. If pick an image it's work. So how to solve this because i already googling and updated my code as suggested but none of them worked.

class _AduanPageState extends State<AduanPage> {
    File? image;
    
      Future pickImage(ImageSource source) async {
        try {
          final image = await ImagePicker().pickImage(source: source);
          if (image == null) return;
    
          final imageTemp = File(image!.path);
          setState(() {
            this.image = imageTemp;
          });
        } on PlatformException catch (e) {
          print('Failed to pick image: $e');
        }
      }
    
      @override
      void initState() {
        super.initState();
        setState(() {
        });
      }
    
      @override
      Widget build(BuildContext context) {
    
        return SingleChildScrollView(
          scrollDirection: Axis.vertical,
          child: Form(
            key: _formKey,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Container(
                  child: Visibility(
                    visible: _isvisible,
                    child: Column(
                      children: [
                        Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 25.0),
                          child: Container(
                            decoration: BoxDecoration(
                              color: Colors.grey[200],
                              border: Border.all(color: Colors.white),
                              borderRadius: BorderRadius.circular(12),
                            ),
                            child: Column(
                              children: [
                                SizedBox(height: 10),
                                image != null
                                    ? Column(
                                        children: [
                                          Container(
                                            child: Image.file(
                                              image!,
                                              width: 160,
                                              height: 160,
                                              fit: BoxFit.cover,
                                            ),
                                          ),
                                          Container(
                                            child: ElevatedButton(
                                                style: ElevatedButton.styleFrom(
                                                    backgroundColor: Colors.red,
                                                    fixedSize: Size(150, 40)),
                                                onPressed: () {
                                                  setState(() {
                                                    image = null;
                                                  });
                                                },
                                                child: Icon(
                                                  Icons.delete_forever_outlined,
                                                  size: 35,
                                                )),
                                          ),
                                          SizedBox(height: 10),
                                        ],
                                      )
                                    :
    
                                    SizedBox(height: 10),
                                Container(
                                  width: MediaQuery.of(context).size.width,
                                  child: Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceEvenly,
                                      children: [
                                        ElevatedButton(
                                          style: ElevatedButton.styleFrom(
                                              shape: RoundedRectangleBorder(
                                                  borderRadius:
                                                      BorderRadius.circular(10.0)),
                                              backgroundColor: kBiruGelap,
                                              foregroundColor: Colors.white,
                                              fixedSize: Size(150, 50)),
                                          onPressed: () =>
                                              pickImage(ImageSource.gallery),
                                          child: Icon(
                                            Icons.image_outlined,
                                            size: 35,
                                          ),
                                        ),
                                        ElevatedButton(
                                            style: ElevatedButton.styleFrom(
                                                shape: RoundedRectangleBorder(
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            10.0)),
                                                backgroundColor: kBiruGelap,
                                                foregroundColor: Colors.white,
                                                fixedSize: Size(150, 50)),
                                            onPressed: () =>
                                                pickImage(ImageSource.camera),
                                            child: Icon(
                                              Icons.camera_alt_outlined,
                                              size: 35,
                                            )
                                            ),
                                      ]),
                                ),
                                SizedBox(height: 10),
                              ],
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                ),
                SizedBox(height: 10),
                ElevatedButton(
                  style: ElevatedButton.styleFrom(
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(10.0)),
                      backgroundColor: kBiruGelap,
                      padding: EdgeInsets.symmetric(horizontal: 131, vertical: 20)),
                  onPressed: () {
                    if (_formKey.currentState!.validate()) {
                      ScaffoldMessenger.of(context).showSnackBar(
                        const SnackBar(content: Text('Aduan Sedang Dihantar')),
                      );
                      aduanF2(
                          context,
                          _jenisAduanController.text,
                          _namaController.text,
                          _noICController.text,
                          _noTelController.text,
                          _emelController.text,
                          _keteranganController.text,
                          _kategoriRosakController.text,
                          _lokasiController.text,
                          image!,
                          _AccController.text,
                          keyUsername.toString());
                    }
                  },
                  child: Text(
                    'Hantar',
                    style: GoogleFonts.robotoCondensed(fontSize: 17),
                  ),
                ),
              ],
            ),
          ),
        );
      }
    }
}

This is the error appears in debug console

════════ Exception caught by gesture ═══════════════════════════════════════════
Null check operator used on a null value
════════════════════════════════════════════════════════════════════════════════

So, how to solve this problem? Thanks in advance for those who help.

Answer 1

This is happening because you have used a null check operator on image (image!) here :

                   aduanF2(
                      context,
                      _jenisAduanController.text,
                      _namaController.text,
                      _noICController.text,
                      _noTelController.text,
                      _emelController.text,
                      _keteranganController.text,
                      _kategoriRosakController.text,
                      _lokasiController.text,
                      image!,
                      _AccController.text,
                      keyUsername.toString()
                   );

Replace it with either image ?? false or image ?? File('').

Hope it helps.

Answer 2

You can make it like this and it works!!

File image = File('');

instead of

File? image;