mirrors/material_3_expressive
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

Refactor NavigationRailM3E theme to use expanded and collapsed height properties for items

Browse source
This commit is contained in:
Emily Pauli 2025-10-25 22:59:08 +02:00
commit d3ad4b9c9d
3 changed files with 15 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

4
packages/navigation_rail_m3e/lib/src/rail_item.dart
View file

@ -36,7 +36,9 @@ class RailItem extends StatelessWidget {
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context).extension<NavigationRailM3ETheme>() ?? final theme = Theme.of(context).extension<NavigationRailM3ETheme>() ??
const NavigationRailM3ETheme(); const NavigationRailM3ETheme();
final height = destination.short ? theme.itemShortHeight : theme.itemHeight; final height = destination.short
? theme.itemCollapsedHeight
: theme.itemExpandedHeight;
final Widget button = RailItemButtonM3E( final Widget button = RailItemButtonM3E(
icon: destination.icon, icon: destination.icon,

3
packages/navigation_rail_m3e/lib/src/rail_item_button_m3e.dart
View file

@ -58,7 +58,8 @@ class RailItemButtonM3E extends StatelessWidget {
const NavigationRailM3ETheme(); const NavigationRailM3ETheme();
final tokens = NavigationRailTokensAdapter(context); final tokens = NavigationRailTokensAdapter(context);
final double height = expanded ? theme.itemHeight : theme.itemHeight; final double height =
expanded ? theme.itemCollapsedHeight : theme.itemCollapsedHeight;
final bool selected = isSelected; final bool selected = isSelected;
// Colors and shape per state. // Colors and shape per state.

18
packages/navigation_rail_m3e/lib/src/rail_theme.dart
View file

@ -9,8 +9,8 @@ class NavigationRailM3ETheme extends ThemeExtension<NavigationRailM3ETheme> {
this.collapsedWidth = 96.0, this.collapsedWidth = 96.0,
this.expandedMinWidth = 220.0, this.expandedMinWidth = 220.0,
this.expandedMaxWidth = 360.0, this.expandedMaxWidth = 360.0,
this.itemHeight = 64.0, this.itemExpandedHeight = 40.0,
this.itemShortHeight = 56.0, this.itemCollapsedHeight = 56.0,
this.iconSize = 24.0, this.iconSize = 24.0,
this.indicatorLeading = 16.0, this.indicatorLeading = 16.0,
this.indicatorTrailing = 16.0, this.indicatorTrailing = 16.0,
@ -31,10 +31,10 @@ class NavigationRailM3ETheme extends ThemeExtension<NavigationRailM3ETheme> {
final double expandedMaxWidth; final double expandedMaxWidth;
/// Default height of an item. /// Default height of an item.
final double itemHeight; final double itemExpandedHeight;
/// Short item height variant. /// Short item height variant.
final double itemShortHeight; final double itemCollapsedHeight;
/// Default icon size used for items. /// Default icon size used for items.
final double iconSize; final double iconSize;
@ -80,8 +80,8 @@ class NavigationRailM3ETheme extends ThemeExtension<NavigationRailM3ETheme> {
collapsedWidth: collapsedWidth ?? this.collapsedWidth, collapsedWidth: collapsedWidth ?? this.collapsedWidth,
expandedMinWidth: expandedMinWidth ?? this.expandedMinWidth, expandedMinWidth: expandedMinWidth ?? this.expandedMinWidth,
expandedMaxWidth: expandedMaxWidth ?? this.expandedMaxWidth, expandedMaxWidth: expandedMaxWidth ?? this.expandedMaxWidth,
itemHeight: itemHeight ?? this.itemHeight, itemExpandedHeight: itemHeight ?? this.itemExpandedHeight,
itemShortHeight: itemShortHeight ?? this.itemShortHeight, itemCollapsedHeight: itemShortHeight ?? this.itemCollapsedHeight,
iconSize: iconSize ?? this.iconSize, iconSize: iconSize ?? this.iconSize,
indicatorLeading: indicatorLeading ?? this.indicatorLeading, indicatorLeading: indicatorLeading ?? this.indicatorLeading,
indicatorTrailing: indicatorTrailing ?? this.indicatorTrailing, indicatorTrailing: indicatorTrailing ?? this.indicatorTrailing,
@ -105,8 +105,10 @@ class NavigationRailM3ETheme extends ThemeExtension<NavigationRailM3ETheme> {
lerpDouble(expandedMinWidth, other.expandedMinWidth, t)!, lerpDouble(expandedMinWidth, other.expandedMinWidth, t)!,
expandedMaxWidth: expandedMaxWidth:
lerpDouble(expandedMaxWidth, other.expandedMaxWidth, t)!, lerpDouble(expandedMaxWidth, other.expandedMaxWidth, t)!,
itemHeight: lerpDouble(itemHeight, other.itemHeight, t)!, itemExpandedHeight:
itemShortHeight: lerpDouble(itemShortHeight, other.itemShortHeight, t)!, lerpDouble(itemExpandedHeight, other.itemExpandedHeight, t)!,
itemCollapsedHeight:
lerpDouble(itemCollapsedHeight, other.itemCollapsedHeight, t)!,
iconSize: lerpDouble(iconSize, other.iconSize, t)!, iconSize: lerpDouble(iconSize, other.iconSize, t)!,
indicatorLeading: indicatorLeading:
lerpDouble(indicatorLeading, other.indicatorLeading, t)!, lerpDouble(indicatorLeading, other.indicatorLeading, t)!,