I have problem with using condition to display an image-CodePudding

I am using image picker to get image from user then displayed in "CreateCard" UI.

The issue occur when i try using condition in my UI file, i need the condition so i can check if the file image is null before i can display it.

I am working with flutter GetX..

"CreateCard "UI Code:

 GetBuilder<CreateCardContollerImp>(builder: (controller) =>UploadImage(
                            ontap: () {
                              showModalBottomSheet(
                                  context: context,
                                  builder: (context) {
                                    return CreateCardBottomSheet(
                                        uploadImageGallery: () {
                                      controller.uploadImageGallery();
                                    });
                                  });
                            },
                            image: controller.image == null             // Error occur here !
                                ? AssetImage(AppImageAsset.profileimage)
                                : FileImage(controller.image),
                          ),),

"UploadImage" Deifiniton:

class UploadImage extends StatelessWidget {
  final void Function() ontap;
  final ImageProvider<Object> image;
  const UploadImage({super.key, required this.ontap, required this.image});

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: ontap,
      child: Stack(children: [
        Container(
          width: 170,
          height: 170,
          decoration: BoxDecoration(
            boxShadow: const [
              BoxShadow(
                offset: Offset(0, 0),
                color: AppColor.primaryColor,
                blurRadius: 0,
              ),
            ],
            borderRadius: BorderRadius.circular(100),
          ),
          padding: const EdgeInsets.symmetric(vertical: 5),
          child: CircleAvatar(
            backgroundImage: image,
            radius: MediaQuery.of(context).size.width - 310,
          ),
        ),
      ]),
    );
  }
}

"CreateCard" Controller:


class CreateCardContollerImp extends CreateCardContoller {
  GlobalKey<FormState> formstate = GlobalKey<FormState>();
  final imagepicker = ImagePicker();
  late String imagePath;
  late File image;

  @override
  uploadImageGallery() async {
    final pickedimage = await imagepicker.getImage(source: ImageSource.gallery);
    if (pickedimage != null) {
      image = File(pickedimage.path);
      imagePath = pickedimage.path;
      update();
    } else {
      printError(info: "No image selected");
    }
  }

I was expecting this method will work fine.

CodePudding user response：

you're logic looks fine, try casting the as ImageProvider:

controller.image == null
       ? AssetImage(AppImageAsset.profileimage) as ImageProvider
       : FileImage(controller.image) as ImageProvider,

CodePudding user response：

Another alternative is to try just using ImageProvider directly without unnecessary casting.

controller.image == null
       ? AssetImage(AppImageAsset.profileimage)
       : NetworkImage(controller.image),

TheAssetImage is used in getting the avatar profile image from the app's asset.

The NetworkImage is used in getting the avatar profile image from the online DB or API.