Funkwhale
/
tsacdop-podcast-app-android
mirror of https://github.com/stonega/tsacdop
1
0
Fork 0
Code Issues Releases Wiki Activity

Redesign player widget.

This commit is contained in:
stonegate 2020-07-29 20:06:49 +08:00
parent 1642c4b839
commit 814628ce3d
7 changed files with 1420 additions and 1688 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
lib/episodes/episode_detail.dart
View File

@ -2,20 +2,21 @@ import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:intl/intl.dart';
import 'package:tuple/tuple.dart';
import 'package:flutter_linkify/flutter_linkify.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';
import 'package:tuple/tuple.dart';
import 'package:url_launcher/url_launcher.dart';
import '../home/audioplayer.dart';
import '../local_storage/sqflite_localpodcast.dart';
import '../state/audio_state.dart';
import '../type/episodebrief.dart';
import '../type/play_histroy.dart';
import '../util/audiopanel.dart';
import '../util/custom_widget.dart';
import '../util/extension_helper.dart';
import 'episode_download.dart';
@ -34,6 +35,7 @@ class EpisodeDetail extends StatefulWidget {
class _EpisodeDetailState extends State<EpisodeDetail> {
final textstyle = TextStyle(fontSize: 15.0, color: Colors.black);
final GlobalKey<AudioPanelState> _playerKey = GlobalKey<AudioPanelState>();
double downloadProgress;
/// Show page title.
@ -122,6 +124,16 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
systemNavigationBarIconBrightness:
Theme.of(context).accentColorBrightness,
),
child: WillPopScope(
onWillPop: () async {
if (_playerKey.currentState != null &&
_playerKey.currentState.initSize > 100) {
_playerKey.currentState.backToMini();
return false;
} else {
return true;
}
},
child: Scaffold(
backgroundColor: Theme.of(context).primaryColor,
appBar: AppBar(
@ -211,8 +223,8 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
s.published(DateFormat.yMMMd().format(
DateTime.fromMillisecondsSinceEpoch(
widget.episodeItem.pubDate))),
style:
TextStyle(color: Theme.of(context).accentColor)),
style: TextStyle(
color: Theme.of(context).accentColor)),
),
Padding(
padding: EdgeInsets.only(
@ -234,8 +246,8 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
Container(
decoration: BoxDecoration(
color: Colors.cyan[300],
borderRadius:
BorderRadius.all(Radius.circular(15.0))),
borderRadius: BorderRadius.all(
Radius.circular(15.0))),
height: 25.0,
margin: EdgeInsets.only(right: 10.0),
padding: EdgeInsets.symmetric(horizontal: 10.0),
@ -250,8 +262,8 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
Container(
decoration: BoxDecoration(
color: Colors.lightBlue[300],
borderRadius:
BorderRadius.all(Radius.circular(15.0))),
borderRadius: BorderRadius.all(
Radius.circular(15.0))),
height: 25.0,
margin: EdgeInsets.only(right: 10.0),
padding: EdgeInsets.symmetric(horizontal: 10.0),
@ -288,7 +300,9 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
: _description.length > 0
? Container(
padding: EdgeInsets.only(
left: 20.0, right: 20.0, bottom: 50.0),
left: 20.0,
right: 20.0,
bottom: 50.0),
alignment: Alignment.topLeft,
child: SelectableLinkify(
onOpen: (link) {
@ -315,8 +329,8 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
MainAxisAlignment.center,
children: <Widget>[
Image(
image:
AssetImage('assets/shownote.png'),
image: AssetImage(
'assets/shownote.png'),
height: 100.0,
),
Padding(padding: EdgeInsets.all(5.0)),
@ -332,8 +346,8 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
Selector<AudioPlayerNotifier, bool>(
selector: (_, audio) => audio.playerRunning,
builder: (_, data, __) {
return Padding(
padding: EdgeInsets.only(bottom: data ? 60.0 : 0),
return SizedBox(
height: data ? 70.0 : 0,
);
}),
],
@ -345,7 +359,7 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
builder: (_, data, __) {
return Container(
alignment: Alignment.bottomCenter,
padding: EdgeInsets.only(bottom: data ? 60.0 : 0),
padding: EdgeInsets.only(bottom: data ? 70.0 : 0),
child: AnimatedContainer(
duration: Duration(milliseconds: 400),
height: !_showMenu ? 50 : 0,
@ -359,10 +373,11 @@ class _EpisodeDetailState extends State<EpisodeDetail> {
),
);
}),
Container(child: PlayerWidget()),
Container(child: PlayerWidget(playerKey: _playerKey)),
],
),
),
),
);
}
}

