Minor ui update.

This commit is contained in:
Stonegate 2021-01-02 18:48:55 +08:00
parent 48ca171ada
commit 7a43dd9058
5 changed files with 136 additions and 43 deletions

View File

@ -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))
], ],
) )
], ],

View File

@ -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,

View File

@ -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(

View File

@ -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,
),
);
}
}

View File

@ -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),