app bar layout padding review

This commit is contained in:
Thibault Deckers 2025-05-30 18:03:29 +02:00
parent bae6d2b7c4
commit 81a2b84c9f
4 changed files with 10 additions and 5 deletions

View file

@ -9,8 +9,8 @@ import 'package:provider/provider.dart';
class FilterBar extends StatefulWidget { class FilterBar extends StatefulWidget {
static const EdgeInsets chipPadding = EdgeInsets.symmetric(horizontal: 4); static const EdgeInsets chipPadding = EdgeInsets.symmetric(horizontal: 4);
static const EdgeInsets rowPadding = EdgeInsets.symmetric(horizontal: 4); static const EdgeInsets rowPadding = EdgeInsets.symmetric(horizontal: 4);
static const double verticalPadding = 16; static const EdgeInsets padding = EdgeInsets.only(top: 4, bottom: 8);
static const double preferredHeight = AvesFilterChip.minChipHeight + verticalPadding; static final double preferredHeight = AvesFilterChip.minChipHeight + padding.vertical;
final List<CollectionFilter> filters; final List<CollectionFilter> filters;
final bool interactive; final bool interactive;
@ -84,6 +84,7 @@ class _FilterBarState extends State<FilterBar> {
return Container( return Container(
// specify transparent as a workaround to prevent // specify transparent as a workaround to prevent
// chip border clipping when the floating app bar is fading // chip border clipping when the floating app bar is fading
padding: FilterBar.padding,
color: Colors.transparent, color: Colors.transparent,
height: FilterBar.preferredHeight, height: FilterBar.preferredHeight,
child: AnimatedList( child: AnimatedList(

View file

@ -8,6 +8,8 @@ class CrumbLine<T> extends StatefulWidget {
final T Function(BuildContext context, int index) combine; final T Function(BuildContext context, int index) combine;
final void Function(T combined) onTap; final void Function(T combined) onTap;
static const EdgeInsets padding = EdgeInsets.only(top: 6, bottom: 20);
const CrumbLine({ const CrumbLine({
super.key, super.key,
required this.split, required this.split,
@ -18,7 +20,7 @@ class CrumbLine<T> extends StatefulWidget {
@override @override
State<CrumbLine<T>> createState() => _CrumbLineState<T>(); State<CrumbLine<T>> createState() => _CrumbLineState<T>();
static double getPreferredHeight(TextScaler textScaler) => textScaler.scale(kToolbarHeight); static double getPreferredHeight(TextScaler textScaler) => textScaler.scale(22) + padding.vertical;
} }
class _CrumbLineState<T> extends State<CrumbLine<T>> { class _CrumbLineState<T> extends State<CrumbLine<T>> {

View file

@ -65,7 +65,8 @@ class _ExplorerAppBarState extends State<ExplorerAppBar> with WidgetsBindingObse
actions: _buildActions, actions: _buildActions,
bottom: LayoutBuilder( bottom: LayoutBuilder(
builder: (context, constraints) { builder: (context, constraints) {
return SizedBox( return Container(
padding: CrumbLine.padding,
width: constraints.maxWidth, width: constraints.maxWidth,
height: CrumbLine.getPreferredHeight(MediaQuery.textScalerOf(context)), height: CrumbLine.getPreferredHeight(MediaQuery.textScalerOf(context)),
child: ValueListenableBuilder<VolumeRelativeDirectory?>( child: ValueListenableBuilder<VolumeRelativeDirectory?>(

View file

@ -170,7 +170,8 @@ class _FilterGridAppBarState<T extends CollectionFilter, CSAD extends ChipSetAct
if (_showGroupCrumbLine(context)) if (_showGroupCrumbLine(context))
LayoutBuilder( LayoutBuilder(
builder: (context, constraints) { builder: (context, constraints) {
return SizedBox( return Container(
padding: CrumbLine.padding,
width: constraints.maxWidth, width: constraints.maxWidth,
height: CrumbLine.getPreferredHeight(MediaQuery.textScalerOf(context)), height: CrumbLine.getPreferredHeight(MediaQuery.textScalerOf(context)),
child: Selector<FilterGroupNotifier, Uri?>( child: Selector<FilterGroupNotifier, Uri?>(