1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-01-28 06:32:44 +01:00

fix(mobile): Fixes bottom exif info sheet modal drag controls ()

* WIPip

* Fixed show modal bottom sheet to use drag handle

* Fixes advanced bottom sheet scrolling

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
martyfuhry 2024-02-17 23:03:01 -05:00 committed by GitHub
parent 9c1dd373a5
commit 88214a485b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 135 additions and 172 deletions

View file

@ -12,92 +12,85 @@ class AdvancedBottomSheet extends HookConsumerWidget {
@override @override
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
return SingleChildScrollView( return SingleChildScrollView(
child: Card( child: Container(
shape: const RoundedRectangleBorder( margin: const EdgeInsets.symmetric(horizontal: 8.0),
borderRadius: BorderRadius.only( child: LayoutBuilder(
topLeft: Radius.circular(15), builder: (context, constraints) {
topRight: Radius.circular(15), // One column
), return Column(
), crossAxisAlignment: CrossAxisAlignment.stretch,
margin: const EdgeInsets.all(0), children: [
child: Container( const Align(
margin: const EdgeInsets.symmetric(horizontal: 8.0), child: Text(
child: LayoutBuilder( "ADVANCED INFO",
builder: (context, constraints) { style: TextStyle(fontSize: 12.0),
// One column
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
const SizedBox(height: 32.0),
const Align(
child: Text(
"ADVANCED INFO",
style: TextStyle(fontSize: 12.0),
),
), ),
const SizedBox(height: 32.0), ),
Container( const SizedBox(height: 32.0),
decoration: BoxDecoration( Container(
color: context.isDarkTheme decoration: BoxDecoration(
? Colors.grey[900] color: context.isDarkTheme
: Colors.grey[200], ? Colors.grey[900]
borderRadius: BorderRadius.circular(15.0), : Colors.grey[200],
borderRadius: BorderRadius.circular(15.0),
),
child: Padding(
padding: const EdgeInsets.only(
right: 16.0,
left: 16,
top: 8,
bottom: 16,
), ),
child: Padding( child: ListView(
padding: const EdgeInsets.only( shrinkWrap: true,
right: 16.0, physics: const NeverScrollableScrollPhysics(),
left: 16, children: [
top: 8, Align(
bottom: 16, alignment: Alignment.centerRight,
), child: IconButton(
child: ListView( onPressed: () {
shrinkWrap: true, Clipboard.setData(
children: [ ClipboardData(
Align( text: assetDetail.toString(),
alignment: Alignment.centerRight, ),
child: IconButton( ).then((_) {
onPressed: () { ScaffoldMessenger.of(context).showSnackBar(
Clipboard.setData( SnackBar(
ClipboardData(text: assetDetail.toString()), content: Text(
).then((_) { "Copied to clipboard",
ScaffoldMessenger.of(context).showSnackBar( style:
SnackBar( context.textTheme.bodyLarge?.copyWith(
content: Text( color: context.primaryColor,
"Copied to clipboard",
style: context.textTheme.bodyLarge
?.copyWith(
color: context.primaryColor,
),
), ),
), ),
); ),
}); );
}, });
icon: Icon( },
Icons.copy, icon: Icon(
size: 16.0, Icons.copy,
color: context.primaryColor, size: 16.0,
), color: context.primaryColor,
), ),
), ),
SelectableText( ),
assetDetail.toString(), SelectableText(
style: const TextStyle( assetDetail.toString(),
fontSize: 12.0, style: const TextStyle(
fontWeight: FontWeight.bold, fontSize: 12.0,
fontFamily: "Inconsolata", fontWeight: FontWeight.bold,
), fontFamily: "Inconsolata",
showCursor: true,
), ),
], showCursor: true,
), ),
],
), ),
), ),
const SizedBox(height: 32.0), ),
], const SizedBox(height: 32.0),
); ],
}, );
), },
), ),
), ),
); );

View file

