fix(player): playback element placement

This commit is contained in:
Kingkor Roy Tirtho 2023-04-10 21:14:47 +06:00
parent cb916d4861
commit 5e47faa606

View File

@ -93,118 +93,126 @@ class PlayerView extends HookConsumerWidget {
(palette.darkMutedColor ?? palette.lightMutedColor)?.color ?? (palette.darkMutedColor ?? palette.lightMutedColor)?.color ??
theme.colorScheme.secondaryContainer, theme.colorScheme.secondaryContainer,
], ],
child: Container( child: SingleChildScrollView(
alignment: Alignment.center, child: Container(
width: double.infinity, alignment: Alignment.center,
child: ConstrainedBox( width: double.infinity,
constraints: const BoxConstraints(maxWidth: 580), child: ConstrainedBox(
child: SafeArea( constraints: const BoxConstraints(maxWidth: 580),
child: Padding( child: SafeArea(
padding: const EdgeInsets.all(8.0), child: Padding(
child: Column( padding: const EdgeInsets.all(8.0),
children: [ child: Column(
Container( children: [
constraints: Padding(
const BoxConstraints(maxHeight: 300, maxWidth: 300), padding: const EdgeInsets.all(8.0),
decoration: BoxDecoration( child: Container(
borderRadius: BorderRadius.circular(20), constraints: const BoxConstraints(
boxShadow: const [ maxHeight: 300, maxWidth: 300),
BoxShadow( decoration: BoxDecoration(
color: Colors.black26, borderRadius: BorderRadius.circular(20),
spreadRadius: 2, boxShadow: const [
blurRadius: 10, BoxShadow(
offset: Offset(0, 0), color: Colors.black26,
spreadRadius: 2,
blurRadius: 10,
offset: Offset(0, 0),
),
],
),
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: UniversalImage(
path: albumArt,
placeholder: Assets.albumPlaceholder.path,
fit: BoxFit.cover,
),
), ),
],
),
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: UniversalImage(
path: albumArt,
placeholder: Assets.albumPlaceholder.path,
fit: BoxFit.cover,
), ),
), ),
), const SizedBox(height: 60),
const SizedBox(height: 10), Container(
Container( padding: const EdgeInsets.symmetric(horizontal: 16),
padding: const EdgeInsets.symmetric(horizontal: 16), alignment: Alignment.centerLeft,
alignment: Alignment.centerLeft, child: Column(
child: Column( crossAxisAlignment: CrossAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start, children: [
children: [ AutoSizeText(
AutoSizeText( currentTrack?.name ?? "Not playing",
currentTrack?.name ?? "Not playing", style: TextStyle(
style: TextStyle( color: titleTextColor,
fontSize: 20, fontSize: 22,
color: titleTextColor, ),
maxFontSize: 22,
maxLines: 1,
textAlign: TextAlign.start,
), ),
maxLines: 1, if (isLocalTrack)
textAlign: TextAlign.start, Text(
), TypeConversionUtils.artists_X_String<Artist>(
if (isLocalTrack) currentTrack?.artists ?? [],
Text( ),
TypeConversionUtils.artists_X_String<Artist>( style: theme.textTheme.bodyMedium!.copyWith(
fontWeight: FontWeight.bold,
color: bodyTextColor,
),
)
else
TypeConversionUtils.artists_X_ClickableArtists(
currentTrack?.artists ?? [], currentTrack?.artists ?? [],
textStyle:
theme.textTheme.bodyMedium!.copyWith(
fontWeight: FontWeight.bold,
color: bodyTextColor,
),
onRouteChange: (route) {
GoRouter.of(context).pop();
GoRouter.of(context).push(route);
},
), ),
style: theme.textTheme.bodyMedium!.copyWith( ],
fontWeight: FontWeight.bold, ),
color: bodyTextColor, ),
), const SizedBox(height: 10),
) PlayerControls(palette: palette),
else const SizedBox(height: 25),
TypeConversionUtils.artists_X_ClickableArtists( PlayerActions(
currentTrack?.artists ?? [], mainAxisAlignment: MainAxisAlignment.spaceEvenly,
textStyle: theme.textTheme.bodyMedium!.copyWith( floatingQueue: false,
fontWeight: FontWeight.bold, extraActions: [
color: bodyTextColor, if (auth != null)
), IconButton(
onRouteChange: (route) { tooltip: "Open Lyrics",
GoRouter.of(context).pop(); icon: const Icon(SpotubeIcons.music),
GoRouter.of(context).push(route); onPressed: () {
showModalBottomSheet(
context: context,
isDismissible: true,
enableDrag: true,
isScrollControlled: true,
backgroundColor: Colors.black38,
barrierColor: Colors.black12,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
),
constraints: BoxConstraints(
maxHeight:
MediaQuery.of(context).size.height *
0.8,
),
builder: (context) =>
const LyricsPage(isModal: true),
);
}, },
), )
], ],
), ),
), const SizedBox(height: 25)
const SizedBox(height: 40), ],
PlayerControls(palette: palette), ),
const Spacer(),
PlayerActions(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
floatingQueue: false,
extraActions: [
if (auth != null)
IconButton(
tooltip: "Open Lyrics",
icon: const Icon(SpotubeIcons.music),
onPressed: () {
showModalBottomSheet(
context: context,
isDismissible: true,
enableDrag: true,
isScrollControlled: true,
backgroundColor: Colors.black38,
barrierColor: Colors.black12,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
),
constraints: BoxConstraints(
maxHeight:
MediaQuery.of(context).size.height *
0.8,
),
builder: (context) =>
const LyricsPage(isModal: true),
);
},
)
],
),
],
), ),
), ),
), ),