Home > Back-end >  Dead code warning when setting color dynamically
Dead code warning when setting color dynamically

Time:02-24

I'm trying to make buttons that turn grey after having been pressed. I read up on how to do this. The best way I could find is to set the material color with a tertiary operator and then change the condition for that in a setState(() {}) block:

  Container vehicleButton(IconData icon_, String text_, {required Function onClickAction}){
    const double buttonSizeX = 200;
    const double buttonSizeY = 100;
    const double iconSize = 60;
    const double buttonTextSize = 15;

    const double buttonMargin = 5;
    
    Color buttonColor = const Color(0xff2196f3);
    const Color iconColor = Color(0xffffffff);
    const Color buttonTextColor = Color(0xffffffff);

    bool pressed = false;

    return Container(padding: const EdgeInsets.only(left: buttonMargin, right: buttonMargin, top: buttonMargin, bottom: buttonMargin), child: SizedBox.fromSize(
      size: Size(buttonSizeX, buttonSizeY), child: Material(color: pressed ? Color.fromARGB(255, 143, 143, 143) : buttonColor, child: InkWell(
      onTap: () {
        setState(() {
          pressed = true;
        });
        onClickAction();
      },
      child: Column(mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[
          Icon(icon_, color: iconColor, size: iconSize),
          Text(text_, style: TextStyle(fontSize: buttonTextSize, color: buttonTextColor)),
    ])))));
  }

However, I'm getting a warning that the code after the ? in my tertiary operator is dead code. And indeed, the button does not turn grey after pressing.

I thought maybe the values of Material are final and cannot be changed, but this wouldn't explain why all the examples I could find on the internet use this method.

CodePudding user response:

Instead of using a SizedBox I suggest you to use the buttons provided by flutter dev: https://docs.flutter.dev/release/breaking-changes/buttons

A simple try you can give is:

RaisedButton(
      child: new Text('Attention'),
      textColor: Colors.white,
      color: pressColor ? Colors.grey : Colors.blue, //Choose your personal colors
      onPressed: () => setState(() => pressColor = !pressColor), //change the button colors
    );

CodePudding user response:

Inside Material property, replace color: pressed ? with color: pressed == true ?

CodePudding user response:

Is it necessary to use tertiary operator? you me change value of buttonColor in function you are calling in onClickAction.

Color buttonColor = const Color(0xff2196f3);
  Container vehicleButton(IconData icon_, String text_,
      {required Function onClickAction}) {
    const double buttonSizeX = 200;
    const double buttonSizeY = 100;
    const double iconSize = 60;
    const double buttonTextSize = 15;

    const double buttonMargin = 5;
    const Color iconColor = Color(0xffffffff);
    const Color buttonTextColor = Color(0xffffffff);
    const Color clickedcolor = Color.fromARGB(255, 143, 143, 143);

    return Container(
        padding: const EdgeInsets.only(
            left: buttonMargin,
            right: buttonMargin,
            top: buttonMargin,
            bottom: buttonMargin),
        child: SizedBox.fromSize(
            size: Size(buttonSizeX, buttonSizeY),
            child: Material(
                color: buttonColor,
                child: InkWell(
                    onTap: () {
                      setState(() {});
                      onClickAction();
                    },
                    child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          Icon(icon_, color: iconColor, size: iconSize),
                          Text(text_,
                              style: TextStyle(
                                  fontSize: buttonTextSize,
                                  color: buttonTextColor)),
                        ])))));
  }
  //pass it on onClickAction
  onClick() {
    debugPrint("CLICKED");
    buttonColor = Color.fromARGB(255, 143, 143, 143);
  }
  • Related