refactor: animate bottom sheet (#19655)

* refactor: animate bottom sheet

* rebase on main

---------

Co-authored-by: shenlong-tanwen <139912620+shalong-tanwen@users.noreply.github.com>
This commit is contained in:
shenlong 2025-07-01 08:53:38 +05:30 committed by GitHub
parent a3d588f6bd
commit a5c431fbf5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 96 additions and 71 deletions

View File

@ -31,8 +31,9 @@ class HomeBottomAppBar extends ConsumerWidget {
return BaseBottomSheet(
initialChildSize: 0.25,
minChildSize: 0.22,
expand: false,
actions: [
const ShareActionButton(),
if (multiselect.isEnabled) const ShareActionButton(),
if (multiselect.hasRemote) ...[
const ShareLinkActionButton(source: ActionSource.timeline),
const ArchiveActionButton(source: ActionSource.timeline),

View File

@ -43,15 +43,26 @@ class Timeline extends StatelessWidget {
}
}
class _SliverTimeline extends StatefulWidget {
class _SliverTimeline extends ConsumerStatefulWidget {
const _SliverTimeline();
@override
State createState() => _SliverTimelineState();
ConsumerState createState() => _SliverTimelineState();
}
class _SliverTimelineState extends State<_SliverTimeline> {
class _SliverTimelineState extends ConsumerState<_SliverTimeline> {
final _scrollController = ScrollController();
PersistentBottomSheetController? _bottomSheetController;
bool _isMultiSelectEnabled = false;
@override
void initState() {
super.initState();
ref.listenManual(
multiSelectProvider.select((s) => s.isEnabled),
_onMultiSelectChanged,
);
}
@override
void dispose() {
@ -59,15 +70,33 @@ class _SliverTimelineState extends State<_SliverTimeline> {
super.dispose();
}
void _onMultiSelectChanged(bool? previous, bool current) {
if (context.mounted && current != _isMultiSelectEnabled) {
setState(() {
_isMultiSelectEnabled = current;
if (current) {
_bottomSheetController = showBottomSheet(
context: context,
builder: (_) => const HomeBottomAppBar(),
);
_bottomSheetController?.closed.then((_) {
_bottomSheetController = null;
// Reset the multi-select state when the bottom sheet is closed
ref.read(multiSelectProvider.notifier).reset();
});
} else {
_bottomSheetController?.close();
}
});
}
}
@override
Widget build(BuildContext _) {
return Consumer(
builder: (context, ref, child) {
final asyncSegments = ref.watch(timelineSegmentProvider);
final maxHeight =
ref.watch(timelineArgsProvider.select((args) => args.maxHeight));
final isMultiSelectEnabled =
ref.watch(multiSelectProvider.select((s) => s.isEnabled));
return asyncSegments.widgetWhen(
onData: (segments) {
final childCount = (segments.lastOrNull?.lastIndex ?? -1) + 1;
@ -83,15 +112,14 @@ class _SliverTimelineState extends State<_SliverTimeline> {
layoutSegments: segments,
timelineHeight: maxHeight,
topPadding: totalAppBarHeight + 10,
bottomPadding:
context.padding.bottom + scrubberBottomPadding,
bottomPadding: context.padding.bottom + scrubberBottomPadding,
child: CustomScrollView(
primary: true,
cacheExtent: maxHeight * 2,
slivers: [
SliverAnimatedOpacity(
duration: Durations.medium1,
opacity: isMultiSelectEnabled ? 0 : 1,
opacity: _isMultiSelectEnabled ? 0 : 1,
sliver: const ImmichSliverAppBar(
floating: true,
pinned: false,
@ -121,21 +149,17 @@ class _SliverTimelineState extends State<_SliverTimeline> {
],
),
),
if (isMultiSelectEnabled) ...[
if (_isMultiSelectEnabled)
const Positioned(
top: 60,
left: 25,
child: _MultiSelectStatusButton(),
),
const HomeBottomAppBar(),
],
],
),
);
},
);
},
);
}
}