kitty/spotube
1
0
Fork 0
mirror of https://github.com/KRTirtho/spotube.git synced 2025-09-13 07:55:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: tabbar overflow in small screen, artist card too small title and synced lyrics contrast increased

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2022-08-19 12:58:35 +06:00
parent 8d77b6900a
commit 585de8c1de
9 changed files with 67 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
lib/components/Artist/ArtistCard.dart
View File

@ -47,16 +47,12 @@ class ArtistCard extends StatelessWidget {
minRadius: 20, minRadius: 20,
backgroundImage: backgroundImage, backgroundImage: backgroundImage,
), ),
SizedBox( SpotubeMarqueeText(
height: 20, text: artist.name!,
child: SpotubeMarqueeText( style: Theme.of(context).textTheme.bodyLarge!.copyWith(
text: artist.name!, fontWeight: FontWeight.bold,
style: Theme.of(context).textTheme.bodyLarge!.copyWith( ),
fontWeight: FontWeight.bold, isHovering: isHovering,
),
minStartLength: 15,
isHovering: isHovering,
),
), ),
Text( Text(
"Artist", "Artist",

9
lib/components/Library/UserLibrary.dart
View File

@ -18,12 +18,9 @@ class UserLibrary extends ConsumerWidget {
length: 4, length: 4,
child: SafeArea( child: SafeArea(
child: Scaffold( child: Scaffold(
appBar: TabBar( appBar: const TabBar(
indicator: const BoxDecoration(color: Colors.transparent), isScrollable: true,
labelColor: Theme.of(context).primaryColor, tabs: [
unselectedLabelColor:
Theme.of(context).textTheme.bodyText1?.color,
tabs: const [
Tab(text: "Playlist"), Tab(text: "Playlist"),
Tab(text: "Artists"), Tab(text: "Artists"),
Tab(text: "Album"), Tab(text: "Album"),

43
lib/components/Lyrics/SyncedLyrics.dart
View File

@ -1,5 +1,6 @@
import 'dart:ui'; import 'dart:ui';
import 'package:auto_size_text/auto_size_text.dart';
import 'package:cached_network_image/cached_network_image.dart'; import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
@ -160,7 +161,6 @@ class SyncedLyrics extends HookConsumerWidget {
child: SpotubeMarqueeText( child: SpotubeMarqueeText(
text: playback.track?.name ?? "Not Playing", text: playback.track?.name ?? "Not Playing",
style: headlineTextStyle, style: headlineTextStyle,
minStartLength: 29,
isHovering: true, isHovering: true,
), ),
), ),
@ -218,24 +218,31 @@ class SyncedLyrics extends HookConsumerWidget {
key: ValueKey(index), key: ValueKey(index),
index: index, index: index,
controller: controller, controller: controller,
child: Center( child: lyricSlice.text.isEmpty
child: Padding( ? Container()
padding: const EdgeInsets.all(8.0), : Center(
child: Text( child: Padding(
lyricSlice.text, padding: const EdgeInsets.all(8.0),
style: TextStyle( child: AutoSizeText(
// indicating the active state of that lyric slice lyricSlice.text,
color: isActive maxLines: 2,
? Theme.of(context).primaryColor style: Theme.of(context)
: palette.bodyTextColor, .textTheme
fontWeight: .headline4
isActive ? FontWeight.bold : null, ?.copyWith(
fontSize: 30, color: isActive
? Theme.of(context)
.backgroundColor
: palette.bodyTextColor,
// indicating the active state of that lyric slice
fontWeight: isActive
? FontWeight.bold
: null,
),
textAlign: TextAlign.center,
),
),
), ),
textAlign: TextAlign.center,
),
),
),
); );
}, },
), ),

1
lib/components/Player/PlayerView.dart
View File

@ -90,7 +90,6 @@ class PlayerView extends HookConsumerWidget {
color: paletteColor.titleTextColor, color: paletteColor.titleTextColor,
), ),
isHovering: true, isHovering: true,
minStartLength: 29,
), ),
), ),
TypeConversionUtils.artists_X_ClickableArtists( TypeConversionUtils.artists_X_ClickableArtists(

21
lib/components/Settings/Settings.dart
View File

@ -1,3 +1,4 @@
import 'package:auto_size_text/auto_size_text.dart';
import 'package:file_picker/file_picker.dart'; import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
@ -164,7 +165,10 @@ class Settings extends HookConsumerWidget {
), ),
AdaptiveListTile( AdaptiveListTile(
leading: const Icon(Icons.screen_search_desktop_rounded), leading: const Icon(Icons.screen_search_desktop_rounded),
title: const Text("Format of the YouTube Search term"), title: const AutoSizeText(
"Format of the YouTube Search term",
maxLines: 2,
),
subtitle: const Text("(Case sensitive)"), subtitle: const Text("(Case sensitive)"),
breakOn: Breakpoints.lg, breakOn: Breakpoints.lg,
trailing: ConstrainedBox( trailing: ConstrainedBox(
@ -218,7 +222,7 @@ class Settings extends HookConsumerWidget {
Icons.login_rounded, Icons.login_rounded,
color: Theme.of(context).primaryColor, color: Theme.of(context).primaryColor,
), ),
title: Text( title: AutoSizeText(
"Login with your Spotify account", "Login with your Spotify account",
style: TextStyle( style: TextStyle(
color: Theme.of(context).primaryColor, color: Theme.of(context).primaryColor,
@ -250,7 +254,10 @@ class Settings extends HookConsumerWidget {
), ),
AdaptiveListTile( AdaptiveListTile(
leading: const Icon(Icons.low_priority_rounded), leading: const Icon(Icons.low_priority_rounded),
title: const Text("Track Match Algorithm"), title: const AutoSizeText(
"Track Match Algorithm",
maxLines: 1,
),
trailing: DropdownButton<SpotubeTrackMatchAlgorithm>( trailing: DropdownButton<SpotubeTrackMatchAlgorithm>(
value: preferences.trackMatchAlgorithm, value: preferences.trackMatchAlgorithm,
items: const [ items: const [
@ -307,7 +314,10 @@ class Settings extends HookConsumerWidget {
Auth auth = ref.watch(authProvider); Auth auth = ref.watch(authProvider);
return ListTile( return ListTile(
leading: const Icon(Icons.logout_rounded), leading: const Icon(Icons.logout_rounded),
title: const Text("Log out of this account"), title: const AutoSizeText(
"Log out of this account",
maxLines: 1,
),
trailing: ElevatedButton( trailing: ElevatedButton(
child: const Text("Logout"), child: const Text("Logout"),
style: ButtonStyle( style: ButtonStyle(
@ -328,8 +338,9 @@ class Settings extends HookConsumerWidget {
Icons.favorite_border_rounded, Icons.favorite_border_rounded,
color: Colors.pink, color: Colors.pink,
), ),
title: const Text( title: const AutoSizeText(
"We know you Love Spotube", "We know you Love Spotube",
maxLines: 1,
style: TextStyle( style: TextStyle(
color: Colors.pink, color: Colors.pink,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,

2
lib/components/Shared/PlaybuttonCard.dart
View File

@ -106,7 +106,6 @@ class PlaybuttonCard extends StatelessWidget {
text: title, text: title,
style: style:
const TextStyle(fontWeight: FontWeight.bold), const TextStyle(fontWeight: FontWeight.bold),
minStartLength: 20,
isHovering: isHovering, isHovering: isHovering,
), ),
), ),
@ -125,7 +124,6 @@ class PlaybuttonCard extends StatelessWidget {
?.color, ?.color,
), ),
isHovering: isHovering, isHovering: isHovering,
minStartLength: 30,
), ),
), ),
] ]

3
lib/components/Shared/SpotubeMarqueeText.dart
View File

@ -4,13 +4,11 @@ import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:marquee/marquee.dart'; import 'package:marquee/marquee.dart';
class SpotubeMarqueeText extends HookWidget { class SpotubeMarqueeText extends HookWidget {
final int? minStartLength;
final bool? isHovering; final bool? isHovering;
const SpotubeMarqueeText({ const SpotubeMarqueeText({
Key? key, Key? key,
required this.text, required this.text,
this.style, this.style,
this.minStartLength,
this.isHovering, this.isHovering,
}) : super(key: key); }) : super(key: key);
final TextStyle? style; final TextStyle? style;
@ -29,6 +27,7 @@ class SpotubeMarqueeText extends HookWidget {
text, text,
minFontSize: 13, minFontSize: 13,
style: style, style: style,
maxLines: 1,
overflowReplacement: Marquee( overflowReplacement: Marquee(
key: uKey.value, key: uKey.value,
text: text, text: text,

8
lib/themes/dark-theme.dart
View File

@ -80,5 +80,13 @@ ThemeData darkTheme({
} }
}), }),
), ),
tabBarTheme: TabBarTheme(
indicator: const BoxDecoration(color: Colors.transparent),
labelColor: accentMaterialColor[500],
unselectedLabelColor: Colors.white,
labelStyle: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
unselectedLabelStyle:
const TextStyle(fontWeight: FontWeight.w600, fontSize: 16),
),
); );
} }

8
lib/themes/light-theme.dart
View File

@ -104,5 +104,13 @@ ThemeData lightTheme({
} }
}), }),
), ),
tabBarTheme: TabBarTheme(
indicator: const BoxDecoration(color: Colors.transparent),
labelColor: accentMaterialColor[500],
unselectedLabelColor: Colors.grey[850],
labelStyle: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
unselectedLabelStyle:
const TextStyle(fontWeight: FontWeight.w600, fontSize: 16),
),
); );
} }