如何在按钮中使用 if else if - flutter

How to use if else if in button - flutter

我有 2 个按钮,一个是时间,另一个是时间。

以下是启用和禁用按钮必须遵循的条件。

Time in button 将 enable when :

timeout != null  || timein == null //these timein and timeout values should comes from database, but in below code I am using variables and updating their values. i'm not using database values here.

它的背景色将为蓝色[500]

Time in button 将 disable when :

timein != null && timeout==null //these timein and timeout values should comes from database, but in below code I am using variables and updating their values. i'm not using database values here.

它的背景颜色会变成蓝色[200]

time out button will be, enable when:

time in != null 

超时 按钮将禁用 时间:

time in == null

这就是我所做的。

var t1="";
  var t2="";
  var timeIn;
  var timeOut;
  var timeInText="                 Time in";
  var timeOutText="                 Time out";
  bool timeInBttonPressed=false;
  bool timeOutButtonPressed=false;
          timein=="" || timeout!="" ?
          RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
          text:timeInText,
          bgcolor: timeInBttonPressed ?Colors.blue[200]:Colors.blue[500],
          press:(){
            setState(() {
                          timeInText="                 "+getTime;
                          //timein=getTime;
                          timeOutButtonPressed=true;
                          //timeInBttonPressed=true;
                          
                        });

          })
          
          //Time in, disable:
          :
          RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
          bgcolor: Colors.blue[200],
          text:"                 "+timein,
          press:(){
            setState(() {
              timeInBttonPressed=false;
                          
                        });
          })
          ),
      
   
//Time out, disable 

 timein==""?
          RoundedButton(icon: Icon(Icons.timer_off,color: Colors.white),bgcolor: Colors.blue[200],
          text: "                 Time out",color: Colors.white,
          press: (){
            setState(() {
                          timeInBttonPressed=true;
                        });
          },
          )
//time out enable
          :
          RoundedButton(icon: Icon(Icons.timer_off,color: Colors.white,),
          text: timeOutText,
          color: Colors.blue[50],
          bgcolor: timeOutButtonPressed ?Colors.blue[500]:Colors.blue[200],
          press:(){
            setState(() {
                          timeOutText="                 "+getTime;
                          //timeout=getTime;
                          //timeOutButtonPressed=!timeOutButtonPressed;
                          timeInBttonPressed=true;
                        });
          })

不符合我的要求,请大家检查一下,帮我改正我做错的地方。

--------------------编辑问题------------------------ --

我已经编辑了你的答案,这是代码

Widget _timein() {
   //enable
    if(timeout != ""  || timein == "") {
      return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
              text:timeInText,
              bgcolor: timeInBttonPressed ?Colors.blue[200]:Colors.blue[500],
              press: () {
                setState(() {
                timeInText="                 "+getTime;
                timein=getTime;
                //print("t1  "+t1);
                timeInBttonPressed=true;
                    
                                });
                
              //Your OnPress Event
              });
    }
    //disable
      else if(timein != "" && timeout=="") {
      return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
              text:timeInText,
              bgcolor: Colors.blue[200]);
      } 
    }


     Widget _timeout(){
   //enable
      if(timein != "") {
        return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
              text:timeOutText,
              bgcolor: timeOutButtonPressed ?Colors.blue[200]:Colors.blue[500],
              press: () {
                setState(() {
                timeOutText="                 "+getTime;
                timeout=getTime;
                //print("t2   "+t2);
                //timeOutButtonPressed=true;      
                timeInBttonPressed=true; 
                                });
                
        });

      }
      //disable
      else if(timein == "") {
        return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
              text:timeOutText,
              bgcolor: Colors.blue[200]);
      }
 }

它的工作原理是,最初我在按钮启用时间和超时按钮禁用是正确的,然后当我在按钮中单击时间时,它的文本更改为当前时间并且它被禁用并且超时按钮被启用,这是正确的,但是当我点击超时按钮时,它的文本变为当前时间,但颜色没有改变。我想让它在点击后禁用,按钮中的时间将被启用,反之亦然。 希望你明白我的意思。

首先"" != null。您正在将 timeIn 和 timeOut 与空字符串进行比较。另一件事是制作一个单独的函数以使其可读。

Widget _timer() {
 if(timeout != null  || timein == null) {
   return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
          text:timeInText,
          bgcolor: timeInBttonPressed ?Colors.blue[200]:Colors.blue[500],
          onPress: () {
           //Your OnPress Event
          })

 } else if(timein != null && timeout==null) {
   return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
          text:timeInText,
          bgcolor: timeInBttonPressed ?Colors.blue[200]:Colors.blue[500])
  } 
  else if(timein != null) {
    return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
          text:timeInText,
          bgcolor: timeInBttonPressed ?Colors.blue[200]:Colors.blue[500],
          onPress: () {
    //Your On Press Event
    })

  }
  else if(timein == null) {
    return RoundedButton(icon: Icon(Icons.timer,color: Colors.white),
          text:timeInText,
          bgcolor: timeInBttonPressed ?Colors.blue[200]:Colors.blue[500])
  }

当你想禁用点击事件时不要添加 属性 onPress }