@ -10,7 +10,6 @@ import 'package:immich_mobile/modules/asset_viewer/ui/description_input.dart';
import 'package:immich_mobile/modules/map/widgets/map_thumbnail.dart'; import 'package:immich_mobile/modules/map/widgets/map_thumbnail.dart';
import 'package:immich_mobile/shared/models/asset.dart'; import 'package:immich_mobile/shared/models/asset.dart';
import 'package:immich_mobile/shared/providers/asset.provider.dart'; import 'package:immich_mobile/shared/providers/asset.provider.dart';
import 'package:immich_mobile/shared/ui/drag_sheet.dart';
import 'package:immich_mobile/utils/selection_handlers.dart'; import 'package:immich_mobile/utils/selection_handlers.dart';
import 'package:immich_mobile/utils/bytes_units.dart'; import 'package:immich_mobile/utils/bytes_units.dart';
import 'package:maplibre_gl/maplibre_gl.dart'; import 'package:maplibre_gl/maplibre_gl.dart';
@ -126,20 +125,6 @@ class ExifBottomSheet extends HookConsumerWidget {
return text.isNotEmpty ? text : null; return text.isNotEmpty ? text : null;
} }
buildDragHeader() {
return const Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(height: 12),
Align(
alignment: Alignment.center,
child: CustomDraggingHandle(),
),
SizedBox(height: 12),
],
);
}
buildLocation() { buildLocation() {
// Guard no lat/lng // Guard no lat/lng
if (!hasCoordinates()) { if (!hasCoordinates()) {
@ -341,86 +326,69 @@ class ExifBottomSheet extends HookConsumerWidget {
); );
} }
return GestureDetector( return SingleChildScrollView(
onTap: () { padding: const EdgeInsets.symmetric(horizontal: 8.0),
// FocusScope.of(context).unfocus(); child: Container(
}, margin: const EdgeInsets.symmetric(horizontal: 16.0),
child: SingleChildScrollView( child: LayoutBuilder(
child: Card( builder: (context, constraints) {
shape: const RoundedRectangleBorder( if (constraints.maxWidth > 600) {
borderRadius: BorderRadius.only( // Two column
topLeft: Radius.circular(15), return Column(
topRight: Radius.circular(15), mainAxisSize: MainAxisSize.min,
), crossAxisAlignment: CrossAxisAlignment.stretch,
), children: [
margin: const EdgeInsets.all(0), buildDate(),
child: Container( if (asset.isRemote) DescriptionInput(asset: asset),
margin: const EdgeInsets.symmetric(horizontal: 16.0), Row(
child: LayoutBuilder( mainAxisAlignment: MainAxisAlignment.start,
builder: (context, constraints) { crossAxisAlignment: CrossAxisAlignment.start,
if (constraints.maxWidth > 600) { children: [
// Two column Expanded(
return Padding( child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 12.0), padding: const EdgeInsets.only(right: 8.0),
child: Column( child: buildLocation(),
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
buildDragHeader(),
buildDate(),
if (asset.isRemote) DescriptionInput(asset: asset),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Flexible(
flex: hasCoordinates() ? 5 : 0,
child: Padding(
padding: const EdgeInsets.only(right: 8.0),
child: buildLocation(),
),
),
Flexible(
flex: 5,
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: buildDetail(),
),
),
],
), ),
const SizedBox(height: 50), ),
], ConstrainedBox(
), constraints: const BoxConstraints(maxWidth: 300),
); child: Padding(
} padding: const EdgeInsets.only(left: 8.0),
child: buildDetail(),
),
),
],
),
const SizedBox(height: 50),
],
);
}
// One column // One column
return Column( return Column(
crossAxisAlignment: CrossAxisAlignment.stretch, mainAxisSize: MainAxisSize.min,
children: [ crossAxisAlignment: CrossAxisAlignment.stretch,
buildDragHeader(), children: [
buildDate(), buildDate(),
assetWithExif.when( assetWithExif.when(
data: (data) => DescriptionInput(asset: data), data: (data) => DescriptionInput(asset: data),
error: (error, stackTrace) => Icon( error: (error, stackTrace) => Icon(
Icons.image_not_supported_outlined, Icons.image_not_supported_outlined,
color: context.primaryColor, color: context.primaryColor,
), ),
loading: () => const SizedBox( loading: () => const SizedBox(
width: 75, width: 75,
height: 75, height: 75,
child: CircularProgressIndicator.adaptive(), child: CircularProgressIndicator.adaptive(),
), ),
), ),
buildLocation(), buildLocation(),
SizedBox(height: hasCoordinates() ? 16.0 : 6.0), SizedBox(height: hasCoordinates() ? 16.0 : 6.0),
buildDetail(), buildDetail(),
const SizedBox(height: 50), const SizedBox(height: 50),
], ],
); );
}, },
),
),
), ),
), ),
); );

View file

@ -136,6 +136,7 @@ class GalleryViewerPage extends HookConsumerWidget {
// swallow error silently // swallow error silently
debugPrint('Error precaching next image: $exception, $stackTrace'); debugPrint('Error precaching next image: $exception, $stackTrace');
} }
if (index < totalAssets && index >= 0) { if (index < totalAssets && index >= 0) {
final asset = loadAsset(index); final asset = loadAsset(index);
precacheImage( precacheImage(
@ -152,10 +153,11 @@ class GalleryViewerPage extends HookConsumerWidget {
borderRadius: BorderRadius.all(Radius.circular(15.0)), borderRadius: BorderRadius.all(Radius.circular(15.0)),
), ),
barrierColor: Colors.transparent, barrierColor: Colors.transparent,
backgroundColor: Colors.transparent,
isScrollControlled: true, isScrollControlled: true,
useSafeArea: true, showDragHandle: true,
enableDrag: true,
context: context, context: context,
useSafeArea: true,
builder: (context) { builder: (context) {
return Padding( return Padding(
padding: EdgeInsets.only( padding: EdgeInsets.only(