更新样式
This commit is contained in:
@@ -62,49 +62,49 @@ class _ReservationListBottomSheetState extends State<ReservationListBottomSheet>
|
|||||||
return SingleChildScrollView(
|
return SingleChildScrollView(
|
||||||
scrollDirection: Axis.horizontal,
|
scrollDirection: Axis.horizontal,
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||||
child: Row( children: _statusOptions.entries.map((entry) {
|
child: Row(
|
||||||
bool isSelected = _selectedStatus == entry.key;
|
children: _statusOptions.entries.map((entry) {
|
||||||
return GestureDetector(
|
bool isSelected = _selectedStatus == entry.key;
|
||||||
// 关键点:增加 HitTestBehavior.opaque 扩大点击有效范围
|
return GestureDetector(
|
||||||
behavior: HitTestBehavior.opaque,
|
behavior: HitTestBehavior.opaque,
|
||||||
onTap: () {
|
onTap: () {
|
||||||
if (_selectedStatus == entry.key) return;
|
if (_selectedStatus == entry.key) return;
|
||||||
|
|
||||||
// 立即执行刷新逻辑
|
// 立即执行刷新逻辑
|
||||||
_controller.getReservationList(addStatus: entry.key);
|
_controller.getReservationList(addStatus: entry.key);
|
||||||
|
|
||||||
// 先更新本地状态改变 UI 选中效果
|
// 先更新本地状态改变 UI 选中效果
|
||||||
setState(() {
|
setState(() {
|
||||||
_selectedStatus = entry.key;
|
_selectedStatus = entry.key;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
child: Container(
|
child: Container(
|
||||||
margin: const EdgeInsets.only(right: 12),
|
margin: const EdgeInsets.only(right: 12),
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 8),
|
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 8),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
// 选中色使用深绿色,未选中保持纯白
|
// 选中色使用深绿色,未选中保持纯白
|
||||||
color: isSelected ? const Color(0xFF006633) : Colors.white,
|
color: isSelected ? const Color(0xFF006633) : Colors.white,
|
||||||
borderRadius: BorderRadius.circular(25), // 圆角稍微调大一点更像胶囊
|
borderRadius: BorderRadius.circular(25),
|
||||||
boxShadow: [
|
boxShadow: [
|
||||||
BoxShadow(
|
BoxShadow(
|
||||||
color: Colors.black.withOpacity(0.04),
|
color: Colors.black.withOpacity(0.04),
|
||||||
blurRadius: 6,
|
blurRadius: 6,
|
||||||
offset: const Offset(0, 2),
|
offset: const Offset(0, 2),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
child: Text(
|
||||||
|
entry.key == '' ? '全部' : entry.value,
|
||||||
|
style: TextStyle(
|
||||||
|
// 未选中文字颜色微调为图片中的灰蓝色
|
||||||
|
color: isSelected ? Colors.white : const Color(0xFFAAB6C3),
|
||||||
|
fontSize: 14.sp,
|
||||||
|
fontWeight: isSelected ? FontWeight.bold : FontWeight.w500,
|
||||||
),
|
),
|
||||||
],
|
|
||||||
),
|
|
||||||
child: Text(
|
|
||||||
entry.key == '' ? '全部' : entry.value,
|
|
||||||
style: TextStyle(
|
|
||||||
// 未选中文字颜色微调为图片中的灰蓝色
|
|
||||||
color: isSelected ? Colors.white : const Color(0xFFAAB6C3),
|
|
||||||
fontSize: 14.sp,
|
|
||||||
fontWeight: isSelected ? FontWeight.bold : FontWeight.w500,
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
);
|
||||||
);
|
}).toList(),
|
||||||
}).toList(),
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user