Flutter if else condition in child

Question

I am working on a flutter quiz application and it fetches question and images from JSON file When the app is running in question with no images I am getting a loading symbol & I need to remove that loading symbol in question with no images using if but I am running into errors I am attaching the Psuedo Code can someone tell how can I do it ???

 Expanded(
                              child: AspectRatio(
                                aspectRatio: 16 / 11,
                                child: ClipRect(
                                  child: SizedBox(
                                    height: 50,
                                    child: PhotoView(
                                      imageProvider: AssetImage(
                                          myQuestion[i]["Image"] ?? "None"),
                                      minScale:
                                      PhotoViewComputedScale.contained *
                                          0.5,
                                      maxScale:
                                      PhotoViewComputedScale.covered * 2,
                                      initialScale: 0.6,
                                      backgroundDecoration: BoxDecoration(
                                        color: Theme.of(context).canvasColor,
                                      ),
                                    ),
                                  ),
                                ),
                              ),
                            ),

you can make the if return the photoview or an empty final container according to the right case — Alberto Cappellina
– Alberto Cappellina, Commented Feb 26, 2020 at 16:43
Can you show how will it be done properly I am running into errors I am a novice with flutter and dart — Rahul Kumar Jha
– Rahul Kumar Jha, Commented Feb 26, 2020 at 16:48
i guess something like this... child: ( myQuestion[i]["Image"] != null ) ? PhotoView(imageProvider: AssetImage( myQuestion[i]["Image"] ...) : Container(), — Alberto Cappellina
– Alberto Cappellina, Commented Feb 26, 2020 at 18:14

user12955651 · Accepted Answer · 2020-02-26 17:14:27Z

I cannot comment yet. And I don't know exactly what kind of error you're running in but I think is the string being provided as the image source.

You can move the logic check from the AssetImage higher in the widget tree.

Expanded(
  child: AspectRatio(
    aspectRatio: 16 / 11,
    child: ClipRect(
      child: SizedBox(
        height: 50,
        child: myQuestion[i]["Image"]!=null && myQuestion[i]["Image"].isNotEmpty() 
           ? PhotoView(
               imageProvider: AssetImage( myQuestion[i]["Image"] ), // we know it's not empty and is not null
               minScale: PhotoViewComputedScale.contained * 0.5,
               maxScale: PhotoViewComputedScale.covered * 2,
               initialScale: 0.6,
               backgroundDecoration: BoxDecoration(
                 color: Theme.of(context).canvasColor,
               ),
             )
           : Container(),
         ),
      ),
   ),
),

We use a ternary operator to check if the asset is not null and is not empty. If it has a valid value we display the image otherwise we display and empty container. This logic can be moved up the widget tree depending on what you want to display and where.

I tried using the solution but still, image loading occurs To check if the empty container is working I added a text but still for questions with no images container is not being loaded This is what is being shown in the console: Image provider: AssetImage(bundle: null, name: " ") Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#8c116(), name: " ", scale: 1.0) My JSON file is something like this "Question": "C99 standard guarantees uniqueness of ____ characters for internal names.", "Image": " ", the Image path is provided in questions with images

Collectives™ on Stack Overflow

Flutter if else condition in child

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related