c-l/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-01-04 02:46:47 +01:00
Code Releases Activity

fix(mobile): appBar on album viewer screen animates out and doesnt alter asset grid position (#9741)

Browse source 
* Animated out top bar added, currenlty need to move up current app bar as it is too far down

* album viewer appBar animates out and does not cause screen shift

* Formatting

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
Conner Hnatiuk 2024-05-26 18:13:32 -06:00 committed by GitHub
parent 75830a4878
commit 11152f9b3d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 84 additions and 68 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
mobile/lib/pages/common/album_viewer.page.dart
View file

@ -133,7 +133,7 @@ class AlbumViewerPage extends HookConsumerWidget {
Widget buildTitle(Album album) { Widget buildTitle(Album album) {
return Padding( return Padding(
padding: const EdgeInsets.only(left: 8, right: 8, top: 24), padding: const EdgeInsets.only(left: 8, right: 8),
child: userId == album.ownerId && album.isRemote child: userId == album.ownerId && album.isRemote
? AlbumViewerEditableTitle( ? AlbumViewerEditableTitle(
album: album, album: album,
@ -228,9 +228,30 @@ class AlbumViewerPage extends HookConsumerWidget {
} }
return Scaffold( return Scaffold(
appBar: ref.watch(multiselectProvider) body: Stack(
? null children: [
: album.when( album.widgetWhen(
onData: (data) => MultiselectGrid(
renderListProvider: albumRenderlistProvider(albumId),
topWidget: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
buildHeader(data),
if (data.isRemote) buildControlButton(data),
],
),
onRemoveFromAlbum: onRemoveFromAlbumPressed,
editEnabled: data.ownerId == userId,
),
),
AnimatedPositioned(
duration: const Duration(milliseconds: 300),
top: ref.watch(multiselectProvider)
? -(kToolbarHeight + MediaQuery.of(context).padding.top)
: 0,
left: 0,
right: 0,
child: album.when(
data: (data) => AlbumViewerAppbar( data: (data) => AlbumViewerAppbar(
titleFocusNode: titleFocusNode, titleFocusNode: titleFocusNode,
album: data, album: data,
@ -242,19 +263,8 @@ class AlbumViewerPage extends HookConsumerWidget {
error: (error, stackTrace) => AppBar(title: const Text("Error")), error: (error, stackTrace) => AppBar(title: const Text("Error")),
loading: () => AppBar(), loading: () => AppBar(),
), ),
body: album.widgetWhen(
onData: (data) => MultiselectGrid(
renderListProvider: albumRenderlistProvider(albumId),
topWidget: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
buildHeader(data),
if (data.isRemote) buildControlButton(data),
],
), ),
onRemoveFromAlbum: onRemoveFromAlbumPressed, ],
editEnabled: data.ownerId == userId,
),
), ),
); );
} }

104
mobile/lib/widgets/album/album_viewer_editable_title.dart
View file

@ -36,58 +36,62 @@ class AlbumViewerEditableTitle extends HookConsumerWidget {
[], [],
); );
return TextField( return Material(
onChanged: (value) { color: Colors.transparent,
if (value.isEmpty) { child: TextField(
} else { onChanged: (value) {
ref.watch(albumViewerProvider.notifier).setEditTitleText(value); if (value.isEmpty) {
} } else {
}, ref.watch(albumViewerProvider.notifier).setEditTitleText(value);
focusNode: titleFocusNode, }
style: context.textTheme.headlineMedium, },
controller: titleTextEditController, focusNode: titleFocusNode,
onTap: () { style: context.textTheme.headlineMedium,
FocusScope.of(context).requestFocus(titleFocusNode); controller: titleTextEditController,
onTap: () {
FocusScope.of(context).requestFocus(titleFocusNode);
ref.watch(albumViewerProvider.notifier).setEditTitleText(album.name); ref.watch(albumViewerProvider.notifier).setEditTitleText(album.name);
ref.watch(albumViewerProvider.notifier).enableEditAlbum(); ref.watch(albumViewerProvider.notifier).enableEditAlbum();
if (titleTextEditController.text == 'Untitled') { if (titleTextEditController.text == 'Untitled') {
titleTextEditController.clear(); titleTextEditController.clear();
} }
}, },
decoration: InputDecoration( decoration: InputDecoration(
contentPadding: const EdgeInsets.symmetric(horizontal: 8, vertical: 8), contentPadding:
suffixIcon: titleFocusNode.hasFocus const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
? IconButton( suffixIcon: titleFocusNode.hasFocus
onPressed: () { ? IconButton(
titleTextEditController.clear(); onPressed: () {
}, titleTextEditController.clear();
icon: Icon( },
Icons.cancel_rounded, icon: Icon(
color: context.primaryColor, Icons.cancel_rounded,
), color: context.primaryColor,
splashRadius: 10, ),
) splashRadius: 10,
: null, )
enabledBorder: OutlineInputBorder( : null,
borderSide: const BorderSide(color: Colors.transparent), enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(10), borderSide: const BorderSide(color: Colors.transparent),
), borderRadius: BorderRadius.circular(10),
focusedBorder: OutlineInputBorder( ),
borderSide: const BorderSide(color: Colors.transparent), focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(10), borderSide: const BorderSide(color: Colors.transparent),
), borderRadius: BorderRadius.circular(10),
focusColor: Colors.grey[300], ),
fillColor: context.isDarkTheme focusColor: Colors.grey[300],
? const Color.fromARGB(255, 32, 33, 35) fillColor: context.isDarkTheme
: Colors.grey[200], ? const Color.fromARGB(255, 32, 33, 35)
filled: titleFocusNode.hasFocus, : Colors.grey[200],
hintText: 'share_add_title'.tr(), filled: titleFocusNode.hasFocus,
hintStyle: TextStyle( hintText: 'share_add_title'.tr(),
fontSize: 28, hintStyle: TextStyle(
color: context.isDarkTheme ? Colors.grey[300] : Colors.grey[700], fontSize: 28,
fontWeight: FontWeight.bold, color: context.isDarkTheme ? Colors.grey[300] : Colors.grey[700],
fontWeight: FontWeight.bold,
),
), ),
), ),
); );

6
mobile/lib/widgets/asset_grid/immich_asset_grid_view.dart
View file

@ -238,8 +238,10 @@ class ImmichAssetGridViewState extends ConsumerState<ImmichAssetGridView> {
} }
bool appBarOffset() { bool appBarOffset() {
return ref.watch(tabProvider).index == 0 && return (ref.watch(tabProvider).index == 0 &&
ModalRoute.of(context)?.settings.name == TabControllerRoute.name; ModalRoute.of(context)?.settings.name ==
TabControllerRoute.name) ||
(ModalRoute.of(context)?.settings.name == AlbumViewerRoute.name);
} }
final listWidget = ScrollablePositionedList.builder( final listWidget = ScrollablePositionedList.builder(