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

modified: lib/home/audio_player.dart 

modified:   lib/home/audiopanel.dart
	modified:   lib/home/home.dart
	modified:   lib/home/homescroll.dart
Improved audio widget
This commit is contained in:
stonegate 2020-02-14 19:52:03 +08:00
parent 28595bc8da
commit 05d2390b01
4 changed files with 247 additions and 203 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

304
lib/home/audio_player.dart
View File

@ -370,138 +370,150 @@ class _PlayerWidgetState extends State<PlayerWidget> {
}
Widget _expandedPanel() => Container(
height: 300,
color: Colors.grey[100],
padding: EdgeInsets.symmetric(horizontal: 10.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.all(30),
alignment: Alignment.center,
child: (_title.length > 50)
? Marquee(
text: _title,
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 35),
scrollAxis: Axis.horizontal,
crossAxisAlignment: CrossAxisAlignment.start,
blankSpace: 30.0,
velocity: 50.0,
pauseAfterRound: Duration(seconds: 1),
startPadding: 30.0,
accelerationDuration: Duration(seconds: 1),
accelerationCurve: Curves.linear,
decelerationDuration: Duration(milliseconds: 500),
decelerationCurve: Curves.easeOut,
)
: Text(
_title,
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 20),
),
height: 300,
color: Colors.grey[100],
padding: EdgeInsets.symmetric(horizontal: 10.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
height: 100.0,
padding: EdgeInsets.all(30),
alignment: Alignment.center,
child: (_title.length > 10)
? Marquee(
text: _title,
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 20),
scrollAxis: Axis.horizontal,
crossAxisAlignment: CrossAxisAlignment.start,
blankSpace: 30.0,
velocity: 50.0,
pauseAfterRound: Duration(seconds: 1),
startPadding: 30.0,
accelerationDuration: Duration(seconds: 1),
accelerationCurve: Curves.linear,
decelerationDuration: Duration(milliseconds: 500),
decelerationCurve: Curves.easeOut,
)
: Text(
_title,
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 20),
),
),
Container(
padding: EdgeInsets.only(left: 40, right: 40, top: 20),
child: SliderTheme(
data: SliderTheme.of(context).copyWith(
activeTrackColor: Colors.blue[100],
inactiveTrackColor: Colors.grey[300],
trackHeight: 3.0,
thumbColor: Colors.blue[400],
thumbShape: RoundSliderThumbShape(enabledThumbRadius: 6.0),
overlayColor: Colors.blue.withAlpha(32),
overlayShape: RoundSliderOverlayShape(overlayRadius: 14.0),
),
child: Slider(
value: _seekSliderValue,
onChanged: (double val) {
setState(() => _seekSliderValue = val);
final double positionSeconds =
val * _backgroundAudioDurationSeconds;
_backgroundAudio.seek(positionSeconds);
AudioSystem.instance
.setPlaybackState(true, positionSeconds);
}),
),
Container(
padding: EdgeInsets.only(left: 40, right: 40, top: 20),
child: SliderTheme(
data: SliderTheme.of(context).copyWith(
activeTrackColor: Colors.blue[100],
inactiveTrackColor: Colors.grey[300],
trackHeight: 3.0,
thumbColor: Colors.blue[400],
thumbShape:
RoundSliderThumbShape(enabledThumbRadius: 6.0),
overlayColor: Colors.blue.withAlpha(32),
overlayShape:
RoundSliderOverlayShape(overlayRadius: 14.0),
),
Container(
height: 20.0,
padding: EdgeInsets.symmetric(horizontal: 50.0),
child: Row(
children: <Widget>[
Text(
_stringForSeconds(_backgroundAudioPositionSeconds) ?? '',
style: TextStyle(fontSize: 10),
),
child: Slider(
value: _seekSliderValue,
onChanged: (double val) {
setState(() => _seekSliderValue = val);
final double positionSeconds =
val * _backgroundAudioDurationSeconds;
_backgroundAudio.seek(positionSeconds);
AudioSystem.instance
.setPlaybackState(true, positionSeconds);
}),
),
),
Container(
height: 20.0,
padding: EdgeInsets.symmetric(horizontal: 50.0),
child: Row(
children: <Widget>[
Text(
_stringForSeconds(_backgroundAudioPositionSeconds) ??
'',
style: TextStyle(fontSize: 10),
Expanded(
child: Container(
alignment: Alignment.center,
child: _remoteErrorMessage != null
? Text(_remoteErrorMessage,
style: const TextStyle(
color: const Color(0xFFFF0000)))
: Text(
_remoteAudioLoading ? 'Buffring...' : '',
style: TextStyle(color: Colors.blue),
),
),
Expanded(
child: Container(
alignment: Alignment.center,
child: _remoteErrorMessage != null
? Text(_remoteErrorMessage,
style: const TextStyle(
color: const Color(0xFFFF0000)))
: Text(
_remoteAudioLoading ? 'Buffring...' : '',
style: TextStyle(color: Colors.blue),
),
),
),
Text(
_stringForSeconds(_backgroundAudioDurationSeconds) ??
'',
style: TextStyle(fontSize: 10),
),
],
),
),
Row(
mainAxisSize: MainAxisSize.min,
children: [
IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? () => _forwardBackgroundAudio(-10)
: null,
iconSize: 32.0,
icon: Icon(Icons.replay_10),
color: Colors.black),
_backgroundAudioPlaying
? IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? () {
_pauseBackgroundAudio();
}
: null,
iconSize: 40.0,
icon: Icon(Icons.pause_circle_filled),
color: Colors.black)
: IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? null
: () {
_resumeBackgroundAudio();
},
iconSize: 40.0,
icon: Icon(Icons.play_circle_filled),
color: Colors.black),
IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? () => _forwardBackgroundAudio(30)
: null,
iconSize: 32.0,
icon: Icon(Icons.forward_30),
color: Colors.black),
),
Text(
_stringForSeconds(_backgroundAudioDurationSeconds) ?? '',
style: TextStyle(fontSize: 10),
),
],
),
]),
),
Container(
height: 100,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Material(
color: Colors.transparent,
child: IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? () => _forwardBackgroundAudio(-10)
: null,
iconSize: 32.0,
icon: Icon(Icons.replay_10),
color: Colors.black),
),
_backgroundAudioPlaying
? Material(
color: Colors.transparent,
child: IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? () {
_pauseBackgroundAudio();
}
: null,
iconSize: 40.0,
icon: Icon(Icons.pause_circle_filled),
color: Colors.black),
)
: Material(
color: Colors.transparent,
child: IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? null
: () {
_resumeBackgroundAudio();
},
iconSize: 40.0,
icon: Icon(Icons.play_circle_filled),
color: Colors.black),
),
Material(
color: Colors.transparent,
child: IconButton(
padding: EdgeInsets.symmetric(horizontal: 30.0),
onPressed: _backgroundAudioPlaying
? () => _forwardBackgroundAudio(30)
: null,
iconSize: 32.0,
icon: Icon(Icons.forward_30),
color: Colors.black),
),
],
),
),
]),
);
Widget _miniPanel() => Container(
height: 60,
@ -524,12 +536,13 @@ class _PlayerWidgetState extends State<PlayerWidget> {
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
alignment: Alignment.centerLeft,
width: 220,
child: (_title.length > 30)
? Marquee(
text: _title,
style: TextStyle(fontWeight: FontWeight.bold),
scrollAxis: Axis.horizontal,
scrollAxis: Axis.vertical,
crossAxisAlignment: CrossAxisAlignment.start,
blankSpace: 30.0,
velocity: 50.0,
@ -543,25 +556,32 @@ class _PlayerWidgetState extends State<PlayerWidget> {
: Text(
_title,
style: TextStyle(fontWeight: FontWeight.bold),
maxLines: 2,
),
),
Spacer(),
Container(
padding: EdgeInsets.symmetric(horizontal: 20.0),
child: Row(
children: <Widget>[
Text(
_stringForSeconds(_backgroundAudioDurationSeconds -
_backgroundAudioPositionSeconds) ??
'',
style: TextStyle(color: _c),
),
Text(
' Left',
style: TextStyle(color: _c),
),
],
),
child: _remoteAudioLoading
? Text(
'Buffring...',
style: TextStyle(color: Colors.blue),
)
: Row(
children: <Widget>[
Text(
_stringForSeconds(
_backgroundAudioDurationSeconds -
_backgroundAudioPositionSeconds) ??
'',
style: TextStyle(color: _c),
),
Text(
' Left',
style: TextStyle(color: _c),
),
],
),
),
Row(
mainAxisSize: MainAxisSize.min,

109
lib/home/audiopanel.dart
View File

@ -20,7 +20,6 @@ class _AudioPanelState extends State<AudioPanel>
@override
void initState() {
super.initState();
initSize = minSize;
_controller =
AnimationController(vsync: this, duration: Duration(milliseconds: 100))
@ -29,6 +28,7 @@ class _AudioPanelState extends State<AudioPanel>
});
_animation =
Tween<double>(begin: initSize, end: initSize).animate(_controller);
super.initState();
}
@override
@ -39,63 +39,81 @@ class _AudioPanelState extends State<AudioPanel>
@override
Widget build(BuildContext context) {
return GestureDetector(
onVerticalDragStart: (event) => _start(event),
onVerticalDragUpdate: (event) => _update(event),
onVerticalDragEnd: (event) => _end(),
child: Container(
height: (_animation.value >= maxSize)
? maxSize
: (_animation.value <= minSize) ? minSize : _animation.value,
child: _animation.value < minSize + 30
? Opacity(
opacity: _animation.value > minSize
? (minSize + 30 - _animation.value) / 40
: 1,
child: Container(
child: widget.miniPanel,
),
)
: Container(
decoration: BoxDecoration(
color: Colors.grey[100],
boxShadow: [
BoxShadow(
color: Colors.grey[400].withOpacity(0.8),
spreadRadius: 3,
blurRadius: 6,
offset: Offset(0, -1),
)
],
),
child: SingleChildScrollView(
child: Opacity(
opacity: _animation.value < (maxSize - 50)
? (_animation.value - minSize) /
(maxSize - minSize - 50)
: 1,
child: Container(
height: maxSize,
child: widget.expandedPanel,
),
return Stack(children: <Widget>[
Container(
child: (_animation.value > minSize + 30)
? Positioned.fill(
child: GestureDetector(
onTap: () => _backToMini(),
child: Container(
color: Colors.white.withOpacity(0.5),
),
),
),
)
: Center(),
),
);
Container(
alignment: Alignment.bottomCenter,
child: GestureDetector(
onVerticalDragStart: (event) => _start(event),
onVerticalDragUpdate: (event) => _update(event),
onVerticalDragEnd: (event) => _end(),
child: Container(
height: (_animation.value >= maxSize)
? maxSize
: (_animation.value <= minSize) ? minSize : _animation.value,
child: _animation.value < minSize + 30
? Container(
color: Colors.grey[100],
child: Opacity(
opacity: _animation.value > minSize
? (minSize + 30 - _animation.value) / 40
: 1,
child: Container(
child: widget.miniPanel,
),
),
)
: Container(
color: Colors.grey[100],
child: SingleChildScrollView(
child: Opacity(
opacity: _animation.value < (maxSize - 50)
? (_animation.value - minSize) /
(maxSize - minSize - 50)
: 1,
child: Container(
height: maxSize,
child: widget.expandedPanel,
),
),
),
),
),
),
),
]);
}
_backToMini() {
setState(() {
_animation =
Tween<double>(begin: initSize, end: minSize).animate(_controller);
initSize = minSize;
});
_controller.forward();
}
_start(DragStartDetails event) {
print(event.localPosition.dy);
setState(() {
_startdy = event.localPosition.dy;
_animation =
Tween<double>(begin: initSize, end: initSize).animate(_controller);
});
_controller.forward();
}
_update(DragUpdateDetails event) {
print(event.localPosition.dy);
setState(() {
_move = _startdy - event.localPosition.dy;
_animation = Tween<double>(begin: initSize, end: initSize + _move)
@ -105,7 +123,6 @@ class _AudioPanelState extends State<AudioPanel>
}
_end() {
print(_animation.value);
if (_animation.value >= (maxSize + minSize) / 2.2 &&
_animation.value < maxSize) {
setState(() {

6
lib/home/home.dart
View File

@ -16,6 +16,11 @@ class Home extends StatefulWidget {
}
class _HomeState extends State<Home> {
@override
void initState(){
super.initState();
}
@override
Widget build(BuildContext context) {
return Stack(children: <Widget>[
@ -53,7 +58,6 @@ class _HomeState extends State<Home> {
],
),
Container(
alignment: Alignment.bottomCenter,
child: PlayerWidget()),
]);
}

31
lib/home/homescroll.dart
View File

@ -170,19 +170,22 @@ class _PodcastPreviewState extends State<PodcastPreview> {
Text(widget.podcastLocal.title,
style: TextStyle(fontWeight: FontWeight.bold, color: _c)),
Spacer(),
IconButton(
icon: Icon(Icons.arrow_forward),
splashColor: Colors.transparent,
tooltip: 'See All',
onPressed: () {
Navigator.push(
context,
SlideLeftRoute(
page: PodcastDetail(
podcastLocal: widget.podcastLocal,
)),
);
},
Material(
color: Colors.transparent,
child: IconButton(
icon: Icon(Icons.arrow_forward),
splashColor: Colors.transparent,
tooltip: 'See All',
onPressed: () {
Navigator.push(
context,
SlideLeftRoute(
page: PodcastDetail(
podcastLocal: widget.podcastLocal,
)),
);
},
),
),
],
),
@ -228,7 +231,7 @@ class ShowEpisode extends StatelessWidget {
ScaleRoute(
page: EpisodeDetail(
episodeItem: podcast[index],
heroTag: 'scroll',
heroTag: 'scroll',
//unique hero tag
)),
);