CODEWITHSUNDEEP
flutterflutter-layout
Nomad09
Nomad09

Reputation: 199

button that effects 2 different states

I have a blue grey button that when pressed, turns green and then when pressed again turns back to blue grey. I now need that same button to also tick up an integer when pressed and then to tick down the integer when pressed again. here is the code:

class _MainPageState extends State<MainPage> {
  int secondaryLeftCounter = 0;                                 //integer to change

  bool so1HasBeenPressed01 = false;


@override
Widget build(BuildContext context) {
  return Row(
  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
  children: [
    ClipRRect(
      borderRadius: BorderRadius.circular(50.0),
      child: InkWell(
        onTap: () {
          setState(() {
            so1HasBeenPressed01 = !so1HasBeenPressed01;
          });
        },
        child: Container(
          width: 30.0,
          height: 30.0,
          color: so1HasBeenPressed01
              ? Colors.green
              : Colors.blueGrey[900],
        ),
      ),
    ),],);

I can make it work if there are two buttons (one for ticking up and one for ticking down) but am struggling to get it to work with everything happening with the same button. cheers

Upvotes: 1

Views: 299

Answers (1)

amir_a14
amir_a14

Reputation: 2040

Use this code:

    onTap: () {
      setState(() {
        so1HasBeenPressed01 = !so1HasBeenPressed01;
        if(so1HasBeenPressed01)
          secondaryLeftCounter++;
        else
          secondaryLeftCounter--;
      });
    },

Upvotes: 1

Related Questions