diff --git a/mobile/lib/ui/tools/editor/video_crop_page.dart b/mobile/lib/ui/tools/editor/video_crop_page.dart index 980b10f1fa..f10bab3e82 100644 --- a/mobile/lib/ui/tools/editor/video_crop_page.dart +++ b/mobile/lib/ui/tools/editor/video_crop_page.dart @@ -1,5 +1,4 @@ import 'package:flutter/material.dart'; -import "package:flutter_svg/flutter_svg.dart"; import "package:photos/ui/tools/editor/video_editor/crop_value.dart"; import "package:photos/ui/tools/editor/video_editor/video_editor_bottom_action.dart"; import "package:photos/ui/tools/editor/video_editor/video_editor_main_actions.dart"; @@ -20,7 +19,10 @@ class _VideoCropPageState extends State { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.black, + appBar: AppBar( + elevation: 0, + toolbarHeight: 0, + ), body: SafeArea( child: Column( children: [ @@ -114,9 +116,7 @@ class _VideoCropPageState extends State { widget.controller.preferredCropAspectRatio = f?.toDouble(); } }, - child: SvgPicture.asset( - "assets/video-editor/video-crop-${value.name}-action.svg", - ), + svgPath: "assets/video-editor/video-crop-${value.name}-action.svg", ); } } diff --git a/mobile/lib/ui/tools/editor/video_editor/video_editor_bottom_action.dart b/mobile/lib/ui/tools/editor/video_editor/video_editor_bottom_action.dart index c3f6beed8e..cb32edec43 100644 --- a/mobile/lib/ui/tools/editor/video_editor/video_editor_bottom_action.dart +++ b/mobile/lib/ui/tools/editor/video_editor/video_editor_bottom_action.dart @@ -1,17 +1,20 @@ import "package:flutter/material.dart"; +import "package:flutter_svg/flutter_svg.dart"; class VideoEditorBottomAction extends StatelessWidget { const VideoEditorBottomAction({ super.key, required this.label, this.icon, + this.svgPath, this.child, required this.onPressed, this.isSelected = false, - }) : assert(icon != null || child != null); + }) : assert(icon != null || svgPath != null || child != null); final String label; final IconData? icon; + final String? svgPath; final Widget? child; final VoidCallback onPressed; final bool isSelected; @@ -27,20 +30,33 @@ class VideoEditorBottomAction extends StatelessWidget { height: 48, width: 48, decoration: BoxDecoration( - color: const Color(0xFF252525), + color: Theme.of(context).brightness == Brightness.light + ? const Color(0xFFF5F5F5) + : const Color(0xFF252525), shape: BoxShape.circle, border: Border.all( - color: - isSelected ? const Color(0xFFFFFFFF) : Colors.transparent, + color: isSelected + ? Theme.of(context).brightness == Brightness.light + ? const Color(0xFF424242) + : const Color(0xFFFFFFFF) + : Colors.transparent, width: 1, ), ), child: icon != null ? Icon(icon!) - : Padding( - padding: const EdgeInsets.all(2), - child: child!, - ), + : svgPath != null + ? SvgPicture.asset( + svgPath!, + colorFilter: ColorFilter.mode( + Theme.of(context).colorScheme.onSurface, + BlendMode.srcIn, + ), + ) + : Padding( + padding: const EdgeInsets.all(2), + child: child!, + ), ), const SizedBox(height: 8), Text( diff --git a/mobile/lib/ui/tools/editor/video_editor/video_editor_player_control.dart b/mobile/lib/ui/tools/editor/video_editor/video_editor_player_control.dart index 7b488e21a5..e6b25d69b8 100644 --- a/mobile/lib/ui/tools/editor/video_editor/video_editor_player_control.dart +++ b/mobile/lib/ui/tools/editor/video_editor/video_editor_player_control.dart @@ -42,7 +42,9 @@ class VideoEditorPlayerControl extends StatelessWidget { vertical: 4, ), decoration: BoxDecoration( - color: const Color(0xFF252525), + color: Theme.of(context).brightness == Brightness.light + ? const Color(0xFFF5F5F5) + : const Color(0xFF252525), borderRadius: BorderRadius.circular(56), ), child: Row( diff --git a/mobile/lib/ui/tools/editor/video_editor_page.dart b/mobile/lib/ui/tools/editor/video_editor_page.dart index ef0a25121f..042b5a0104 100644 --- a/mobile/lib/ui/tools/editor/video_editor_page.dart +++ b/mobile/lib/ui/tools/editor/video_editor_page.dart @@ -2,7 +2,6 @@ import 'dart:io'; import "dart:math"; import 'package:flutter/material.dart'; -import "package:flutter_svg/flutter_svg.dart"; import "package:logging/logging.dart"; import 'package:path/path.dart' as path; import "package:pedantic/pedantic.dart"; @@ -49,37 +48,51 @@ class _VideoEditorPageState extends State { final _isExporting = ValueNotifier(false); final _logger = Logger("VideoEditor"); - late final VideoEditorController _controller; + VideoEditorController? _controller; @override void initState() { super.initState(); - _controller = VideoEditorController.file( - widget.ioFile, - minDuration: const Duration(seconds: 1), - cropStyle: CropGridStyle( - selectedBoundariesColor: - const ColorScheme.dark().videoPlayerPrimaryColor, - ), - trimStyle: TrimSliderStyle( - onTrimmedColor: const ColorScheme.dark().videoPlayerPrimaryColor, - onTrimmingColor: const ColorScheme.dark().videoPlayerPrimaryColor, - ), - ); - _controller.initialize().then((_) => setState(() {})).catchError( - (error) { - // handle minumum duration bigger than video duration error - Navigator.pop(context); - }, - test: (e) => e is VideoMinDurationError, - ); + + Future.microtask(() { + _controller = VideoEditorController.file( + widget.ioFile, + minDuration: const Duration(seconds: 1), + cropStyle: CropGridStyle( + selectedBoundariesColor: + const ColorScheme.dark().videoPlayerPrimaryColor, + ), + trimStyle: TrimSliderStyle( + onTrimmedColor: const ColorScheme.dark().videoPlayerPrimaryColor, + onTrimmingColor: const ColorScheme.dark().videoPlayerPrimaryColor, + background: Theme.of(context).brightness == Brightness.light + ? const Color(0xFFF5F5F5) + : const Color(0xFF252525), + positionLineColor: Theme.of(context).brightness == Brightness.light + ? const Color(0xFF424242) + : const Color(0xFFFFFFFF), + lineColor: (Theme.of(context).brightness == Brightness.light + ? const Color(0xFF424242) + : const Color(0xFFFFFFFF)) + .withOpacity(0.6), + ), + ); + + _controller!.initialize().then((_) => setState(() {})).catchError( + (error) { + // handle minumum duration bigger than video duration error + Navigator.pop(context); + }, + test: (e) => e is VideoMinDurationError, + ); + }); } @override void dispose() async { _exportingProgress.dispose(); _isExporting.dispose(); - _controller.dispose().ignore(); + _controller?.dispose().ignore(); ExportService.dispose().ignore(); super.dispose(); } @@ -89,8 +102,11 @@ class _VideoEditorPageState extends State { return PopScope( canPop: false, child: Scaffold( - backgroundColor: Colors.black, - body: _controller.initialized + appBar: AppBar( + elevation: 0, + toolbarHeight: 0, + ), + body: _controller != null && _controller!.initialized ? SafeArea( child: Stack( children: [ @@ -103,25 +119,24 @@ class _VideoEditorPageState extends State { child: Hero( tag: "video-editor-preview", child: CropGridViewer.preview( - controller: _controller, + controller: _controller!, ), ), ), VideoEditorPlayerControl( - controller: _controller, + controller: _controller!, ), VideoEditorMainActions( children: [ VideoEditorBottomAction( label: "Trim", - child: SvgPicture.asset( - "assets/video-editor/video-editor-trim-action.svg", - ), + svgPath: + "assets/video-editor/video-editor-trim-action.svg", onPressed: () => Navigator.push( context, MaterialPageRoute( builder: (context) => VideoTrimPage( - controller: _controller, + controller: _controller!, ), ), ), @@ -129,14 +144,13 @@ class _VideoEditorPageState extends State { const SizedBox(width: 40), VideoEditorBottomAction( label: "Crop", - child: SvgPicture.asset( - "assets/video-editor/video-editor-crop-action.svg", - ), + svgPath: + "assets/video-editor/video-editor-crop-action.svg", onPressed: () => Navigator.push( context, MaterialPageRoute( builder: (context) => VideoCropPage( - controller: _controller, + controller: _controller!, ), ), ), @@ -144,14 +158,13 @@ class _VideoEditorPageState extends State { const SizedBox(width: 40), VideoEditorBottomAction( label: "Rotate", - child: SvgPicture.asset( - "assets/video-editor/video-editor-rotate-action.svg", - ), + svgPath: + "assets/video-editor/video-editor-rotate-action.svg", onPressed: () => Navigator.push( context, MaterialPageRoute( builder: (context) => VideoRotatePage( - controller: _controller, + controller: _controller!, ), ), ), @@ -183,7 +196,7 @@ class _VideoEditorPageState extends State { _isExporting.value = true; final config = VideoFFmpegVideoEditorConfig( - _controller, + _controller!, format: VideoExportFormat.mp4, // commandBuilder: (config, videoPath, outputPath) { // final List filters = config.getExportFilters(); diff --git a/mobile/lib/ui/tools/editor/video_rotate_page.dart b/mobile/lib/ui/tools/editor/video_rotate_page.dart index c2149e7306..3c53ca32f3 100644 --- a/mobile/lib/ui/tools/editor/video_rotate_page.dart +++ b/mobile/lib/ui/tools/editor/video_rotate_page.dart @@ -14,7 +14,10 @@ class VideoRotatePage extends StatelessWidget { Widget build(BuildContext context) { final rotation = controller.rotation; return Scaffold( - backgroundColor: Colors.black, + appBar: AppBar( + elevation: 0, + toolbarHeight: 0, + ), body: SafeArea( child: Column( children: [ diff --git a/mobile/lib/ui/tools/editor/video_trim_page.dart b/mobile/lib/ui/tools/editor/video_trim_page.dart index 44e5d9cbb1..0c044dcb23 100644 --- a/mobile/lib/ui/tools/editor/video_trim_page.dart +++ b/mobile/lib/ui/tools/editor/video_trim_page.dart @@ -21,7 +21,10 @@ class _VideoTrimPageState extends State { final maxTrim = widget.controller.maxTrim; return Scaffold( - backgroundColor: Colors.black, + appBar: AppBar( + elevation: 0, + toolbarHeight: 0, + ), body: SafeArea( child: Column( children: [ diff --git a/mobile/lib/ui/viewer/file/file_details_widget.dart b/mobile/lib/ui/viewer/file/file_details_widget.dart index 2423ee77c8..65419c95d6 100644 --- a/mobile/lib/ui/viewer/file/file_details_widget.dart +++ b/mobile/lib/ui/viewer/file/file_details_widget.dart @@ -57,7 +57,7 @@ class _FileDetailsWidgetState extends State { late final StreamSubscription _peopleChangedEvent; - bool _isImage = false; + bool _isImage = false; late int _currentUserID; bool showExifListTile = false; final ValueNotifier hasLocationData = ValueNotifier(false);