I was using ImagePicker in my application to select and upload images, but it recently started giving me errors, and constantly glitches when selecting png format images.

For this reason I switched to File picker. But it only works somewhat, and my application still gets stuck. I can only see its display, the image unfortunately does not get stored in the backend (jpg and jpeg images work fine).

Here is the image picker code (if there is a workaround uploading png images using this package, it would be much appreciated):

final ImagePicker _picker = ImagePicker();

  Future imageSelectorGallery() async {
    var image = (await _picker.pickImage(
      source: ImageSource.gallery,
    ));
    if (image != null) {
      Uint8List imageBytes = await image
          .readAsBytes(); // A fixed-length list of 8-bit unsigned integers which is the file read as bytes
      String baseimage = base64Encode(imageBytes);
      if (mounted) setState(() {});
      post = baseimage;
      Navigator.push(context,MaterialPageRoute(builder: (context) => CreatePosts(post,user,caption,upvotes)));
    }
  }

Here is the file picker code which I have implemented, any help figuring out the error here would also be appreciated:

Future imageSelectorGallery() async {
    FilePickerResult? image = await FilePicker.platform.pickFiles(
      type: FileType.custom,
      allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'],
    );
    if (image != null) {
      Uint8List? imageBytes = image.files.first.bytes;
      String baseimage = base64Encode(imageBytes!);
      if (mounted) setState(() {});
      post = baseimage;
      Navigator.push(
          context,
          MaterialPageRoute(
              builder: (context) => CreatePosts(post, user, caption, upvotes)));
    } else {
      print("File picker error");
    }
  }

The image is displayed using:

child: Container(
                                height:
                                    MediaQuery.of(context).size.height / 4.3,
                                width: MediaQuery.of(context).size.width / 3.4,
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(30),
                                    image: DecorationImage(
                                      fit: BoxFit.cover,
                                      image: Image.memory(
                                        _bytesImage,
                                        gaplessPlayback: true,
                                      ).image,
                                    ))),
                          ),