pierre/MusicPlayer
1
0
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity

Improve new UI

Browse Source
This commit is contained in:
Pierre HUBERT 2022-10-01 15:56:22 +02:00
parent 25e64f67e0
commit fa8f72c376
1 changed files with 68 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

140
lib/ui/music_player.dart
View File

@ -17,7 +17,7 @@ extension DurationExt on Duration {
}
}
const double playlistWidth = 300;
const smartphoneSize = 700;
class MusicPlayer extends StatefulWidget {
final MusicsList musicsList;
@ -291,83 +291,79 @@ class _MusicPlayerState extends State<MusicPlayer> {
),
);
Widget _buildSmallPlayerWidget(double width) => fluent.Container(
color: Colors.black,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
fluent.ClipRect(
child: Flexible(
flex: 1,
child: ConstrainedBox(
constraints:
BoxConstraints(maxWidth: min(350, width * (1 / 2))),
child: Row(
children: [
RoundedImage(
child: CoverImage(
music: currMusic,
width: 80,
height: 80,
backgroundColor: Colors.black,
fit: BoxFit.cover,
),
),
// Artist area
const SizedBox(width: 10),
fluent.ClipRect(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
currMusic.title,
style: const TextStyle(fontSize: 22),
overflow: TextOverflow.ellipsis,
),
Text(
currMusic.artist,
textAlign: TextAlign.start,
overflow: TextOverflow.ellipsis,
),
],
),
)
],
Widget _buildSmallPlayerWidget(double width) {
var partSize = width > smartphoneSize ? width / 3 : width / 2.5;
return fluent.Container(
color: Colors.black,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
fluent.ClipRect(
child: SizedBox(
width: partSize,
child: Row(
children: [
RoundedImage(
child: CoverImage(
music: currMusic,
width: 80,
height: 80,
backgroundColor: Colors.black,
fit: BoxFit.cover,
),
),
),
// Artist area
const SizedBox(width: 10),
fluent.ClipRect(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
currMusic.title,
style: const TextStyle(fontSize: 22),
overflow: TextOverflow.ellipsis,
),
Text(
currMusic.artist,
textAlign: TextAlign.start,
overflow: TextOverflow.ellipsis,
),
],
),
)
],
),
),
const Spacer(),
Flexible(
child: ConstrainedBox(
constraints:
BoxConstraints(maxWidth: min(500, width * (1 / 4))),
child: Column(
),
SizedBox(
width: partSize,
child: Column(
children: [
fluent.Row(
children: [
fluent.Row(
children: [
DurationText(_position),
const SizedBox(width: 20),
_buildProgressBar(),
const SizedBox(width: 20),
DurationText(_duration),
],
),
const SizedBox(height: 5),
_buildPlayersIcons(25),
DurationText(_position),
const SizedBox(width: 20),
_buildProgressBar(),
const SizedBox(width: 20),
DurationText(_duration),
],
)),
),
const Spacer(),
_buildToggleListButton()
],
),
),
const SizedBox(height: 5),
_buildPlayersIcons(25),
],
)),
const Spacer(),
_buildToggleListButton()
],
),
);
),
);
}
Widget _buildPlayersIcons([double? size]) => fluent.Row(
children: [