Minor ui update.
This commit is contained in:
parent
48ca171ada
commit
7a43dd9058
|
@ -67,6 +67,7 @@ class _PlaylistHomeState extends State<PlaylistHome> {
|
||||||
child: Scaffold(
|
child: Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
leading: CustomBackButton(),
|
leading: CustomBackButton(),
|
||||||
|
centerTitle: true,
|
||||||
title: Selector<AudioPlayerNotifier, EpisodeBrief>(
|
title: Selector<AudioPlayerNotifier, EpisodeBrief>(
|
||||||
selector: (_, audio) => audio.episode,
|
selector: (_, audio) => audio.episode,
|
||||||
builder: (_, data, __) {
|
builder: (_, data, __) {
|
||||||
|
@ -218,10 +219,10 @@ class _PlaylistHomeState extends State<PlaylistHome> {
|
||||||
icon: Icon(Icons.history),
|
icon: Icon(Icons.history),
|
||||||
label: 'History',
|
label: 'History',
|
||||||
color: Colors.green,
|
color: Colors.green,
|
||||||
isSelected: _selected == 'Histtory',
|
isSelected: _selected == 'History',
|
||||||
onTap: () => setState(() {
|
onTap: () => setState(() {
|
||||||
_body = _History();
|
_body = _History();
|
||||||
_selected = 'Histtory';
|
_selected = 'History';
|
||||||
})),
|
})),
|
||||||
_tabWidget(
|
_tabWidget(
|
||||||
icon: Icon(Icons.playlist_play),
|
icon: Icon(Icons.playlist_play),
|
||||||
|
@ -284,6 +285,7 @@ class __QueueState extends State<_Queue> {
|
||||||
return EpisodeCard(episode,
|
return EpisodeCard(episode,
|
||||||
key: ValueKey('playing'),
|
key: ValueKey('playing'),
|
||||||
isPlaying: true,
|
isPlaying: true,
|
||||||
|
canReorder: true,
|
||||||
tileColor: context.primaryColorDark);
|
tileColor: context.primaryColorDark);
|
||||||
}
|
}
|
||||||
}).toList()
|
}).toList()
|
||||||
|
@ -610,6 +612,7 @@ class __PlaylistsState extends State<_Playlists> {
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
|
final s = context.s;
|
||||||
return Selector<AudioPlayerNotifier, List<Playlist>>(
|
return Selector<AudioPlayerNotifier, List<Playlist>>(
|
||||||
selector: (_, audio) => audio.playlists,
|
selector: (_, audio) => audio.playlists,
|
||||||
builder: (_, data, __) {
|
builder: (_, data, __) {
|
||||||
|
@ -628,7 +631,7 @@ class __PlaylistsState extends State<_Playlists> {
|
||||||
fullscreenDialog: true,
|
fullscreenDialog: true,
|
||||||
builder: (context) =>
|
builder: (context) =>
|
||||||
PlaylistDetail(data[index])),
|
PlaylistDetail(data[index])),
|
||||||
);
|
).then((value) => setState(() {}));
|
||||||
},
|
},
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(15.0),
|
padding: const EdgeInsets.all(15.0),
|
||||||
|
@ -680,7 +683,7 @@ class __PlaylistsState extends State<_Playlists> {
|
||||||
.read<AudioPlayerNotifier>()
|
.read<AudioPlayerNotifier>()
|
||||||
.playlistLoad(queue);
|
.playlistLoad(queue);
|
||||||
},
|
},
|
||||||
child: Text('Play'))
|
child: Text(s.play))
|
||||||
],
|
],
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
|
|
|
@ -780,6 +780,10 @@ class _PodcastDetailState extends State<PodcastDetail> {
|
||||||
brightness: Brightness.dark,
|
brightness: Brightness.dark,
|
||||||
actions: <Widget>[
|
actions: <Widget>[
|
||||||
Container(
|
Container(
|
||||||
|
width: 30,
|
||||||
|
height: 30,
|
||||||
|
margin:
|
||||||
|
EdgeInsets.symmetric(horizontal: 10),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: widget.podcastLocal.primaryColor
|
color: widget.podcastLocal.primaryColor
|
||||||
.colorizedark()
|
.colorizedark()
|
||||||
|
@ -789,7 +793,7 @@ class _PodcastDetailState extends State<PodcastDetail> {
|
||||||
child: IconButton(
|
child: IconButton(
|
||||||
icon: Icon(Icons.more_vert),
|
icon: Icon(Icons.more_vert),
|
||||||
padding: EdgeInsets.zero,
|
padding: EdgeInsets.zero,
|
||||||
splashRadius: 20,
|
splashRadius: 15,
|
||||||
tooltip: s.menu,
|
tooltip: s.menu,
|
||||||
onPressed: () => generalSheet(
|
onPressed: () => generalSheet(
|
||||||
context,
|
context,
|
||||||
|
@ -836,22 +840,29 @@ class _PodcastDetailState extends State<PodcastDetail> {
|
||||||
// return Center();
|
// return Center();
|
||||||
// }),
|
// }),
|
||||||
// ),
|
// ),
|
||||||
InkWell(
|
Padding(
|
||||||
|
padding: EdgeInsets.only(
|
||||||
|
top: 100 + context.paddingTop),
|
||||||
|
child: InkWell(
|
||||||
onTap: () => setState(
|
onTap: () => setState(
|
||||||
() => _showInfo = !_showInfo),
|
() => _showInfo = !_showInfo),
|
||||||
child: Container(
|
child: Container(
|
||||||
margin: EdgeInsets.only(
|
|
||||||
top: 100 + context.paddingTop),
|
|
||||||
padding: EdgeInsets.only(
|
padding: EdgeInsets.only(
|
||||||
left: 80, right: 20),
|
left: 80, right: 130),
|
||||||
color: Colors.white10,
|
color: Colors.white10,
|
||||||
alignment: Alignment.centerLeft,
|
alignment: Alignment.centerLeft,
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
Expanded(
|
||||||
child: Column(
|
child: Column(
|
||||||
mainAxisAlignment:
|
mainAxisAlignment:
|
||||||
MainAxisAlignment.start,
|
MainAxisAlignment
|
||||||
mainAxisSize: MainAxisSize.min,
|
.start,
|
||||||
|
mainAxisSize:
|
||||||
|
MainAxisSize.min,
|
||||||
crossAxisAlignment:
|
crossAxisAlignment:
|
||||||
CrossAxisAlignment.start,
|
CrossAxisAlignment
|
||||||
|
.start,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
Text(
|
Text(
|
||||||
widget.podcastLocal
|
widget.podcastLocal
|
||||||
|
@ -859,21 +870,32 @@ class _PodcastDetailState extends State<PodcastDetail> {
|
||||||
'',
|
'',
|
||||||
maxLines: 1,
|
maxLines: 1,
|
||||||
overflow:
|
overflow:
|
||||||
TextOverflow.ellipsis,
|
TextOverflow
|
||||||
|
.ellipsis,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
color: Colors.white)),
|
color: Colors
|
||||||
if (widget.podcastLocal.provider
|
.white)),
|
||||||
|
if (widget
|
||||||
|
.podcastLocal
|
||||||
|
.provider
|
||||||
.isNotEmpty)
|
.isNotEmpty)
|
||||||
Text(
|
Text(
|
||||||
s.hostedOn(widget
|
s.hostedOn(widget
|
||||||
.podcastLocal.provider),
|
.podcastLocal
|
||||||
|
.provider),
|
||||||
maxLines: 1,
|
maxLines: 1,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
color: Colors.white),
|
color: Colors
|
||||||
|
.white),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
UpDownIndicator(_showInfo, color: Colors.white),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
Container(
|
Container(
|
||||||
alignment: Alignment.centerRight,
|
alignment: Alignment.centerRight,
|
||||||
|
|
|
@ -138,6 +138,13 @@ class AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
|
||||||
? Colors.grey[400].withOpacity(0.5)
|
? Colors.grey[400].withOpacity(0.5)
|
||||||
: Colors.grey[800],
|
: Colors.grey[800],
|
||||||
),
|
),
|
||||||
|
BoxShadow(
|
||||||
|
offset: Offset(1, 0),
|
||||||
|
blurRadius: 1,
|
||||||
|
color: context.brightness == Brightness.light
|
||||||
|
? Colors.grey[400].withOpacity(0.5)
|
||||||
|
: Colors.grey[800],
|
||||||
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
child: SingleChildScrollView(
|
child: SingleChildScrollView(
|
||||||
|
|
|
@ -1393,3 +1393,58 @@ class _SleepTimerPickerState extends State<SleepTimerPicker> {
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class UpDownIndicator extends StatefulWidget {
|
||||||
|
final bool status;
|
||||||
|
final Color color;
|
||||||
|
UpDownIndicator(this.status, {this.color = Colors.white, Key key})
|
||||||
|
: super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
_UpDownIndicatorState createState() => _UpDownIndicatorState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _UpDownIndicatorState extends State<UpDownIndicator>
|
||||||
|
with SingleTickerProviderStateMixin {
|
||||||
|
double _value;
|
||||||
|
AnimationController _controller;
|
||||||
|
Animation _animation;
|
||||||
|
@override
|
||||||
|
void initState() {
|
||||||
|
super.initState();
|
||||||
|
_value = 0;
|
||||||
|
_controller =
|
||||||
|
AnimationController(vsync: this, duration: Duration(milliseconds: 300));
|
||||||
|
_animation = Tween<double>(begin: 0.0, end: 1.0).animate(_controller)
|
||||||
|
..addListener(() {
|
||||||
|
setState(() {
|
||||||
|
_value = _animation.value;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
void didUpdateWidget(covariant UpDownIndicator oldWidget) {
|
||||||
|
if (widget.status != oldWidget.status) {
|
||||||
|
widget.status ? _controller.forward() : _controller.reverse();
|
||||||
|
}
|
||||||
|
super.didUpdateWidget(oldWidget);
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
void dispose() {
|
||||||
|
_controller.dispose();
|
||||||
|
super.dispose();
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Transform.rotate(
|
||||||
|
angle: widget.status ? -math.pi * _value : math.pi * _value,
|
||||||
|
child: Icon(
|
||||||
|
Icons.keyboard_arrow_down,
|
||||||
|
color: widget.color,
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -101,6 +101,7 @@ class _DismissibleContainerState extends State<DismissibleContainer> {
|
||||||
child: EpisodeCard(
|
child: EpisodeCard(
|
||||||
widget.episode,
|
widget.episode,
|
||||||
isPlaying: false,
|
isPlaying: false,
|
||||||
|
canReorder: true,
|
||||||
onTap: () async {
|
onTap: () async {
|
||||||
await context
|
await context
|
||||||
.read<AudioPlayerNotifier>()
|
.read<AudioPlayerNotifier>()
|
||||||
|
@ -192,8 +193,13 @@ class EpisodeCard extends StatelessWidget {
|
||||||
final Color tileColor;
|
final Color tileColor;
|
||||||
final VoidCallback onTap;
|
final VoidCallback onTap;
|
||||||
final bool isPlaying;
|
final bool isPlaying;
|
||||||
|
final bool canReorder;
|
||||||
const EpisodeCard(this.episode,
|
const EpisodeCard(this.episode,
|
||||||
{this.tileColor, this.onTap, this.isPlaying, Key key})
|
{this.tileColor,
|
||||||
|
this.onTap,
|
||||||
|
this.isPlaying,
|
||||||
|
this.canReorder = false,
|
||||||
|
Key key})
|
||||||
: super(key: key);
|
: super(key: key);
|
||||||
|
|
||||||
@override
|
@override
|
||||||
|
@ -223,8 +229,8 @@ class EpisodeCard extends StatelessWidget {
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
children: [
|
children: [
|
||||||
// Icon(Icons.unfold_more, color: c),
|
if (canReorder) Icon(Icons.unfold_more, color: c),
|
||||||
SizedBox(width: 24),
|
SizedBox(width: canReorder ? 0 : 24),
|
||||||
CircleAvatar(
|
CircleAvatar(
|
||||||
backgroundColor: c.withOpacity(0.5),
|
backgroundColor: c.withOpacity(0.5),
|
||||||
backgroundImage: episode.avatarImage),
|
backgroundImage: episode.avatarImage),
|
||||||
|
|
Loading…
Reference in New Issue