mirror of
https://gitlab.com/nkming2/nc-photos.git
synced 2025-02-02 06:46:22 +01:00
Make nav bar part of app bar instead in collections page
This commit is contained in:
parent
121f611c7f
commit
6f148e57d1
5 changed files with 74 additions and 91 deletions
|
@ -20,6 +20,7 @@ class HomeSliverAppBar extends StatelessWidget {
|
||||||
this.menuActions,
|
this.menuActions,
|
||||||
this.onSelectedMenuActions,
|
this.onSelectedMenuActions,
|
||||||
this.isShowProgressIcon = false,
|
this.isShowProgressIcon = false,
|
||||||
|
this.bottom,
|
||||||
});
|
});
|
||||||
|
|
||||||
@override
|
@override
|
||||||
|
@ -39,6 +40,7 @@ class HomeSliverAppBar extends StatelessWidget {
|
||||||
blurFilter: Theme.of(context).appBarBlurFilter,
|
blurFilter: Theme.of(context).appBarBlurFilter,
|
||||||
floating: true,
|
floating: true,
|
||||||
automaticallyImplyLeading: false,
|
automaticallyImplyLeading: false,
|
||||||
|
bottom: bottom,
|
||||||
actions: [
|
actions: [
|
||||||
...actions ?? [],
|
...actions ?? [],
|
||||||
if (menuActions?.isNotEmpty == true)
|
if (menuActions?.isNotEmpty == true)
|
||||||
|
@ -70,6 +72,7 @@ class HomeSliverAppBar extends StatelessWidget {
|
||||||
|
|
||||||
/// Screen specific action buttons
|
/// Screen specific action buttons
|
||||||
final List<Widget>? actions;
|
final List<Widget>? actions;
|
||||||
|
final PreferredSizeWidget? bottom;
|
||||||
|
|
||||||
/// Screen specific actions under the overflow menu. The value of each item
|
/// Screen specific actions under the overflow menu. The value of each item
|
||||||
/// much >= 0
|
/// much >= 0
|
||||||
|
|
|
@ -142,7 +142,6 @@ class _WrappedHomeCollectionsState extends State<_WrappedHomeCollections>
|
||||||
? const _AppBar()
|
? const _AppBar()
|
||||||
: const _SelectionAppBar(),
|
: const _SelectionAppBar(),
|
||||||
),
|
),
|
||||||
const _NavigationBar(),
|
|
||||||
const SliverToBoxAdapter(
|
const SliverToBoxAdapter(
|
||||||
child: SizedBox(height: 8),
|
child: SizedBox(height: 8),
|
||||||
),
|
),
|
||||||
|
|
|
@ -31,6 +31,10 @@ class _AppBar extends StatelessWidget {
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
bottom: const PreferredSize(
|
||||||
|
preferredSize: Size.fromHeight(48),
|
||||||
|
child: _NavigationBar(),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -44,19 +44,22 @@ class HomeCollectionsNavBarButton extends StatelessWidget {
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return ActionChip(
|
return Theme(
|
||||||
avatar: icon,
|
data: Theme.of(context).copyWith(canvasColor: Colors.transparent),
|
||||||
label: Row(
|
child: ActionChip(
|
||||||
mainAxisSize: MainAxisSize.min,
|
avatar: icon,
|
||||||
children: [
|
label: Row(
|
||||||
Text(label),
|
mainAxisSize: MainAxisSize.min,
|
||||||
if (isShowIndicator) ...const [
|
children: [
|
||||||
SizedBox(width: 4),
|
Text(label),
|
||||||
_NavBarButtonIndicator(),
|
if (isShowIndicator) ...const [
|
||||||
|
SizedBox(width: 4),
|
||||||
|
_NavBarButtonIndicator(),
|
||||||
|
],
|
||||||
],
|
],
|
||||||
],
|
),
|
||||||
|
onPressed: isEnabled ? onPressed : null,
|
||||||
),
|
),
|
||||||
onPressed: isEnabled ? onPressed : null,
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -37,88 +37,62 @@ class _NavigationBarState extends State<_NavigationBar> {
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return SliverToBoxAdapter(
|
return SizedBox(
|
||||||
child: SizedBox(
|
height: 48,
|
||||||
height: 48,
|
child: Row(
|
||||||
child: Row(
|
children: [
|
||||||
children: [
|
Expanded(
|
||||||
Expanded(
|
child: ShaderMask(
|
||||||
child: Stack(
|
shaderCallback: (rect) {
|
||||||
children: [
|
final colors = <Color>[];
|
||||||
_BlocSelector(
|
final stops = <double>[];
|
||||||
selector: (state) => state.navBarButtons,
|
if (_hasLeftContent) {
|
||||||
builder: (context, navBarButtons) {
|
colors.addAll([Colors.white, Colors.transparent]);
|
||||||
final buttons = navBarButtons
|
stops.addAll([0, .1]);
|
||||||
.map((e) => _buildButton(context, e))
|
} else {
|
||||||
.nonNulls
|
colors.add(Colors.transparent);
|
||||||
.toList();
|
stops.add(0);
|
||||||
return ListView.separated(
|
}
|
||||||
controller: _scrollController,
|
if (_hasRightContent) {
|
||||||
scrollDirection: Axis.horizontal,
|
colors.addAll([Colors.transparent, Colors.white]);
|
||||||
padding: const EdgeInsets.only(left: 16),
|
stops.addAll([.9, 1]);
|
||||||
itemCount: buttons.length,
|
} else {
|
||||||
itemBuilder: (context, i) => Center(
|
colors.add(Colors.transparent);
|
||||||
child: buttons[i],
|
stops.add(1);
|
||||||
),
|
}
|
||||||
separatorBuilder: (context, _) =>
|
return LinearGradient(
|
||||||
const SizedBox(width: 12),
|
begin: Alignment.centerLeft,
|
||||||
);
|
end: Alignment.centerRight,
|
||||||
},
|
colors: colors,
|
||||||
),
|
stops: stops,
|
||||||
if (_hasLeftContent)
|
).createShader(rect);
|
||||||
Positioned(
|
},
|
||||||
left: 0,
|
blendMode: BlendMode.dstOut,
|
||||||
top: 0,
|
child: _BlocSelector(
|
||||||
bottom: 0,
|
selector: (state) => state.navBarButtons,
|
||||||
child: IgnorePointer(
|
builder: (context, navBarButtons) {
|
||||||
ignoring: true,
|
final buttons = navBarButtons
|
||||||
child: Container(
|
.map((e) => _buildButton(context, e))
|
||||||
width: 32,
|
.nonNulls
|
||||||
decoration: BoxDecoration(
|
.toList();
|
||||||
gradient: LinearGradient(
|
return ListView.separated(
|
||||||
colors: [
|
controller: _scrollController,
|
||||||
Theme.of(context).colorScheme.background,
|
scrollDirection: Axis.horizontal,
|
||||||
Theme.of(context)
|
padding: const EdgeInsets.only(left: 16),
|
||||||
.colorScheme
|
itemCount: buttons.length,
|
||||||
.background
|
itemBuilder: (context, i) => Center(
|
||||||
.withOpacity(0),
|
child: buttons[i],
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
if (_hasRightContent)
|
separatorBuilder: (context, _) => const SizedBox(width: 12),
|
||||||
Positioned(
|
);
|
||||||
right: 0,
|
},
|
||||||
top: 0,
|
|
||||||
bottom: 0,
|
|
||||||
child: IgnorePointer(
|
|
||||||
ignoring: true,
|
|
||||||
child: Container(
|
|
||||||
width: 32,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
gradient: LinearGradient(
|
|
||||||
colors: [
|
|
||||||
Theme.of(context)
|
|
||||||
.colorScheme
|
|
||||||
.background
|
|
||||||
.withOpacity(0),
|
|
||||||
Theme.of(context).colorScheme.background,
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(width: 8),
|
),
|
||||||
const _NavBarNewButton(),
|
const SizedBox(width: 8),
|
||||||
const SizedBox(width: 16),
|
const _NavBarNewButton(),
|
||||||
],
|
const SizedBox(width: 16),
|
||||||
),
|
],
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue