mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-09 22:57:21 +00:00
expansion only on clicking icon
This commit is contained in:
@ -5,8 +5,10 @@ class CustomExpansionTile extends StatefulWidget {
|
||||
final String title;
|
||||
final List<Widget>? children;
|
||||
final bool initiallyExpanded;
|
||||
final bool isSelected; // Add this to track selection
|
||||
final bool? isExpanded; // External control over expansion
|
||||
final ValueChanged<bool>? onExpansionChanged; // Notify when expansion changes
|
||||
final VoidCallback? onItemSelected; // Callback for selecting the item
|
||||
|
||||
CustomExpansionTile({
|
||||
required this.title,
|
||||
@ -14,6 +16,8 @@ class CustomExpansionTile extends StatefulWidget {
|
||||
this.initiallyExpanded = false,
|
||||
this.isExpanded, // Allow external control over expansion
|
||||
this.onExpansionChanged, // Notify when expansion changes
|
||||
this.onItemSelected, // Trigger item selection when name is tapped
|
||||
required this.isSelected, // Add this to initialize selection state
|
||||
});
|
||||
|
||||
@override
|
||||
@ -22,7 +26,6 @@ class CustomExpansionTile extends StatefulWidget {
|
||||
|
||||
class CustomExpansionTileState extends State<CustomExpansionTile> {
|
||||
bool _isExpanded = false; // Local expansion state
|
||||
bool _isChecked = false; // Local checkbox state
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
@ -51,57 +54,66 @@ class CustomExpansionTileState extends State<CustomExpansionTile> {
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
children: [
|
||||
// The main clickable row for the expansion tile
|
||||
InkWell(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_isExpanded = !_isExpanded;
|
||||
widget.onExpansionChanged?.call(_isExpanded);
|
||||
});
|
||||
},
|
||||
child: Row(
|
||||
children: [
|
||||
// Checkbox with independent state management
|
||||
Checkbox(
|
||||
value: _isChecked,
|
||||
onChanged: (bool? value) {
|
||||
Row(
|
||||
children: [
|
||||
// Checkbox with independent state management
|
||||
Checkbox(
|
||||
value: false,
|
||||
onChanged: (bool? value) {
|
||||
setState(() {});
|
||||
},
|
||||
side: WidgetStateBorderSide.resolveWith((states) {
|
||||
return const BorderSide(color: ColorsManager.grayBorder);
|
||||
}),
|
||||
fillColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.selected)) {
|
||||
return ColorsManager.grayBorder;
|
||||
} else {
|
||||
return ColorsManager.checkBoxFillColor;
|
||||
}
|
||||
}),
|
||||
checkColor: ColorsManager.whiteColors,
|
||||
),
|
||||
// Expand/collapse icon, now wrapped in a GestureDetector for specific onTap
|
||||
if (widget.children != null && widget.children!.isNotEmpty)
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_isChecked = value ?? false;
|
||||
_isExpanded = !_isExpanded;
|
||||
widget.onExpansionChanged?.call(_isExpanded);
|
||||
});
|
||||
},
|
||||
side: MaterialStateBorderSide.resolveWith((states) {
|
||||
return const BorderSide(color: ColorsManager.grayBorder);
|
||||
}),
|
||||
fillColor: MaterialStateProperty.resolveWith((states) {
|
||||
if (states.contains(MaterialState.selected)) {
|
||||
return ColorsManager.grayBorder;
|
||||
} else {
|
||||
return ColorsManager.checkBoxFillColor;
|
||||
}
|
||||
}),
|
||||
checkColor: ColorsManager.whiteColors,
|
||||
),
|
||||
// Show the expand/collapse icon
|
||||
if (widget.children != null && widget.children!.isNotEmpty)
|
||||
Icon(
|
||||
child: Icon(
|
||||
_isExpanded
|
||||
? Icons.keyboard_arrow_down
|
||||
: Icons.keyboard_arrow_right,
|
||||
color: Colors.grey,
|
||||
size: 16.0, // Adjusted size for better alignment
|
||||
),
|
||||
// The title text with dynamic styling
|
||||
Expanded(
|
||||
),
|
||||
// The title text, wrapped in GestureDetector to handle selection
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () {
|
||||
// Triggerxq the onItemSelected callback when the name is tapped
|
||||
if (widget.onItemSelected != null) {
|
||||
widget.onItemSelected!();
|
||||
}
|
||||
debugPrint('${widget.title} ${widget.isSelected} tapped for selection');
|
||||
},
|
||||
child: Text(
|
||||
_capitalizeFirstLetter(widget.title),
|
||||
style: TextStyle(
|
||||
color:ColorsManager.lightGrayColor,
|
||||
color: widget.isSelected
|
||||
? Colors.black // Change color to black when selected
|
||||
: ColorsManager
|
||||
.lightGrayColor, // Gray when not selected
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// The expanded section (children) that shows when the tile is expanded
|
||||
if (_isExpanded &&
|
||||
|
Reference in New Issue
Block a user