mirror of
https://github.com/KRTirtho/spotube.git
synced 2025-09-13 16:05:18 +00:00
chore: make dropdown buttons more attractive
This commit is contained in:
parent
0d080b77b7
commit
de68fe3a6b
@ -1,5 +1,6 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||||
|
import 'package:spotube/collections/spotube_icons.dart';
|
||||||
import 'package:spotube/extensions/constrains.dart';
|
import 'package:spotube/extensions/constrains.dart';
|
||||||
|
|
||||||
class AdaptiveSelectTile<T> extends HookWidget {
|
class AdaptiveSelectTile<T> extends HookWidget {
|
||||||
@ -38,11 +39,22 @@ class AdaptiveSelectTile<T> extends HookWidget {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final theme = Theme.of(context);
|
final theme = Theme.of(context);
|
||||||
final mediaQuery = MediaQuery.of(context);
|
final mediaQuery = MediaQuery.of(context);
|
||||||
final rawControl = DropdownButton<T>(
|
final rawControl = DecoratedBox(
|
||||||
items: options,
|
decoration: BoxDecoration(
|
||||||
value: value,
|
color: theme.colorScheme.secondaryContainer,
|
||||||
onChanged: onChanged,
|
borderRadius: BorderRadius.circular(10),
|
||||||
menuMaxHeight: mediaQuery.size.height * 0.6,
|
),
|
||||||
|
child: DropdownButton<T>(
|
||||||
|
items: options,
|
||||||
|
value: value,
|
||||||
|
onChanged: onChanged,
|
||||||
|
menuMaxHeight: mediaQuery.size.height * 0.6,
|
||||||
|
underline: const SizedBox.shrink(),
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 10),
|
||||||
|
borderRadius: BorderRadius.circular(10),
|
||||||
|
icon: const Icon(SpotubeIcons.angleDown),
|
||||||
|
dropdownColor: theme.colorScheme.secondaryContainer,
|
||||||
|
),
|
||||||
);
|
);
|
||||||
final controlPlaceholder = useMemoized(
|
final controlPlaceholder = useMemoized(
|
||||||
() => options
|
() => options
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_desktop_tools/flutter_desktop_tools.dart';
|
import 'package:flutter_desktop_tools/flutter_desktop_tools.dart';
|
||||||
|
import 'package:gap/gap.dart';
|
||||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||||
import 'package:spotube/collections/spotube_icons.dart';
|
import 'package:spotube/collections/spotube_icons.dart';
|
||||||
import 'package:spotube/components/settings/section_card_with_heading.dart';
|
import 'package:spotube/components/settings/section_card_with_heading.dart';
|
||||||
@ -19,6 +20,7 @@ class SettingsDesktopSection extends HookConsumerWidget {
|
|||||||
return SectionCardWithHeading(
|
return SectionCardWithHeading(
|
||||||
heading: context.l10n.desktop,
|
heading: context.l10n.desktop,
|
||||||
children: [
|
children: [
|
||||||
|
const Gap(10),
|
||||||
AdaptiveSelectTile<CloseBehavior>(
|
AdaptiveSelectTile<CloseBehavior>(
|
||||||
secondary: const Icon(SpotubeIcons.close),
|
secondary: const Icon(SpotubeIcons.close),
|
||||||
title: Text(context.l10n.close_behavior),
|
title: Text(context.l10n.close_behavior),
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:gap/gap.dart';
|
||||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||||
import 'package:spotify/spotify.dart';
|
import 'package:spotify/spotify.dart';
|
||||||
import 'package:spotube/collections/language_codes.dart';
|
import 'package:spotube/collections/language_codes.dart';
|
||||||
@ -23,6 +24,7 @@ class SettingsLanguageRegionSection extends HookConsumerWidget {
|
|||||||
return SectionCardWithHeading(
|
return SectionCardWithHeading(
|
||||||
heading: context.l10n.language_region,
|
heading: context.l10n.language_region,
|
||||||
children: [
|
children: [
|
||||||
|
const Gap(10),
|
||||||
AdaptiveSelectTile<Locale>(
|
AdaptiveSelectTile<Locale>(
|
||||||
value: preferences.locale,
|
value: preferences.locale,
|
||||||
onChanged: (locale) {
|
onChanged: (locale) {
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import 'package:collection/collection.dart';
|
import 'package:collection/collection.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:gap/gap.dart';
|
||||||
import 'package:go_router/go_router.dart';
|
import 'package:go_router/go_router.dart';
|
||||||
import 'package:google_fonts/google_fonts.dart';
|
import 'package:google_fonts/google_fonts.dart';
|
||||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||||
@ -25,6 +26,7 @@ class SettingsPlaybackSection extends HookConsumerWidget {
|
|||||||
return SectionCardWithHeading(
|
return SectionCardWithHeading(
|
||||||
heading: context.l10n.playback,
|
heading: context.l10n.playback,
|
||||||
children: [
|
children: [
|
||||||
|
const Gap(10),
|
||||||
AdaptiveSelectTile<SourceQualities>(
|
AdaptiveSelectTile<SourceQualities>(
|
||||||
secondary: const Icon(SpotubeIcons.audioQuality),
|
secondary: const Icon(SpotubeIcons.audioQuality),
|
||||||
title: Text(context.l10n.audio_quality),
|
title: Text(context.l10n.audio_quality),
|
||||||
@ -49,6 +51,7 @@ class SettingsPlaybackSection extends HookConsumerWidget {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
const Gap(5),
|
||||||
AdaptiveSelectTile<AudioSource>(
|
AdaptiveSelectTile<AudioSource>(
|
||||||
secondary: const Icon(SpotubeIcons.api),
|
secondary: const Icon(SpotubeIcons.api),
|
||||||
title: Text(context.l10n.audio_source),
|
title: Text(context.l10n.audio_source),
|
||||||
@ -181,7 +184,8 @@ class SettingsPlaybackSection extends HookConsumerWidget {
|
|||||||
value: preferences.normalizeAudio,
|
value: preferences.normalizeAudio,
|
||||||
onChanged: preferencesNotifier.setNormalizeAudio,
|
onChanged: preferencesNotifier.setNormalizeAudio,
|
||||||
),
|
),
|
||||||
if (preferences.audioSource != AudioSource.jiosaavn)
|
if (preferences.audioSource != AudioSource.jiosaavn) ...[
|
||||||
|
const Gap(5),
|
||||||
AdaptiveSelectTile<SourceCodecs>(
|
AdaptiveSelectTile<SourceCodecs>(
|
||||||
secondary: const Icon(SpotubeIcons.stream),
|
secondary: const Icon(SpotubeIcons.stream),
|
||||||
title: Text(context.l10n.streaming_music_codec),
|
title: Text(context.l10n.streaming_music_codec),
|
||||||
@ -201,7 +205,7 @@ class SettingsPlaybackSection extends HookConsumerWidget {
|
|||||||
preferencesNotifier.setStreamMusicCodec(value);
|
preferencesNotifier.setStreamMusicCodec(value);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
if (preferences.audioSource != AudioSource.jiosaavn)
|
const Gap(5),
|
||||||
AdaptiveSelectTile<SourceCodecs>(
|
AdaptiveSelectTile<SourceCodecs>(
|
||||||
secondary: const Icon(SpotubeIcons.file),
|
secondary: const Icon(SpotubeIcons.file),
|
||||||
title: Text(context.l10n.download_music_codec),
|
title: Text(context.l10n.download_music_codec),
|
||||||
@ -220,7 +224,8 @@ class SettingsPlaybackSection extends HookConsumerWidget {
|
|||||||
if (value == null) return;
|
if (value == null) return;
|
||||||
preferencesNotifier.setDownloadMusicCodec(value);
|
preferencesNotifier.setDownloadMusicCodec(value);
|
||||||
},
|
},
|
||||||
),
|
)
|
||||||
|
],
|
||||||
SwitchListTile(
|
SwitchListTile(
|
||||||
secondary: const Icon(SpotubeIcons.repeat),
|
secondary: const Icon(SpotubeIcons.repeat),
|
||||||
title: Text(context.l10n.endless_playback),
|
title: Text(context.l10n.endless_playback),
|
||||||
|
Loading…
Reference in New Issue
Block a user