Checkbox is a checkbox component, usually used for setting options
Attributes
activeColor : Color -the color when active.
onChanged : ValueChanged -fired when changed.
tristate: bool -If true, the value of the checkbox can be true, false or null.
value : bool -the value of the checkbox
CheckboxListTile is an upper-level package of Checkbox. Its appearance is to provide a selection component similar to a setting page, which can set icons and text
Radio is used for single selection options
Attributes
Value of value radio
groupValue radio The value of the group. Value == groupValue is selected.
onChanged callback when the value changes
activeColor when selected
Example
|
class CheckWidgets extends StatefulWidget{ @override State<StatefulWidget> createState() { // TODO: implement createState return CheckWidgetState(); } } class Course{ Course(this.title,this.price,this.courseCheck); bool courseCheck; String title; double price; } class CheckWidgetState extends State<CheckWidgets> { int priceCheck=0; String doller_rupee="Rs"; List<Course>listCourse=List(); @override void initState() { // TODO: implement initState super.initState(); listCourse.add(Course("Course 1",699,false)); listCourse.add(Course("Course 2",693,false)); } @override Widget build(BuildContext context) { // TODO: implement build return Scaffold(
appBar: AppBar(title: Text("Checked Widgets"),backgroundColor: Colors.pink,), body: Container( margin: EdgeInsets.all(10), child: Column( children: <Widget>[ Card( child: Padding( padding: const EdgeInsets.all(8.0), child: Column( children: <Widget>[ Row( children: <Widget>[ Text("Price in ",style: TextStyle(color: Colors.pink,fontSize: 22),), ], ), Row( children: <Widget>[ Row( children: <Widget>[ Radio( value: 0, activeColor: Colors.pink, groupValue: priceCheck, onChanged: (newValue) { setState(() { priceCheck = newValue; doller_rupee="Rs"; }); } ), Text('Rupee') ], ), Row( children: <Widget>[ Radio( value: 1, activeColor: Colors.pink, groupValue: priceCheck, onChanged: (newValue) { setState(() { priceCheck = newValue; doller_rupee="\$"; }); } ), Text('Dollar') ], ), ], ), ], ), ), ) , Card( child: Padding( padding: const EdgeInsets.all(8.0), child: Column( children: <Widget>[ Row( children: <Widget>[ Text("Select Course",style: TextStyle(color: Colors.pink,fontSize: 24),), ], ), ListView.builder( shrinkWrap: true, itemCount: listCourse.length, itemBuilder: (ctx,pos){ return Column( children: <Widget>[ CheckboxListTile( subtitle: Text(" $doller_rupee ${listCourse[pos].price}",style: TextStyle(fontSize: 16,color: Colors.green),), title: Text(listCourse[pos].title,style: TextStyle(fontSize: 22,color: Colors.black),), checkColor:Colors.white, activeColor:Colors.pink, value: this.listCourse[pos].courseCheck, onChanged: (bool value) { setState(() { listCourse[pos].courseCheck = !listCourse[pos].courseCheck; }); }, ), Divider(height: 2,color: Colors.pink,) ], ); }) ], ), ), ),], ), ), ); } } |