1003
lib/home/audioplayer.dart
View File

File diff suppressed because it is too large Load Diff

12
lib/home/home.dart
View File

@ -18,6 +18,7 @@ import '../state/podcast_group.dart';
import '../state/setting_state.dart';
import '../type/episodebrief.dart';
import '../type/playlist.dart';
import '../util/audiopanel.dart';
import '../util/custom_widget.dart';
import '../util/episodegrid.dart';
import '../util/extension_helper.dart';
@ -44,6 +45,7 @@ class Home extends StatefulWidget {
class _HomeState extends State<Home> with SingleTickerProviderStateMixin {
final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
final GlobalKey<AudioPanelState> _playerKey = GlobalKey<AudioPanelState>();
TabController _controller;
Decoration _getIndicator(BuildContext context) {
return UnderlineTabIndicator(
@ -102,10 +104,14 @@ class _HomeState extends State<Home> with SingleTickerProviderStateMixin {
systemNavigationBarColor: Theme.of(context).primaryColor,
),
child: Scaffold(
key: _scaffoldKey,
// key: _scaffoldKey,
body: WillPopScope(
onWillPop: () async {
if (Platform.isAndroid) {
if (_playerKey.currentState != null &&
_playerKey.currentState.initSize > 100) {
_playerKey.currentState.backToMini();
return false;
} else if (Platform.isAndroid) {
_androidAppRetain.invokeMethod('sendToBackground');
return false;
} else {
@ -445,7 +451,7 @@ class _HomeState extends State<Home> with SingleTickerProviderStateMixin {
}),
],
),
Container(child: PlayerWidget()),
Container(child: PlayerWidget(playerKey: _playerKey)),
],
),
),

54
lib/podcasts/podcast_detail.dart
View File

@ -21,6 +21,7 @@ import '../type/episodebrief.dart';
import '../type/fireside_data.dart';
import '../type/play_histroy.dart';
import '../type/podcastlocal.dart';
import '../util/audiopanel.dart';
import '../util/custom_widget.dart';
import '../util/episodegrid.dart';
import '../util/extension_helper.dart';
@ -39,6 +40,8 @@ class _PodcastDetailState extends State<PodcastDetail> {
final GlobalKey<RefreshIndicatorState> _refreshIndicatorKey =
GlobalKey<RefreshIndicatorState>();
final GlobalKey<AudioPanelState> _playerKey = GlobalKey<AudioPanelState>();
/// Fireside background if hosted on fireside.
String _backgroundImage;
@ -628,12 +631,22 @@ class _PodcastDetailState extends State<PodcastDetail> {
systemNavigationBarColor: Theme.of(context).primaryColor,
systemNavigationBarIconBrightness:
Theme.of(context).accentColorBrightness,
//statusBarColor: _color,
),
child: WillPopScope(
onWillPop: () {
if (_playerKey.currentState != null &&
_playerKey.currentState.initSize > 100) {
_playerKey.currentState.backToMini();
return Future.value(false);
} else {
return Future.value(true);
}
},
child: Scaffold(
body: SafeArea(
top: false,
minimum: widget.hide ? EdgeInsets.only(bottom: 50) : EdgeInsets.zero,
minimum:
widget.hide ? EdgeInsets.only(bottom: 50) : EdgeInsets.zero,
child: RefreshIndicator(
key: _refreshIndicatorKey,
color: Theme.of(context).accentColor,
@ -688,18 +701,22 @@ class _PodcastDetailState extends State<PodcastDetail> {
slivers: <Widget>[
SliverAppBar(
brightness: Brightness.dark,
actions: <Widget>[_rightTopMenu(context)],
actions: <Widget>[
_rightTopMenu(context)
],
elevation: 0,
iconTheme: IconThemeData(
color: Colors.white,
),
expandedHeight: 150 + context.paddingTop,
expandedHeight:
150 + context.paddingTop,
backgroundColor: _color,
floating: true,
pinned: true,
flexibleSpace: LayoutBuilder(
builder: (context, constraints) {
_topHeight = constraints.biggest.height;
_topHeight =
constraints.biggest.height;
return FlexibleSpaceBar(
background: Stack(
children: <Widget>[
@ -710,14 +727,16 @@ class _PodcastDetailState extends State<PodcastDetail> {
padding: EdgeInsets.only(
left: 80, right: 120),
color: Colors.white10,
alignment: Alignment.centerLeft,
alignment:
Alignment.centerLeft,
child: Column(
mainAxisAlignment:
MainAxisAlignment.start,
mainAxisSize:
MainAxisSize.min,
crossAxisAlignment:
CrossAxisAlignment.start,
CrossAxisAlignment
.start,
children: <Widget>[
Text(
widget.podcastLocal
@ -727,8 +746,8 @@ class _PodcastDetailState extends State<PodcastDetail> {
overflow: TextOverflow
.ellipsis,
style: TextStyle(
color:
Colors.white)),
color: Colors
.white)),
if (widget.podcastLocal
.provider.isNotEmpty)
Text(
@ -746,8 +765,8 @@ class _PodcastDetailState extends State<PodcastDetail> {
Container(
alignment:
Alignment.centerRight,
padding:
EdgeInsets.only(right: 10),
padding: EdgeInsets.only(
right: 10),
child: SizedBox(
height: 120,
child: Image.file(File(
@ -762,7 +781,8 @@ class _PodcastDetailState extends State<PodcastDetail> {
),
title: _topHeight <
70 + context.paddingTop
? Text(widget.podcastLocal.title,
? Text(
widget.podcastLocal.title,
maxLines: 1,
overflow:
TextOverflow.ellipsis,
@ -811,18 +831,22 @@ class _PodcastDetailState extends State<PodcastDetail> {
Selector<AudioPlayerNotifier, bool>(
selector: (_, audio) => audio.playerRunning,
builder: (_, data, __) {
return Padding(
padding: EdgeInsets.only(bottom: data ? 60.0 : 0),
return SizedBox(
height: data ? 70.0 : 0,
);
}),
],
),
Container(child: PlayerWidget()),
Container(
child: PlayerWidget(
playerKey: _playerKey,
)),
],
),
),
),
),
),
);
}
}

103
lib/util/audiopanel.dart
View File

@ -10,23 +10,22 @@ class AudioPanel extends StatefulWidget {
final Widget miniPanel;
final Widget expandedPanel;
final Widget optionPanel;
final Widget cover;
final double minHeight;
final double maxHeight;
AudioPanel(
{@required this.miniPanel,
@required this.expandedPanel,
this.optionPanel,
this.cover,
this.minHeight = 60,
this.minHeight = 70,
this.maxHeight = 300,
Key key})
: super(key: key);
@override
_AudioPanelState createState() => _AudioPanelState();
AudioPanelState createState() => AudioPanelState();
}
class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
class AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
double initSize;
double _startdy;
double _move = 0;
@ -81,7 +80,7 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
child: (_animation.value > widget.minHeight + 30)
? Positioned.fill(
child: GestureDetector(
onTap: _backToMini,
onTap: backToMini,
child: Container(
color: Theme.of(context)
.scaffoldBackgroundColor
@ -92,7 +91,7 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
)
: Center(),
),
Container(
Align(
alignment: Alignment.bottomCenter,
child: GestureDetector(
onVerticalDragStart: _start,
@ -107,20 +106,17 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
opacity: _animation.value > widget.minHeight
? (widget.minHeight + 30 - _animation.value) / 40
: 1,
child: Container(
child: widget.miniPanel,
),
),
)
: Container(
decoration: BoxDecoration(
color: context.primaryColor,
boxShadow: [
BoxShadow(
offset: Offset(0, -0.5),
offset: Offset(0, -1),
blurRadius: 1,
color:
Theme.of(context).brightness == Brightness.light
color: context.brightness == Brightness.light
? Colors.grey[400].withOpacity(0.5)
: Colors.grey[800],
),
@ -133,7 +129,7 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
? (_animation.value - widget.minHeight) /
(widget.maxHeight - widget.minHeight - 50)
: 1,
child: Container(
child: SizedBox(
height: math.max(widget.maxHeight,
math.min(_animation.value, _expandHeight)),
child: widget.expandedPanel,
@ -147,7 +143,7 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
]);
}
_backToMini() {
backToMini() {
setState(() {
_animation = Tween<double>(begin: initSize, end: widget.minHeight)
.animate(_slowController);
@ -156,6 +152,15 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
_slowController.forward();
}
scrollToTop() {
setState(() {
_animation = Tween<double>(begin: initSize, end: _expandHeight)
.animate(_slowController);
initSize = _expandHeight;
});
_slowController.forward();
}
_start(DragStartDetails event) {
setState(() {
_startdy = event.localPosition.dy;
@ -175,7 +180,7 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
_controller.forward();
}
_end() {
_end() async {
if (_slideDirection == SlideDirection.up) {
if (_move > 20) {
if (_animation.value > widget.maxHeight + 20) {
@ -185,15 +190,16 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
.animate(_slowController);
initSize = _expandHeight;
});
_slowController.forward();
} else {
setState(() {
_animation =
Tween<double>(begin: _animation.value, end: widget.maxHeight)
.animate(_slowController);
Tween<double>(begin: widget.maxHeight, end: widget.maxHeight)
.animate(_controller);
initSize = widget.maxHeight;
});
_controller.forward();
}
_slowController.forward();
} else {
setState(() {
_animation =
@ -251,3 +257,64 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
}
}
}
class _AudioPanelRoute extends StatefulWidget {
_AudioPanelRoute({this.expandPanel, this.height, Key key}) : super(key: key);
final Widget expandPanel;
final double height;
@override
__AudioPanelRouteState createState() => __AudioPanelRouteState();
}
class __AudioPanelRouteState extends State<_AudioPanelRoute> {
@override
Widget build(BuildContext context) {
return MediaQuery.removePadding(
context: context,
removeTop: true,
child: Scaffold(
body: Stack(children: <Widget>[
Container(
child: Positioned.fill(
child: GestureDetector(
onTap: () => Navigator.pop(context),
// child:
// Container(
// color: Theme.of(context)
// .scaffoldBackgroundColor
// .withOpacity(0.8),
//
//),
),
),
),
Align(
alignment: Alignment.bottomCenter,
child: Container(
height: widget.height,
decoration: BoxDecoration(
color: context.primaryColor,
boxShadow: [
BoxShadow(
offset: Offset(0, -1),
blurRadius: 1,
color: context.brightness == Brightness.light
? Colors.grey[400].withOpacity(0.5)
: Colors.grey[800],
),
],
),
child: SingleChildScrollView(
physics: const NeverScrollableScrollPhysics(),
child: SizedBox(
height: 300,
child: widget.expandPanel,
),
),
),
),
]),
),
);
}
}

81
lib/util/custom_widget.dart
View File

@ -1000,3 +1000,84 @@ class LayoutButton extends StatelessWidget {
);
}
}
/// Remove scroll view overlay effect.
class NoGrowBehavior extends ScrollBehavior {
@override
Widget buildViewportChrome(
BuildContext context, Widget child, AxisDirection axisDirection) {
return child;
}
}
class Meteor extends CustomPainter {
Paint _paint;
Meteor() {
_paint = Paint()
..color = Colors.white
..strokeWidth = 2.0
..strokeCap = StrokeCap.round;
}
@override
void paint(Canvas canvas, Size size) {
canvas.drawLine(Offset(0, 0), Offset(size.width, size.height), _paint);
}
@override
bool shouldRepaint(Meteor oldDelegate) {
return false;
}
}
/// Used in sleep mode widget.
class MeteorLoader extends StatefulWidget {
@override
_MeteorLoaderState createState() => _MeteorLoaderState();
}
class _MeteorLoaderState extends State<MeteorLoader>
with SingleTickerProviderStateMixin {
double _fraction = 0.0;
double _move = 0.0;
Animation animation;
AnimationController controller;
@override
void initState() {
super.initState();
controller =
AnimationController(vsync: this, duration: Duration(milliseconds: 500));
animation = Tween(begin: 0.0, end: 1.0).animate(controller)
..addListener(() {
if (mounted) {
setState(() {
_move = animation.value;
if (animation.value <= 0.5) {
_fraction = animation.value * 2;
} else {
_fraction = 2 - (animation.value) * 2;
}
});
}
});
controller.forward();
}
@override
void dispose() {
controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Positioned(
top: 300 * _move + 10,
left: 150 * _move + 50,
child: SizedBox(
width: 50 * _fraction,
height: 100 * _fraction,
child: CustomPaint(painter: Meteor())),
);
}
}

2
lib/util/open_container.dart
View File

@ -725,7 +725,7 @@ class _OpenContainerRoute extends ModalRoute<void> {
_positionTween.end = Offset(
10,
playerRunning
? MediaQuery.of(context).size.height - 100
? MediaQuery.of(context).size.height - 110
: MediaQuery.of(context).size.height - 40);
var _width = MediaQuery.of(context).size.width;