flutter_folderview 0.2.2
flutter_folderview: ^0.2.2 copied to clipboard
A customizable Flutter widget for displaying hierarchical data in tree and folder views with rich theming support.
0.2.2 #
Refactoring #
- Node Layout Alignment: Unified expand icon logic to ensure consistent alignment.
- Added
isChildparameter to_buildExpandIconto return a placeholderSizedBoxfor child nodes. - Replaced manual spacing in
_buildChildNodeContentwith the unified icon builder. - Ensured child nodes maintain the same horizontal indentation as parent nodes.
0.2.1 #
Features #
- Interaction Color Theming: Added
hoverColor,splashColor, andhighlightColorproperties to all node themesFolderNodeTheme,ParentNodeTheme, andChildNodeThemenow support customizable interaction colors- Colors fall back to Material theme defaults when not specified
- Theme demo updated with interactive color pickers for all interaction colors
- Tooltip Support: Added comprehensive tooltip theming for all node types
- New
NodeTooltipThemeclass with configurable position, style, and behavior - Added
tooltipThemeproperty toFolderNodeTheme,ParentNodeTheme, andChildNodeTheme - Support for both static messages and rich formatted content via
richMessage - Dynamic tooltip content through
richMessageResolverfunction based on node data - Customizable positioning (top/bottom), colors, margins, and wait duration
- New
- Configurable Row Height: Added
rowHeightproperty toFlutterFolderViewTheme- Centralized row height configuration (default: 40.0)
- Replaces hardcoded height values in
NodeWidgetandSizeService - Consistent height calculation across all components
- Configurable Row Spacing: Added
rowSpacingproperty toFlutterFolderViewTheme- Vertical spacing between rows/nodes (default: 0.0)
- Vertical lines extend through spacing areas to maintain continuous tree structure
- Uses
ListView.separatedwhen spacing is enabled for optimal rendering - Dynamic connector positioning based on row height
Refactoring #
- Simplified Spacing Control: Removed
iconToTextSpacingproperty from all node themes- Icon-to-text spacing is now controlled via icon
margin.rightfor better consistency - Reduced API surface and eliminated redundant spacing configuration
- Icon-to-text spacing is now controlled via icon
0.2.0 #
BREAKING CHANGES #
- Theme System Refactor: Migrated from unified
FolderViewTextThemeandFolderViewIconThemeto node-type specific themes- Replaced
textThemeandiconThemewithfolderTheme,parentTheme,childTheme, andexpandIconTheme - Old theme classes (
FolderViewTextTheme,FolderViewIconTheme) have been removed FlutterFolderViewThemeconstructor now requires new theme parameters
- Replaced
Features #
- Granular Widget Control: Each node type now accepts custom
Widget?instead of hardcodedIconwidgets- Added
widgetproperty for all node types - Added
openWidgetproperty for folder nodes (displayed when expanded) - Widgets are automatically wrapped in
SizedBoxwith controllablewidthandheight
- Added
- Individual Spacing Control:
- Added
paddingandmarginproperties for each widget type (folder, parent, child, expand icon) - Added
iconToTextSpacingproperty per node type for precise spacing control
- Added
- Enhanced Child Node Theming:
selectedTextStyleandselectedBackgroundColorare now exclusive toChildNodeTheme- Clearer separation of selection styling from other node types
- Added
clickIntervalproperty for configurable double-click detection (default: 300ms)
- New Theme Classes:
FolderNodeTheme: Complete control over folder appearance including open/closed statesParentNodeTheme: Dedicated theme for parent nodesChildNodeTheme: Enhanced theme with selection-specific propertiesExpandIconTheme: Separate theme for expand/collapse icons
- Interaction Customization:
- Added
animationDurationproperty toFlutterFolderViewThemefor configurable expand/collapse animation speed (default: 200ms) - Click interval only applies to child nodes; folder/parent nodes use immediate single-click behavior
- Added
- Theme Resolver Functions: Dynamic styling based on node data
- Added
widgetResolverto all node themes for data-driven widget selection - Added
textStyleResolverto all node themes for data-driven text styling - Added
selectedTextStyleResolvertoChildNodeThemefor dynamic selected state styling - Added
openWidgetResolvertoFolderNodeThemeandParentNodeThemefor expanded state customization - Resolver functions receive
Node<T>and can accessnode.datafor conditional styling - If resolver returns
null, falls back to default theme properties
- Added
- Generic Type Support: All theme classes now support generic type parameter
<T>FlutterFolderViewTheme<T>,FolderNodeTheme<T>,ParentNodeTheme<T>,ChildNodeTheme<T>- Type-safe access to
node.datain resolver functions FolderView<T>andFolderViewTheme<T>support custom data types
Examples #
- Completely redesigned Theme Demo page with real-time controls for:
- Icon size, color, padding, margin for all node types
- Icon-to-text spacing adjustments
- Font size and text color customization
- Border radius and line style controls
- Interaction controls: click interval (100-1000ms) and animation duration (50-800ms)
- Double-click demonstration with visual feedback
- Live preview of theme changes
- New Resolver Demo page demonstrating dynamic theme resolution:
- Custom
FileDataclass withenabledandisImportantproperties - Icon changes based on node data (disabled = red block icon, important = yellow star icon)
- Text style changes based on node data (disabled = grey strikethrough, important = bold blue)
- Real-world example of conditional styling using resolver functions
- Custom
Migration Guide #
Replace old theme usage:
// Before
FlutterFolderViewTheme(
iconTheme: FolderViewIconTheme(...),
textTheme: FolderViewTextTheme(...),
)
// After
FlutterFolderViewTheme(
folderTheme: FolderNodeTheme(
widget: Icon(Icons.folder),
openWidget: Icon(Icons.folder_open),
width: 20, height: 20,
padding: EdgeInsets.zero,
margin: EdgeInsets.zero,
iconToTextSpacing: 8,
textStyle: TextStyle(...),
),
parentTheme: ParentNodeTheme(...),
childTheme: ChildNodeTheme(
widget: Icon(Icons.insert_drive_file),
clickInterval: 300, // milliseconds for double-click detection
...
),
expandIconTheme: ExpandIconTheme(...),
animationDuration: 200, // milliseconds for expand/collapse animation
)
Using theme resolvers for dynamic styling:
// Define custom data type
class FileData {
final bool enabled;
final bool isImportant;
}
// Create theme with resolver functions
FlutterFolderViewTheme<FileData>(
childTheme: ChildNodeTheme<FileData>(
widget: Icon(Icons.insert_drive_file, color: Colors.grey),
// Widget resolver: change icon based on node data
widgetResolver: (node) {
if (node.data?.enabled == false) {
return Icon(Icons.block, color: Colors.red);
}
if (node.data?.isImportant == true) {
return Icon(Icons.star, color: Colors.amber);
}
return null; // Use default widget
},
// Text style resolver: change style based on node data
textStyleResolver: (node) {
if (node.data?.enabled == false) {
return TextStyle(color: Colors.grey, decoration: TextDecoration.lineThrough);
}
if (node.data?.isImportant == true) {
return TextStyle(color: Colors.blue, fontWeight: FontWeight.bold);
}
return null; // Use default textStyle
},
),
)
// Use with typed nodes
FolderView<FileData>(
data: [
Node<FileData>(
id: '1',
label: 'Important File',
type: NodeType.child,
data: FileData(enabled: true, isImportant: true),
),
],
)
0.1.2 #
Bug Fixes #
- Fixed scroll position being reset when expanding/collapsing nodes by removing contentHeight from SyncedScrollControllers key
0.1.1 #
0.1.0 #
Initial Release #
Features
- Dual View Modes: Support for both Tree and Folder view modes
- Node Types: Three node types (Folder, Parent, Child) for flexible hierarchy representation
- Line Styles: Multiple line styles (Connector, Scope, None) for visual tree structure
- Rich Theming: Comprehensive theming system including:
- Icon theme with customizable icons and colors
- Text theme for different node types
- Line theme for tree connectors
- Scrollbar theme
- Spacing theme
- Node style theme with border customization
- Interactive Features:
- Node selection support
- Tap, double-tap, and secondary tap handlers
- Expand/collapse animations
- Smart Scrolling: Synchronized horizontal and vertical scrolling with custom scrollbars
- Depth-based Indentation: Proper indentation for nested nodes at any depth level
Bug Fixes
- Correct indent and line positioning for nested nodes based on depth level