Flutter GETX:如何从控制器更新Get.defaultDialog(...)数据

irlmq6kh  于 2023-04-13  发布在  Flutter
关注(0)|答案(2)|浏览(353)

一个按钮用GETX(Get.defaultDialog)打开警报对话框,我在对话框中有一个图像拾取器按钮,其中包含Image.File(...),当我从图库中拾取图像时,只有当我离开对话框并打开另一个对话框时,图像才不会更新,我想在用GETX选择图像后更新Image.File
update();在控制器功能没有更新,我累了GetxBuilder在对话框中,但我得到一个错误
第一档桉

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"),
        ),
      ],);
}

并且控制器文件

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");
  }
}

}

和主文件

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

ncgqoxb01#

如果您试图在对话框中进行任何更新**update();**方法将不起作用,因为直到我知道这个方法只能更新上下文,而不是任何类型的覆盖,所以如果你想在对话框中选择显示后更新图像,你必须重建它,这样它才能反映你的图像。

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"),
            ),
          ],
        );
      },
    );
  },
);
j8ag8udp

j8ag8udp2#

将imagePath变量更改为obs并使用OBX Package UI
例如:在控制器中

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

在带有Obx的UI Package 中,例如:

....
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")
)),
....

相关问题