Reputation: 17
How can i choose from a choice chip and pass that selected string value to a screen or text widget?
I found this code online and how can i pass the selected value
Widget _buildChips() {
List<Widget> chips = new List();
for (int i = 0; i < _options.length; i++) {
ChoiceChip choiceChip = ChoiceChip(
selected: _selectedIndex == i,
label: Text(_options[i], style: TextStyle(color: Colors.white)),
elevation: 3,
pressElevation: 5,
backgroundColor: Colors.grey[400],
selectedColor: Colors.lightGreen,
onSelected: (bool selected) {
setState(() {
if (selected) {
_selectedIndex = i;
}
});
},
);
chips.add(choiceChip);
}
return Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: chips,
);
}
and this is the implementation
int _selectedIndex;
List<String> _options = ['Regular', 'Hard Sleeper', 'Soft Sleeper'];
you can show me another way to do this too
Upvotes: 1
Views: 2435
Reputation: 54397
You can copy paste run full code below
You can use _options[_selectedIndex]
code snippet
Text(
'${_options[_selectedIndex]}',
style: Theme.of(context).textTheme.headline4,
),
RaisedButton(
child: Text('Open route'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SecondRoute(
selectedValue: _options[_selectedIndex],
)),
);
},
),
...
class SecondRoute extends StatelessWidget {
final String selectedValue;
SecondRoute({this.selectedValue});
working demo
full code
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _selectedIndex;
List<String> _options = ['Regular', 'Hard Sleeper', 'Soft Sleeper'];
Widget _buildChips() {
List<Widget> chips = new List();
for (int i = 0; i < _options.length; i++) {
ChoiceChip choiceChip = ChoiceChip(
selected: _selectedIndex == i,
label: Text(_options[i], style: TextStyle(color: Colors.white)),
elevation: 3,
pressElevation: 5,
backgroundColor: Colors.grey[400],
selectedColor: Colors.lightGreen,
onSelected: (bool selected) {
setState(() {
if (selected) {
_selectedIndex = i;
}
});
},
);
chips.add(choiceChip);
}
return Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: chips,
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_buildChips(),
_selectedIndex == null
? Container()
: Column(
children: [
Text(
'${_options[_selectedIndex]}',
style: Theme.of(context).textTheme.headline4,
),
RaisedButton(
child: Text('Open route'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SecondRoute(
selectedValue: _options[_selectedIndex],
)),
);
},
),
],
),
],
),
),
);
}
}
class SecondRoute extends StatelessWidget {
final String selectedValue;
SecondRoute({this.selectedValue});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("$selectedValue"),
),
body: Center(child: Text("$selectedValue")));
}
}
Upvotes: 3