diff --git a/example/lib/example_picker.dart b/example/lib/example_picker.dart index 4fe9217..fd2aa94 100644 --- a/example/lib/example_picker.dart +++ b/example/lib/example_picker.dart @@ -69,7 +69,7 @@ class _ExamplePickerState extends State { trailing: ASButton( title: '图片选择器', onPressed: () async { - File file = await camView(context); + File file = await camView(context, title: '图片选择器'); }, ), ), diff --git a/lib/ansu_ui.dart b/lib/ansu_ui.dart index c70bcf9..4bbf264 100644 --- a/lib/ansu_ui.dart +++ b/lib/ansu_ui.dart @@ -1,6 +1,7 @@ library ansu_ui; import 'dart:io'; +import 'dart:ui'; import 'package:ansu_ui/bar/as_tab_indicator.dart'; import 'package:ansu_ui/painters/as_numeric_painter.dart'; @@ -11,7 +12,6 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:flutter_easyrefresh/easy_refresh.dart'; import 'package:image_picker/image_picker.dart'; import 'package:bot_toast/bot_toast.dart'; - export 'package:flutter_screenutil/flutter_screenutil.dart'; export 'package:flutter_easyrefresh/easy_refresh.dart'; export 'package:bot_toast/bot_toast.dart'; @@ -64,7 +64,9 @@ part 'divider/as_divider.dart'; part 'text_field/as_search_text_field.dart'; part 'utils/screen_adapter.dart'; -part 'utils/camera_util.dart';part 'utils/camera_view.dart'; +part 'utils/camera_util.dart'; +part 'utils/camera_view.dart'; +part 'utils/photo_viewer.dart'; part 'extension/num_extension.dart'; part 'extension/list_extension.dart'; diff --git a/lib/utils/camera_view.dart b/lib/utils/camera_view.dart index 17a2d6e..124ea64 100644 --- a/lib/utils/camera_view.dart +++ b/lib/utils/camera_view.dart @@ -23,7 +23,24 @@ class _CameraViewState extends State { Widget build(BuildContext context) { return ASScaffold( title: widget.title, - body: Image.file(widget.file, fit: BoxFit.cover), + body: BackdropFilter( + filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10), + child: Container( + alignment: Alignment.center, + child: GestureDetector( + onTap: () { + toPhotoViewer(context, tag: widget.title, file: widget.file); + }, + child: Hero( + child: Image.file( + widget.file, + fit: BoxFit.cover, + ), + tag: widget.title, + ), + ), + ), + ), bottomNavigationBar: Material( color: kForegroundColor, child: Column( @@ -35,15 +52,17 @@ class _CameraViewState extends State { title: '重拍', onPressed: () async { File file = await camFile(); - if (file == null) Navigator.pop(context); - Navigator.pushReplacement(context, PageRouteBuilder( - pageBuilder: (context, animation, secondAnimation) { - return FadeTransition( - opacity: animation, - child: CameraView(file: file, title: widget.title), - ); - }, - )); + if (file == null) + Navigator.pop(context); + else + Navigator.pushReplacement(context, PageRouteBuilder( + pageBuilder: (context, animation, secondAnimation) { + return FadeTransition( + opacity: animation, + child: CameraView(file: file, title: widget.title), + ); + }, + )); }, ), _buildButton( diff --git a/lib/utils/photo_viewer.dart b/lib/utils/photo_viewer.dart new file mode 100644 index 0000000..9e1de31 --- /dev/null +++ b/lib/utils/photo_viewer.dart @@ -0,0 +1,46 @@ +part of ansu_ui; + +class PhotoViewer extends StatefulWidget { + final File file; + final String tag; + PhotoViewer({Key key, this.file, this.tag}) : super(key: key); + + @override + _PhotoViewerState createState() => _PhotoViewerState(); +} + +class _PhotoViewerState extends State { + @override + Widget build(BuildContext context) { + return Scaffold( + backgroundColor: Colors.black54, + body: GestureDetector( + onTap: () => Navigator.pop(context), + child: Center( + child: InteractiveViewer( + boundaryMargin: 100.edge, + child: Hero( + tag: widget.tag, + child: Image.file(widget.file), + ), + ), + ), + ), + ); + } +} + +toPhotoViewer(BuildContext context, {String tag, File file}) { + Navigator.push( + context, + PageRouteBuilder( + pageBuilder: (context, animation, secondAnimation) { + return PhotoViewer(file: file, tag: tag); + }, + opaque: false, + transitionsBuilder: (context, animation, secondaryAnimation, child) { + return FadeTransition(opacity: animation, child: child); + }, + ), + ); +}