mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-09 22:57:21 +00:00
Implemented the selection behavior of the side tree
This commit is contained in:
@ -1,54 +1,26 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:syncrow_web/utils/color_manager.dart';
|
||||
|
||||
class CustomExpansionTileSpaceTree extends StatefulWidget {
|
||||
class CustomExpansionTileSpaceTree extends StatelessWidget {
|
||||
final String? spaceId;
|
||||
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
|
||||
final bool isSelected;
|
||||
final bool isSoldCheck;
|
||||
final bool isExpanded;
|
||||
final Function? onExpansionChanged;
|
||||
final Function? onItemSelected;
|
||||
|
||||
CustomExpansionTileSpaceTree({
|
||||
required this.title,
|
||||
this.children,
|
||||
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
|
||||
CustomExpansionTileState createState() => CustomExpansionTileState();
|
||||
}
|
||||
|
||||
class CustomExpansionTileState extends State<CustomExpansionTileSpaceTree> {
|
||||
bool _isExpanded = false; // Local expansion state
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_isExpanded = widget.initiallyExpanded;
|
||||
}
|
||||
|
||||
@override
|
||||
void didUpdateWidget(CustomExpansionTileSpaceTree oldWidget) {
|
||||
super.didUpdateWidget(oldWidget);
|
||||
// Sync local state with external control of expansion state
|
||||
if (widget.isExpanded != null && widget.isExpanded != _isExpanded) {
|
||||
setState(() {
|
||||
_isExpanded = widget.isExpanded!;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Utility function to capitalize the first letter of the title
|
||||
String _capitalizeFirstLetter(String text) {
|
||||
if (text.isEmpty) return text;
|
||||
return text[0].toUpperCase() + text.substring(1);
|
||||
}
|
||||
const CustomExpansionTileSpaceTree(
|
||||
{super.key,
|
||||
this.spaceId,
|
||||
required this.title,
|
||||
this.children,
|
||||
this.isExpanded = false,
|
||||
this.onExpansionChanged,
|
||||
this.onItemSelected,
|
||||
required this.isSelected,
|
||||
this.isSoldCheck = false});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
@ -56,14 +28,14 @@ class CustomExpansionTileState extends State<CustomExpansionTileSpaceTree> {
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
// Checkbox with independent state management
|
||||
Checkbox(
|
||||
value: widget.isSelected,
|
||||
value: isSoldCheck ? null : isSelected,
|
||||
onChanged: (bool? value) {
|
||||
if (widget.onItemSelected != null) {
|
||||
widget.onItemSelected!();
|
||||
if (onItemSelected != null) {
|
||||
onItemSelected!();
|
||||
}
|
||||
},
|
||||
tristate: true,
|
||||
side: WidgetStateBorderSide.resolveWith((states) {
|
||||
return const BorderSide(color: ColorsManager.grayBorder);
|
||||
}),
|
||||
@ -76,52 +48,52 @@ class CustomExpansionTileState extends State<CustomExpansionTileSpaceTree> {
|
||||
}),
|
||||
checkColor: ColorsManager.whiteColors,
|
||||
),
|
||||
// Expand/collapse icon, now wrapped in a GestureDetector for specific onTap
|
||||
if (widget.children != null && widget.children!.isNotEmpty)
|
||||
GestureDetector(
|
||||
if (children != null && children!.isNotEmpty)
|
||||
InkWell(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_isExpanded = !_isExpanded;
|
||||
widget.onExpansionChanged?.call(_isExpanded);
|
||||
});
|
||||
if (onExpansionChanged != null) {
|
||||
onExpansionChanged!();
|
||||
}
|
||||
},
|
||||
child: Icon(
|
||||
_isExpanded ? Icons.keyboard_arrow_down : Icons.keyboard_arrow_right,
|
||||
isExpanded ? Icons.keyboard_arrow_down : Icons.keyboard_arrow_right,
|
||||
color: ColorsManager.lightGrayColor,
|
||||
size: 16.0, // Adjusted size for better alignment
|
||||
size: 16.0,
|
||||
),
|
||||
),
|
||||
// The title text, wrapped in GestureDetector to handle selection
|
||||
Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () {
|
||||
if (widget.onItemSelected != null) {
|
||||
widget.onItemSelected!();
|
||||
if (onItemSelected != null) {
|
||||
onItemSelected!();
|
||||
}
|
||||
},
|
||||
child: Text(
|
||||
_capitalizeFirstLetter(widget.title),
|
||||
style: TextStyle(
|
||||
color: widget.isSelected
|
||||
? ColorsManager.blackColor // Change color to black when selected
|
||||
: ColorsManager.lightGrayColor, // Gray when not selected
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
_capitalizeFirstLetter(title),
|
||||
style: Theme.of(context).textTheme.bodySmall!.copyWith(
|
||||
color: isSelected
|
||||
? ColorsManager.blackColor // 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 && widget.children != null && widget.children!.isNotEmpty)
|
||||
if (isExpanded && children != null && children!.isNotEmpty)
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 48.0), // Indented children
|
||||
padding: const EdgeInsets.only(left: 48.0),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: widget.children!,
|
||||
children: children ?? [],
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
String _capitalizeFirstLetter(String text) {
|
||||
if (text.isEmpty) return text;
|
||||
return text[0].toUpperCase() + text.substring(1);
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user