skip to Main Content

A button opens alert dialog with GETX (Get.defaultDialog) and I have an image picker button with Image.File(…) in the dialog and when I pick the image from the gallery the image doesnt get updated only if I leave the dialog and open another one
I want to update the Image.File after selecting the image with GETX

I tried update(); in the controller function didnt update and I tired the GetxBuilder in the dialog but I get an error

first file

imageController controller = Get.put(imageController());
alertAddProduct() {
  Get.defaultDialog(
      title: "Add product",
      middleText: "Add product",
      //radius: 20,
      barrierDismissible: false,
      content: Column(
        children: [
          Container(
            child: controller.imagePath != null ? Image.file(controller.imagePath,errorBuilder: (context, error, stackTrace) {
            return const Text("Bruh");
          },): const Text("Pick image")
          ),
          ElevatedButton(
            onPressed: () {
              controller.getImage();
            },
            child: const Text("Select image"),
          )
        ]
      ),
      actions: [
        ElevatedButton(
            onPressed: () {
              // working on it
            },
            child: const Text("Yes")),
        ElevatedButton(
          onPressed: () {
            Get.back();
          },
          child: const Text("No"),
        ),
      ],);
}

and the controller file

import 'dart:io';

import 'package:get/get.dart';
import 'package:image_picker/image_picker.dart';

class imageController extends GetxController {
  // ignore: prefer_typing_uninitialized_variables
  var imagePath;
  void getImage() async {
  final ImagePicker picker = ImagePicker();
  final XFile? image = await picker.pickImage(
    source: ImageSource.gallery,    
    );
  if (image != null) {
    print("----------------------------" + image.path);
    imagePath = File(image.path);
    update();
  } else {
    print("---------------------------- Please select image");
  }
}


}

and the main file

floatingActionButton: FloatingActionButton(
        elevation: 5,
        onPressed: (() {
          alertAddProduct();
        }),
        child: const Icon(Icons.add),
      ),

2

Answers


  1. In case You are trying to make any updates in dialog update(); method will not work because till I know this method can update the context only not any kind of overlay,
    so if you want to update the image after selecting Show in the dialog you have to rebuild it so it can reflect your image.

    showDialog(
      context: context,
      builder: (context) {
        String contentText = "Content of Dialog";
        return StatefulBuilder(
          builder: (context, setState) {
            return AlertDialog(
              title: Text("Title of Dialog"),
              content: Text(contentText),
              actions: <Widget>[
                TextButton(
                  onPressed: () => Navigator.pop(context),
                  child: Text("Cancel"),
                ),
                TextButton(
                  onPressed: () {
                    setState(() {
                      contentText = "Changed Content of Dialog";
                    });
                  },
                  child: Text("Change"),
                ),
              ],
            );
          },
        );
      },
    );
    
    Login or Signup to reply.
  2. change you imagePath variable to obs and wrap the UI with OBX

    eg:
    In the Controller

    var imagePath = ''.obs ;
    ....
    imagePath.value = File(image.path);
    // update ---> remove update line
    

    In the UI wrap with Obx eg:

    ....
    Obx(()=>Container(
    child: 
    //Add string instead of null on comparing 
    controller.imagePath.value != '' ? 
    Image.file(controller.imagePath.value,errorBuilder: 
    (context, error, stackTrace) {
    return const Text("Bruh");},) : const Text("Pick 
    image")
    )),
    ....
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search