我有一個ListView.builder回傳一個InkWell帶有一個Container包含陣列值的子項的 a ，我在內部實作onTap _selectedIndex = index;以選擇單擊的陣列的每個專案，并在單擊另一個專案時取消選擇，這可以完美地作業，但現在我想要一個可以讓我選擇多個的解決方法一行中的專案（例如：如果我有一個專案陣列 [1,2,3] 點擊 1->2->3 是允許的，但是當 1->3 試圖點擊它不應該允許并顯示一條錯誤訊息）。下面是我的代碼：
String time_slot;
int _selectedIndex = -1;
Container(
height: 50,
child:new ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: dataSchedule == null ? 0 : dataSchedule.length,
itemBuilder: (BuildContext context, int index){
return InkWell(onTap: (){ setState(() {
time_slot = dataSchedule[index]['time_slot'];
_selectedIndex= index;
});
},
child: Container(
padding: EdgeInsets.all(0),
child: Card(
color: Colors.white,
elevation: 0,
semanticContainer: true,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(5.0),
),
child: Container(
decoration:
BoxDecoration(
color: Colors.white,
borderRadius:
BorderRadius
.circular(
3.0),
border:Border.all(color:scheduleField=="field require"?Colors.red: index== _selectedIndex ?
colorBlue :
Colors.grey[200],width: 2)),
padding: EdgeInsets.all(10),
child:Center(
child: Text(
dataSchedule[index]['time_slot'],style:TextStyle(fontFamily: 'Montserrat',
color: colorBlack, fontWeight: FontWeight.bold,
fontSize: 15),
textAlign: TextAlign.center,
),
),))));
}
),
),
我將非常感謝任何貢獻，如果有更多需要的資訊，我將很樂意提供。提前致謝。
uj5u.com熱心網友回復：
經過這么多的研究，我能夠通過使用 Flutter 包來解決這個問題，
flutter_multi_select_items并使用以下代碼實作它：
MultiSelectContainer(
itemsPadding: const EdgeInsets.all(10),
textStyles: const MultiSelectTextStyles(
textStyle: TextStyle(fontFamily: 'Montserrat',
fontWeight:FontWeight.bold,)),
showInListView: true,
listViewSettings: ListViewSettings( scrollDirection: Axis.horizontal,
separatorBuilder: (_, __) => const SizedBox(
width: 10,
)),
items: List.generate(dataSchedule == null ? 0 : dataSchedule.length,
(index) => MultiSelectCard(value: dataSchedule[index]['time_slot'], label: dataSchedule[index]['time_slot'],)),
onChange: (allSelectedItems, selectedItem) {
})
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/532643.html
標籤：扑列表显示列表视图项
上一篇：上網部署（銳捷無線篇）