我試圖通過點擊此串列上的每個標題來切換擴展面板串列中的每個串列。下面是我的代碼,我不知道是否可以通過添加 ontap 或 onpressed 函式來實作。謝謝。
Expanded(
child: SingleChildScrollView(
child: Container(
padding: EdgeInsets.only(left: w * 0.05, right: w * 0.05),
child: Column(
children: [
ExpansionPanelList(
children: [
ExpansionPanel(
isExpanded: _isOpen[0],
headerBuilder: (context, isOpen) {
return Row(
children: [
SizedBox(width: 10),
Container(
padding:
EdgeInsets.only(top: 10, bottom: 10),
child: Center(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
"Ball Games ? ??",
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w500,
color: Color(0xff262626)),
),
SizedBox(height: 5),
Text(
"Select Sport from the ball games\nsection",
style: TextStyle(
fontSize: 14,
color: Color(0xff696F79)),
),
],
),
),
),
],
);
},
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
_ballGames(),
// _ballGames(),
],
),
),
),
ExpansionPanel(
isExpanded: _isOpen[1],
headerBuilder: (context, isOpen) {
return Row(
children: [
SizedBox(width: 10),
Container(
padding:
EdgeInsets.only(top: 10, bottom: 10),
child: Center(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
"Racket & Bat ??",
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w500,
color: Color(0xff262626)),
),
SizedBox(height: 5),
Text(
"Select sport from the racket & bat\nsection",
style: TextStyle(
fontSize: 14,
color: Color(0xff696F79)),
),
],
),
),
),
],
);
},
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
_racketAndBat(),
],
),
),
),
ExpansionPanel(
isExpanded: _isOpen[2],
headerBuilder: (context, isOpen) {
return Row(
children: [
SizedBox(width: 10),
Container(
padding:
EdgeInsets.only(top: 10, bottom: 10),
child: Center(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
'Winter ??',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w500,
color: Color(0xff262626)),
),
SizedBox(height: 5),
Text(
"Select sport from the winter\nsection",
style: TextStyle(
fontSize: 14,
color: Color(0xff696F79)),
),
],
),
),
),
],
);
},
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
_winter(),
// _myListView(),
],
),
),
),
ExpansionPanel(
isExpanded: _isOpen[3],
headerBuilder: (context, isOpen) {
return Row(
children: [
SizedBox(width: 10),
Container(
padding:
EdgeInsets.only(top: 10, bottom: 10),
child: Center(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
'Water ???♀? ',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w500,
color: Color(0xff262626)),
),
SizedBox(height: 5),
Text(
"Select sport from the water\nsection",
style: TextStyle(
fontSize: 14,
color: Color(0xff696F79)),
),
],
),
),
),
],
);
},
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
_water(),
// _myListView(),
],
),
),
),
ExpansionPanel(
isExpanded: _isOpen[4],
headerBuilder: (context, isOpen) {
return Row(
children: [
SizedBox(width: 10),
Container(
padding:
EdgeInsets.only(top: 10, bottom: 10),
child: Center(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
'Others ????',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w500,
color: Color(0xff262626)),
),
SizedBox(height: 5),
Text(
"Select sports from the others\nsection",
style: TextStyle(
fontSize: 14,
color: Color(0xff696F79)),
),
],
),
),
),
],
);
},
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
_others(),
// _myListView(),
],
),
),
),
],
expansionCallback: (i, isOpen) {
setState(() {
_isOpen[i] = !isOpen;
});
},
),
],
),
),
),
),
我可以通過點擊右側的向右箭頭輕松切換串列,但我想使用每個 instaed 的整個標題。
uj5u.com熱心網友回復:
為了實作您想要的結果,您property在ExpansionPanel 中有一個名為canTapOnHeader. 你只需要設定它就true可以了。
canTapOnHeader : true,
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/391681.html
