github-mirrors/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2026-05-18 03:10:24 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat(mobile): increased tap area on video player overlay (#27269)

Browse Source 
* fix(mobile): improved tap area on video player

* fix: back button padding

* chore: use sizedbox.square & button padding

* chore: fixed padding
This commit is contained in:
Yaros
2026-05-09 05:47:41 +02:00
committed by GitHub
parent fdac6c8bc4
commit 41f285aa3e
3 changed files with 82 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
mobile/lib/presentation/widgets/asset_viewer/bottom_bar.widget.dart
+29 -18
View File
@@ -65,26 +65,37 @@ class ViewerBottomBar extends ConsumerWidget {
labelLarge: context.themeData.textTheme.labelLarge?.copyWith(color: Colors.white), labelLarge: context.themeData.textTheme.labelLarge?.copyWith(color: Colors.white),
), ),
), ),
child: Container( child: Stack(
decoration: const BoxDecoration( children: [
gradient: LinearGradient( const Positioned.fill(
begin: Alignment.bottomCenter, child: IgnorePointer(
end: Alignment.topCenter, child: DecoratedBox(
colors: [Colors.black45, Colors.black12, Colors.transparent], decoration: BoxDecoration(
stops: [0.0, 0.7, 1.0], gradient: LinearGradient(
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
colors: [Colors.black45, Colors.black12, Colors.transparent],
stops: [0.0, 0.7, 1.0],
),
),
),
),
), ),
), SafeArea(
child: SafeArea( top: false,
top: false, child: Padding(
child: Column( padding: const EdgeInsets.only(top: 16),
mainAxisSize: MainAxisSize.min, child: Column(
children: [ mainAxisSize: MainAxisSize.min,
if (asset.isVideo) VideoControls(videoPlayerName: asset.heroTag), children: [
if (!isReadonlyModeEnabled) if (asset.isVideo) VideoControls(videoPlayerName: asset.heroTag),
Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: actions), if (!isReadonlyModeEnabled)
], Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: actions),
],
),
),
), ),
), ],
), ),
), ),
); );
mobile/lib/presentation/widgets/asset_viewer/viewer_top_app_bar.widget.dart
+44 -35
View File
@@ -75,29 +75,41 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget {
child: AnimatedOpacity( child: AnimatedOpacity(
opacity: opacity, opacity: opacity,
duration: Durations.short2, duration: Durations.short2,
child: DecoratedBox( child: Stack(
decoration: BoxDecoration( children: [
gradient: showingDetails Positioned.fill(
? null child: IgnorePointer(
: const LinearGradient( child: DecoratedBox(
begin: Alignment.topCenter, decoration: BoxDecoration(
end: Alignment.bottomCenter, gradient: showingDetails
colors: [Colors.black45, Colors.black12, Colors.transparent], ? null
stops: [0.0, 0.7, 1.0], : const LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.black45, Colors.black12, Colors.transparent],
stops: [0.0, 0.7, 1.0],
),
), ),
), ),
child: AppBar( ),
backgroundColor: Colors.transparent, ),
leading: const _AppBarBackButton(), SafeArea(
iconTheme: const IconThemeData(size: 22, color: Colors.white), bottom: false,
actionsIconTheme: const IconThemeData(size: 22, color: Colors.white), child: SizedBox.square(
shape: const Border(), child: Theme(
actions: showingDetails || isReadonlyModeEnabled data: context.themeData.copyWith(iconTheme: const IconThemeData(size: 22, color: Colors.white)),
? null child: Row(
: isInLockedView children: [
? lockedViewActions const _AppBarBackButton(),
: actions, const Spacer(),
), if (!showingDetails && !isReadonlyModeEnabled)
if (isInLockedView) ...lockedViewActions else ...actions,
],
),
),
),
),
],
), ),
), ),
); );
@@ -113,20 +125,17 @@ class _AppBarBackButton extends ConsumerWidget {
@override @override
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
final showingDetails = ref.watch(assetViewerProvider.select((state) => state.showingDetails)); final showingDetails = ref.watch(assetViewerProvider.select((state) => state.showingDetails));
return Padding( return ElevatedButton(
padding: const EdgeInsets.only(left: 12.0), style: ElevatedButton.styleFrom(
child: ElevatedButton( backgroundColor: showingDetails ? context.colorScheme.surface : Colors.transparent,
style: ElevatedButton.styleFrom( shape: const CircleBorder(),
backgroundColor: showingDetails ? context.colorScheme.surface : Colors.transparent, iconSize: 22,
shape: const CircleBorder(), iconColor: showingDetails ? context.colorScheme.onSurface : Colors.white,
iconSize: 22, padding: const EdgeInsets.all(10.0),
iconColor: showingDetails ? context.colorScheme.onSurface : Colors.white, elevation: showingDetails ? 4 : 0,
padding: EdgeInsets.zero,
elevation: showingDetails ? 4 : 0,
),
onPressed: context.maybePop,
child: const Icon(Icons.arrow_back_rounded),
), ),
onPressed: context.maybePop,
child: const Icon(Icons.arrow_back_rounded),
); );
} }
} }
mobile/lib/widgets/asset_viewer/video_controls.dart
+9 -7
View File
@@ -119,13 +119,15 @@ class _VideoControlsState extends ConsumerState<VideoControls> {
onPressed: () => _toggle(isCasting), onPressed: () => _toggle(isCasting),
), ),
const Spacer(), const Spacer(),
Text( IgnorePointer(
"${position.format()} / ${duration.format()}", child: Text(
style: const TextStyle( "${position.format()} / ${duration.format()}",
color: Colors.white, style: const TextStyle(
fontWeight: FontWeight.w500, color: Colors.white,
fontFeatures: [FontFeature.tabularFigures()], fontWeight: FontWeight.w500,
shadows: VideoControls._controlShadows, fontFeatures: [FontFeature.tabularFigures()],
shadows: VideoControls._controlShadows,
),
), ),
), ),
const SizedBox(width: 12), const SizedBox(width: 12),