I am new to flutter. I have two buttons in a row and I want to change the colour and the text of the first button when it is pressed to something else and if the second button is pressed the first button should go back to the default colour and the second button should go to the new colour. Is there any way I can achieve this by indexing?
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
height: 150,
width: MediaQuery.of(context).size.width * 0.45,
child: RaisedButton(
color: primaryColor,
onPressed: () {},
child: Padding(
padding: const EdgeInsets.only(top: 20.0),
child: Column(
children: [
Text('Stunning Solo', style: TextStyle(fontSize: 15,color: Colors.white)),
Text('Current Plan', style: TextStyle(fontSize: 12,color: Colors.white)),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text("\$$dollars3",style: TextStyle(fontSize: 20,color: Colors.white)),
),
Text(
"Free forever",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 13,
color: whiteColor),
),
],
),
),
),
),
SizedBox(height: 20),
SizedBox(
height: 150,
width: MediaQuery.of(context).size.width * 0.45,
child: RaisedButton(
color: primaryColor,
onPressed:
() {},
child: Column(
children: [
Padding(
padding: const EdgeInsets.only(top: 20.0),
child: Text('Startup Pack', style: TextStyle(fontSize: 15,color: Colors.white)),
),
Text('Introductory Offer', style: TextStyle(fontSize: 12,color: Colors.white)),
Padding(
padding: const EdgeInsets.all(10.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text(
"\$$dollars",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
decoration: TextDecoration.lineThrough),
),
SizedBox(width: 5),
Text(
"\$$dollars2",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
color: whiteColor),
),
]),