improved view insets handling

This commit is contained in:
Thibault Deckers 2019-07-22 00:40:49 +09:00
parent 55ad742847
commit 033f979fb3
2 changed files with 45 additions and 55 deletions

View file

@ -39,45 +39,42 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return MediaQuery.removeViewInsets( return Scaffold(
context: context, backgroundColor: Colors.black,
// remove bottom view insets to paint underneath the translucent navigation bar body: Stack(
removeBottom: true, alignment: Alignment.bottomCenter,
child: Scaffold( children: [
backgroundColor: Colors.black, PhotoViewGallery.builder(
body: Stack( itemCount: entries.length,
alignment: Alignment.bottomCenter, builder: (context, index) {
children: [ var entry = entries[index];
PhotoViewGallery.builder( return PhotoViewGalleryPageOptions(
itemCount: entries.length, imageProvider: FileImage(File(entry['path'])),
builder: (context, index) { heroTag: entry['uri'],
var entry = entries[index]; minScale: PhotoViewComputedScale.contained,
return PhotoViewGalleryPageOptions( initialScale: PhotoViewComputedScale.contained,
imageProvider: FileImage(File(entry['path'])), );
heroTag: entry['uri'], },
minScale: PhotoViewComputedScale.contained, loadingChild: Center(
initialScale: PhotoViewComputedScale.contained, child: CircularProgressIndicator(),
);
},
loadingChild: Center(
child: CircularProgressIndicator(),
),
pageController: _pageController,
onPageChanged: (index) {
debugPrint('onPageChanged: index=$index');
setState(() => _currentPage = index);
},
transitionOnUserGestures: true,
scrollPhysics: BouncingScrollPhysics(),
), ),
if (_currentPage != null) pageController: _pageController,
FullscreenOverlay( onPageChanged: (index) {
entry: entries[_currentPage], debugPrint('onPageChanged: index=$index');
index: _currentPage, setState(() => _currentPage = index);
total: entries.length, },
), transitionOnUserGestures: true,
], scrollPhysics: BouncingScrollPhysics(),
), ),
if (_currentPage != null)
FullscreenOverlay(
entry: entries[_currentPage],
index: _currentPage,
total: entries.length,
),
],
),
resizeToAvoidBottomInset: false,
// Hero( // Hero(
// tag: uri, // tag: uri,
// child: Stack( // child: Stack(
@ -106,7 +103,6 @@ class ImageFullscreenPageState extends State<ImageFullscreenPage> {
// ], // ],
// ), // ),
// ), // ),
),
); );
} }
} }
@ -119,22 +115,20 @@ class FullscreenOverlay extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
debugPrint('FullscreenOverlay MediaQuery.of(context)=${MediaQuery.of(context)}'); var viewInsets = MediaQuery.of(context).viewInsets;
// TODO TLAD find actual value from MediaQuery before insets removal
var viewInsetsBottom = 46.0;
var date = ImageEntry.getBestDate(entry); var date = ImageEntry.getBestDate(entry);
return IgnorePointer( return IgnorePointer(
child: Container( child: Container(
padding: EdgeInsets.all(8.0).add(EdgeInsets.only(bottom: viewInsetsBottom)), padding: EdgeInsets.all(8.0).add(EdgeInsets.only(bottom: viewInsets.bottom)),
color: Colors.black45, color: Colors.black45,
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text('$index / $total - ${entry['title']}'), Text('${index + 1} / $total - ${entry['title']}'),
Row( Row(
children: [ children: [
Expanded(child: Text('${DateFormat.yMMMMd().format(date)} ${DateFormat.Hm().format(date)}')), Expanded(child: Text('${DateFormat.yMMMd().format(date)} ${DateFormat.Hm().format(date)}')),
Expanded(child: Text('${entry['width']} × ${entry['height']}')), Expanded(child: Text('${entry['width']} × ${entry['height']}')),
], ],
), ),

View file

@ -44,21 +44,17 @@ class _HomePageState extends State<HomePage> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
debugPrint('MediaQuery.of(context).viewInsets.bottom=${MediaQuery.of(context).viewInsets.bottom}'); return Scaffold(
// fake app bar so that content is safe from status bar, even though we use a SliverAppBar
return MediaQuery.removeViewInsets( appBar: FakeAppBar(),
context: context, body: Container(
// remove bottom view insets to paint underneath the translucent navigation bar child: imageEntryList == null
removeBottom: true,
child: Scaffold(
// fake app bar so that content is safe from status bar, even though we use a SliverAppBar
appBar: FakeAppBar(),
body: imageEntryList == null
? Center( ? Center(
child: CircularProgressIndicator(), child: CircularProgressIndicator(),
) )
: ThumbnailCollection(imageEntryList), : ThumbnailCollection(imageEntryList),
), ),
resizeToAvoidBottomInset: false,
); );
} }
} }