fix: generate playlist page max width

This commit is contained in:
Kingkor Roy Tirtho 2023-08-15 13:13:07 +06:00
parent c69f81ec6f
commit 4adf6951d9
2 changed files with 276 additions and 255 deletions

View File

@ -1,12 +1,25 @@
import 'package:flutter/widgets.dart';
// ignore: constant_identifier_names
const Breakpoints = (
xs: 480.0,
sm: 640.0,
md: 820.0,
lg: 1024.0,
xl: 1280.0,
);
extension ContainerBreakpoints on BoxConstraints {
bool get isXs => biggest.width <= 480;
bool get isSm => biggest.width > 480 && biggest.width <= 640;
bool get isMd => biggest.width > 640 && biggest.width <= 820;
bool get isLg => biggest.width > 820 && biggest.width <= 1024;
bool get isXl => biggest.width > 1024 && biggest.width <= 1280;
bool get is2Xl => biggest.width > 1280;
bool get isXs => biggest.width <= Breakpoints.xs;
bool get isSm =>
biggest.width > Breakpoints.xs && biggest.width <= Breakpoints.sm;
bool get isMd =>
biggest.width > Breakpoints.sm && biggest.width <= Breakpoints.md;
bool get isLg =>
biggest.width > Breakpoints.md && biggest.width <= Breakpoints.lg;
bool get isXl =>
biggest.width > Breakpoints.lg && biggest.width <= Breakpoints.xl;
bool get is2Xl => biggest.width > Breakpoints.xl;
bool get smAndUp => isSm || isMd || isLg || isXl || is2Xl;
bool get mdAndUp => isMd || isLg || isXl || is2Xl;
@ -20,12 +33,12 @@ extension ContainerBreakpoints on BoxConstraints {
}
extension ScreenBreakpoints on MediaQueryData {
bool get isXs => size.width <= 480;
bool get isSm => size.width > 480 && size.width <= 640;
bool get isMd => size.width > 640 && size.width <= 820;
bool get isLg => size.width > 820 && size.width <= 1024;
bool get isXl => size.width > 1024 && size.width <= 1280;
bool get is2Xl => size.width > 1280;
bool get isXs => size.width <= Breakpoints.xs;
bool get isSm => size.width > Breakpoints.xs && size.width <= Breakpoints.sm;
bool get isMd => size.width > Breakpoints.sm && size.width <= Breakpoints.md;
bool get isLg => size.width > Breakpoints.md && size.width <= Breakpoints.lg;
bool get isXl => size.width > Breakpoints.lg && size.width <= Breakpoints.xl;
bool get is2Xl => size.width > Breakpoints.xl;
bool get smAndUp => isSm || isMd || isLg || isXl || is2Xl;
bool get mdAndUp => isMd || isLg || isXl || is2Xl;

View File

@ -248,7 +248,10 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
title: Text(context.l10n.generate_playlist),
centerTitle: true,
),
body: SliderTheme(
body: Center(
child: ConstrainedBox(
constraints: BoxConstraints(maxWidth: Breakpoints.lg),
child: SliderTheme(
data: const SliderThemeData(
overlayShape: RoundSliderOverlayShape(),
),
@ -463,10 +466,13 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
genres.value.isEmpty
? null
: () {
final PlaylistGenerateResultRouteState routeState = (
final PlaylistGenerateResultRouteState
routeState = (
seeds: (
artists: artists.value.map((a) => a.id!).toList(),
tracks: tracks.value.map((t) => t.id!).toList(),
artists:
artists.value.map((a) => a.id!).toList(),
tracks:
tracks.value.map((t) => t.id!).toList(),
genres: genres.value
),
market: market.value,
@ -499,6 +505,8 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
}),
),
),
),
),
);
}
}