Fabio/aves
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fullscreen: sliding overlay on tap

Browse source
This commit is contained in:
Thibault Deckers 2019-07-27 18:36:39 +09:00
parent d8c28509b8
commit beb31f1f98
1 changed files with 29 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
lib/image_fullscreen_page.dart
View file

@ -20,9 +20,12 @@ class ImageFullscreenPage extends StatefulWidget {
ImageFullscreenPageState createState() => ImageFullscreenPageState(); ImageFullscreenPageState createState() => ImageFullscreenPageState();
} }
class ImageFullscreenPageState extends State<ImageFullscreenPage> { class ImageFullscreenPageState extends State<ImageFullscreenPage> with SingleTickerProviderStateMixin {
int _currentPage; int _currentPage;
PageController _pageController; PageController _pageController;
ValueNotifier<bool> _overlayVisible = ValueNotifier(false);
AnimationController _overlayAnimationController;
Animation<Offset> _overlayOffset;
List<Map> get entries => widget.entries; List<Map> get entries => widget.entries;
@ -32,10 +35,17 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
final index = entries.indexWhere((entry) => entry['uri'] == widget.initialUri); final index = entries.indexWhere((entry) => entry['uri'] == widget.initialUri);
_currentPage = max(0, index); _currentPage = max(0, index);
_pageController = PageController(initialPage: _currentPage); _pageController = PageController(initialPage: _currentPage);
_overlayAnimationController = AnimationController(
duration: Duration(milliseconds: 250),
vsync: this,
);
_overlayOffset = Tween(begin: Offset(0, 0), end: Offset(0, 1)).animate(CurvedAnimation(parent: _overlayAnimationController, curve: Curves.easeOutQuart, reverseCurve: Curves.easeInQuart));
_overlayVisible.addListener(onOverlayVisibleChange);
} }
@override @override
void dispose() { void dispose() {
_overlayVisible.removeListener(onOverlayVisibleChange);
super.dispose(); super.dispose();
} }
@ -44,7 +54,6 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
return Scaffold( return Scaffold(
backgroundColor: Colors.black, backgroundColor: Colors.black,
body: Stack( body: Stack(
alignment: Alignment.bottomCenter,
children: [ children: [
PhotoViewGallery.builder( PhotoViewGallery.builder(
itemCount: entries.length, itemCount: entries.length,
@ -55,6 +64,7 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
heroTag: entry['uri'], heroTag: entry['uri'],
minScale: PhotoViewComputedScale.contained, minScale: PhotoViewComputedScale.contained,
initialScale: PhotoViewComputedScale.contained, initialScale: PhotoViewComputedScale.contained,
onTapUp: (tapContext, details, value) => _overlayVisible.value = !_overlayVisible.value,
); );
}, },
loadingChild: Center( loadingChild: Center(
@ -69,10 +79,16 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
scrollPhysics: BouncingScrollPhysics(), scrollPhysics: BouncingScrollPhysics(),
), ),
if (_currentPage != null) if (_currentPage != null)
FullscreenOverlay( Positioned(
entries: entries, bottom: 0,
index: _currentPage, child: SlideTransition(
), position: _overlayOffset,
child: FullscreenOverlay(
entries: entries,
index: _currentPage,
),
),
)
], ],
), ),
resizeToAvoidBottomInset: false, resizeToAvoidBottomInset: false,
@ -106,4 +122,11 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
// ), // ),
); );
} }
onOverlayVisibleChange() {
if (_overlayVisible.value)
_overlayAnimationController.forward();
else
_overlayAnimationController.reverse();
}
} }