Home > Net >  Flutter How to make an image not show on a condition
Flutter How to make an image not show on a condition

Time:12-15

I need an image to show or not show, on a condition and the condition is that if the answer of the user is correct than the button will show but if the answer of the question is wrong than the image will not display. the condition is if (joinedWords != data[widget.CurrentIndex].sentence // dont display the next level image. if the asnwer is correct than the button will show.

 String joinedWords =
                                  selectedWords.join(" ").toString();

                              String _setRatingOnAlert() {
                                //print(controller.duration?.inSeconds);
                                print(data![widget.CurrentIndex].timer);
                                print(data[widget.CurrentIndex].level);
                                print(joinedWords);
                                print(data[widget.CurrentIndex].sentence);
                                print(widget.CurrentIndex);

                                if (joinedWords ==
                                    data[widget.CurrentIndex].sentence) {
                                  starsRating = 'assets/threestars_small.png';
                                } else {
                                  starsRating = 'assets/zerostars_small.png';
                                }
                                return starsRating;
                              }

                              return Container(
                                child: Stack(
                                  children: [
                                    Align(
                                      alignment: Alignment.bottomCenter,
                                      child: Padding(
                                        padding:
                                            const EdgeInsets.only(right: 110),
                                        child: FlatButton(
                                          onPressed: () {
                                            setState(() {
                                              selectedWords.clear();

                                              Navigator.pop(context);
                                            });
                                          },
                                          child: Image.asset(
                                            'assets/restartbutton.small.png',
                                            height: 80,
                                            width: 80,
                                          ),
                                        ),
                                      ),
                                    ),
                                    Align(
                                      alignment: Alignment.bottomCenter,
                                      child: Padding(
                                        padding:
                                            const EdgeInsets.only(left: 110),
                                        child: FlatButton(
                                          onPressed: () {
                                            Navigator.pop(context);

                                            /// E close munu
                                            Navigator.pop(context);

                                            /// E hek current quiz page
                                            Navigator.push(
                                              /// E qel next level quiz
                                              context,
                                              MaterialPageRoute(
                                                builder: (context) =>
                                                    RenditFjaletButton(
                                                  QuizList: widget
                                                      .AllQuizLists[
                                                          widget.CurrentIndex  
                                                              1]
                                                      .word,
                                                  AllQuizLists:
                                                      widget.AllQuizLists,
                                                  CurrentIndex:
                                                      widget.CurrentIndex   1,
                                                ),
                                              ),
                                            );
                                          },
                                          child: Image.asset(
                                            'assets/next_small.png', // this is the button that i   
                                                                        dont want to show if the 
                                                                        answer is wrong
                                            height: 80,
                                            width: 80,
                                          ),
                                        ),
                                      ),
                                    ),

CodePudding user response:

use ternary operator in this case. bool answer = false; //do some operation with answer;

(answer)? ShowImage():Container();

Widget showImage(){ return Container( child: Image.network( 'imagePath', fit: BoxFit.fitWidth,

); }

CodePudding user response:

You can use ternary operator incase you need the conditions.Do as follows:

isTrue? Image.asset():Container()
  • Related