From 974c2af18e6b65149efb380686b146ba5a274945 Mon Sep 17 00:00:00 2001 From: stonegate Date: Tue, 13 Oct 2020 23:35:15 +0800 Subject: [PATCH] Improve route animation. --- lib/podcasts/podcast_detail.dart | 151 +++++++++++-------------------- lib/util/pageroute.dart | 52 +++++++---- 2 files changed, 84 insertions(+), 119 deletions(-) diff --git a/lib/podcasts/podcast_detail.dart b/lib/podcasts/podcast_detail.dart index 1f67ec0..bd7829d 100644 --- a/lib/podcasts/podcast_detail.dart +++ b/lib/podcasts/podcast_detail.dart @@ -85,6 +85,7 @@ class _PodcastDetailState extends State { bool _selectAll; bool _selectBefore; bool _selectAfter; + bool _loadEpisodes = false; @override void initState() { @@ -97,6 +98,8 @@ class _PodcastDetailState extends State { _selectAll = false; _selectAfter = false; _selectBefore = false; + Future.delayed(Duration(milliseconds: 200)) + .then((value) => setState(() => _loadEpisodes = true)); } @override @@ -434,57 +437,6 @@ class _PodcastDetailState extends State { height: 30, child: Row( children: [ - //SizedBox(width: 10), - // _customPopupMenu( - // tooltip: s.homeSubMenuSortBy, - // child: Container( - // height: 30, - // decoration: BoxDecoration( - // borderRadius: BorderRadius.circular(100.0), - // border: Border.all(color: context.primaryColorDark), - // ), - // padding: EdgeInsets.symmetric(horizontal: 10), - // child: Row( - // mainAxisSize: MainAxisSize.min, - // children: [ - // Text(s.homeSubMenuSortBy), - // SizedBox(width: 5), - // Icon( - // _reverse - // ? LineIcons.hourglass_start_solid - // : LineIcons.hourglass_end_solid, - // size: 18, - // ) - // ], - // )), - // itemBuilder: [ - // PopupMenuItem( - // value: 0, - // child: Row( - // children: [ - // Text(s.newestFirst), - // Spacer(), - // if (!_reverse) DotIndicator() - // ], - // ), - // ), - // PopupMenuItem( - // value: 1, - // child: Row( - // children: [ - // Text(s.oldestFirst), - // Spacer(), - // if (_reverse) DotIndicator() - // ], - // ), - // ) - // ], - // onSelected: (value) { - // if (value == 0) { - // setState(() => _reverse = false); - // } else if (value == 1) setState(() => _reverse = true); - // }, - // ), SizedBox(width: 15), _customPopupMenu( tooltip: s.filter, @@ -858,56 +810,57 @@ class _PodcastDetailState extends State { child: _multiSelect ? Center() : _actionBar(context)), - FutureBuilder>( - future: _getRssItem(widget.podcastLocal, - count: _top, - reverse: _reverse, - filter: _filter, - query: _query), - builder: (context, snapshot) { - if (snapshot.hasData) { - if (_selectAll) { - _selectedEpisodes = snapshot.data; - } - if (_selectBefore) { - final index = snapshot.data - .indexOf(_selectedEpisodes.first); - if (index != 0) { - _selectedEpisodes = snapshot.data - .sublist(0, index + 1); - } - } - if (_selectAfter) { - final index = snapshot.data - .indexOf(_selectedEpisodes.first); - _selectedEpisodes = - snapshot.data.sublist(index); - } - return EpisodeGrid( - episodes: snapshot.data, - showFavorite: true, - showNumber: _filter == Filter.all && - !_hideListened - ? true - : false, - layout: _layout, + if (_loadEpisodes) + FutureBuilder>( + future: _getRssItem(widget.podcastLocal, + count: _top, reverse: _reverse, - episodeCount: _episodeCount, - initNum: _scroll ? 0 : 12, - multiSelect: _multiSelect, - selectedList: _selectedEpisodes ?? [], - onSelect: (value) => setState(() { - _selectAll = false; - _selectBefore = false; - _selectAfter = false; - _selectedEpisodes = value; - }), + filter: _filter, + query: _query), + builder: (context, snapshot) { + if (snapshot.hasData) { + if (_selectAll) { + _selectedEpisodes = snapshot.data; + } + if (_selectBefore) { + final index = snapshot.data + .indexOf(_selectedEpisodes.first); + if (index != 0) { + _selectedEpisodes = snapshot.data + .sublist(0, index + 1); + } + } + if (_selectAfter) { + final index = snapshot.data + .indexOf(_selectedEpisodes.first); + _selectedEpisodes = + snapshot.data.sublist(index); + } + return EpisodeGrid( + episodes: snapshot.data, + showFavorite: true, + showNumber: _filter == Filter.all && + !_hideListened + ? true + : false, + layout: _layout, + reverse: _reverse, + episodeCount: _episodeCount, + initNum: _scroll ? 0 : 12, + multiSelect: _multiSelect, + selectedList: _selectedEpisodes ?? [], + onSelect: (value) => setState(() { + _selectAll = false; + _selectBefore = false; + _selectAfter = false; + _selectedEpisodes = value; + }), + ); + } + return SliverToBoxAdapter( + child: Center(), ); - } - return SliverToBoxAdapter( - child: Center(), - ); - }), + }), SliverList( delegate: SliverChildBuilderDelegate( (context, index) { diff --git a/lib/util/pageroute.dart b/lib/util/pageroute.dart index 651df90..77289a9 100644 --- a/lib/util/pageroute.dart +++ b/lib/util/pageroute.dart @@ -5,26 +5,38 @@ class SlideLeftRoute extends PageRouteBuilder { final Widget page; SlideLeftRoute({this.page}) : super( - pageBuilder: ( - context, - animation, - secondaryAnimation, - ) => - page, - transitionsBuilder: ( - context, - animation, - secondaryAnimation, - child, - ) => - SlideTransition( - position: Tween( - begin: const Offset(1, 0), - end: Offset.zero, - ).animate(animation), - child: child, - ), - ); + pageBuilder: ( + context, + animation, + secondaryAnimation, + ) => + page, + transitionsBuilder: ( + context, + animation, + secondaryAnimation, + child, + ) { + var begin = Offset(1.0, 0.0); + var end = Offset.zero; + var curve = Curves.easeOutQuart; + var tween = + Tween(begin: begin, end: end).chain(CurveTween(curve: curve)); + var tweenSequence = TweenSequence(>[ + TweenSequenceItem( + tween: tween, + weight: 90.0, + ), + TweenSequenceItem( + tween: ConstantTween(Offset.zero), + weight: 10.0, + ), + ]); + return SlideTransition( + position: animation.drive(tweenSequence), + child: child, + ); + }); } class SlideLeftHideRoute extends PageRouteBuilder {