I am currently learning Flutter and making good progress so please bear with me if this is a noob question.
Flutter recently updated to 1.9.1 and with that came the new widget ToggleButton Class;
It was just what I was after so I have implemented the widget in my code as follow
var isSelected1 = [false, true];
var isSelected2 = [false, true];
ToggleButtons(
borderColor: Colors.black,
fillColor: Colors.grey,
borderWidth: 2,
selectedBorderColor: Colors.black,
selectedColor: Colors.white,
borderRadius: BorderRadius.circular(0),
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Open 24 Hours',
style: TextStyle(fontSize: 16),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Custom Hours',
style: TextStyle(fontSize: 16),
),
),
],
onPressed: (int index) {
setState(() {
for (int buttonIndex = 0;
buttonIndex < isSelected2.length;
buttonIndex++) {
if (buttonIndex == index) {
isSelected2[buttonIndex] = true;
} else {
isSelected2[buttonIndex] = false;
}
}
});
},
isSelected: isSelected2,
),`
What I am trying to do is display a widget when a button is selected.
I have tried numerous ways with the if, and, else statements and so far I cant figure it out.
for example
if (buttonIndex == index[0]) {
// code here}
else {
//code here}
Where am I going wrong?
Thank you!
import 'package:flutter/material.dart';
class SamplePage extends StatefulWidget {
@override
_SamplePageState createState() => _SamplePageState();
}
class _SamplePageState extends State<SamplePage> {
List<bool> isSelected;
@override
void initState() {
isSelected = [true, false];
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('ToggleButtons'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
ToggleButtons(
borderColor: Colors.black,
fillColor: Colors.grey,
borderWidth: 2,
selectedBorderColor: Colors.black,
selectedColor: Colors.white,
borderRadius: BorderRadius.circular(0),
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Open 24 Hours',
style: TextStyle(fontSize: 16),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Custom Hours',
style: TextStyle(fontSize: 16),
),
),
],
onPressed: (int index) {
setState(() {
for (int i = 0; i < isSelected.length; i++) {
isSelected[i] = i == index
}
});
},
isSelected: isSelected,
),
],
),
),
);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With