[英]how to make dynamic radio button with listview builder in flutter?
我想通過向學生提供出勤狀態來使其像出勤一樣。我創建的概念是一個帶有名稱數據的列表視圖構建器,然后通過循環單選按鈕的數量來進行行。 但是,我對這個問題感到很困惑
部分收音機
Row( children: [ for(var i = 0; i < 2; i++) Radio<int>( value: i, groupValue: radioValue, activeColor: Colors.blueAccent, onChanged: handleRadioValueChanged ), ], ),
當我 select 是列表的一部分而不是其他部分時,我正在為上述代碼使用 listview builder
在下面的代碼中,我動態地展示了如何創建單選按鈕列表。
使用以下代碼,您可以為單選按鈕創建獨特的樣式。
class RootPage extends StatefulWidget {
const RootPage({Key key}) : super(key: key);
@override
State<RootPage> createState() => _RootPageState();
}
class _RootPageState extends State<RootPage> {
List<RadioItem> items = <RadioItem>[];
int groupValue = 0;
@override
void initState() {
for (int i = 0; i < 10; i++) {
items.add(RadioItem(index: i, name: 'radio ' + i.toString()));
}
super.initState();
}
@override Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: items
.map(
(data) => Card(
elevation: 3,
shadowColor: const Color(0xFFAAAAAA),
margin: const EdgeInsets.only(left: 30, right: 30, top: 15),
color: Colors.white,
shape: RoundedRectangleBorder(
side: const BorderSide(color: Colors.transparent, width: 0),
borderRadius: BorderRadius.circular(20),
),
child: InkWell(
borderRadius: BorderRadius.circular(20),
onTap: () {
setState(() {
groupValue = data.index;
});
},
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10.0),
child: Directionality(
textDirection: TextDirection.rtl,
child: Row(
children: <Widget>[
Radio(
groupValue: groupValue,
value: data.index,
onChanged: (index) {
setState(() {
groupValue = index;
});
},
),
Expanded(child: Text(data.name)),
],
),
),
),
),
),
)
.toList(),
),
);
}
}
然后添加以下class
class RadioItem {
String name;
int index;
RadioItem({this.name, this.index});
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.