mirror of
https://github.com/KRTirtho/spotube.git
synced 2025-09-13 07:55:18 +00:00
Created a custom SpotubeMarqueeText widget to improve maintainability and also used it for the PlayButtonCards in the Browse page
This commit is contained in:
parent
5df96b5892
commit
8a10a52b0f
@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
|
|||||||
import 'package:go_router/go_router.dart';
|
import 'package:go_router/go_router.dart';
|
||||||
import 'package:marquee/marquee.dart';
|
import 'package:marquee/marquee.dart';
|
||||||
import 'package:spotify/spotify.dart';
|
import 'package:spotify/spotify.dart';
|
||||||
|
import 'package:spotube/components/Shared/SpotubeWidgets.dart';
|
||||||
|
|
||||||
class ArtistCard extends StatelessWidget {
|
class ArtistCard extends StatelessWidget {
|
||||||
final Artist artist;
|
final Artist artist;
|
||||||
@ -45,21 +46,9 @@ class ArtistCard extends StatelessWidget {
|
|||||||
SizedBox(
|
SizedBox(
|
||||||
height: 30,
|
height: 30,
|
||||||
child: artist.name!.length > 15
|
child: artist.name!.length > 15
|
||||||
? Marquee(
|
? SpotubeMarqueeText(
|
||||||
text: artist.name!,
|
text: artist.name!,
|
||||||
style: Theme.of(context).textTheme.headline5,
|
textStyle: Theme.of(context).textTheme.headline5!,
|
||||||
scrollAxis: Axis.horizontal,
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
blankSpace: 60.0,
|
|
||||||
velocity: 30.0,
|
|
||||||
startAfter: const Duration(seconds: 2),
|
|
||||||
pauseAfterRound: const Duration(seconds: 2),
|
|
||||||
accelerationDuration: const Duration(seconds: 1),
|
|
||||||
accelerationCurve: Curves.linear,
|
|
||||||
decelerationDuration: const Duration(milliseconds: 500),
|
|
||||||
decelerationCurve: Curves.easeOut,
|
|
||||||
fadingEdgeStartFraction: 0.15,
|
|
||||||
fadingEdgeEndFraction: 0.15,
|
|
||||||
)
|
)
|
||||||
: Text(
|
: Text(
|
||||||
artist.name!,
|
artist.name!,
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
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:marquee/marquee.dart';
|
import 'package:spotube/components/Shared/SpotubeWidgets.dart';
|
||||||
|
|
||||||
class PlaybuttonCard extends StatelessWidget {
|
class PlaybuttonCard extends StatelessWidget {
|
||||||
final void Function()? onTap;
|
final void Function()? onTap;
|
||||||
@ -88,10 +88,19 @@ class PlaybuttonCard extends StatelessWidget {
|
|||||||
children: [
|
children: [
|
||||||
Tooltip(
|
Tooltip(
|
||||||
message: title,
|
message: title,
|
||||||
child: Text(
|
child: SizedBox(
|
||||||
title,
|
height: 20,
|
||||||
style: const TextStyle(fontWeight: FontWeight.bold),
|
child: title.length > 25
|
||||||
overflow: TextOverflow.ellipsis,
|
? SpotubeMarqueeText(
|
||||||
|
text: title,
|
||||||
|
textStyle: const TextStyle(
|
||||||
|
fontWeight: FontWeight.bold),
|
||||||
|
)
|
||||||
|
: Text(
|
||||||
|
title,
|
||||||
|
style: const TextStyle(
|
||||||
|
fontWeight: FontWeight.bold),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
if (description != null) ...[
|
if (description != null) ...[
|
||||||
@ -99,29 +108,15 @@ class PlaybuttonCard extends StatelessWidget {
|
|||||||
SizedBox(
|
SizedBox(
|
||||||
height: 30,
|
height: 30,
|
||||||
child: description!.length > 30
|
child: description!.length > 30
|
||||||
? Marquee(
|
? SpotubeMarqueeText(
|
||||||
text: description!,
|
text: description!,
|
||||||
style: TextStyle(
|
textStyle: TextStyle(
|
||||||
fontSize: 13,
|
fontSize: 13,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.textTheme
|
.textTheme
|
||||||
.headline4
|
.headline4
|
||||||
?.color,
|
?.color,
|
||||||
),
|
),
|
||||||
scrollAxis: Axis.horizontal,
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
blankSpace: 60.0,
|
|
||||||
velocity: 30.0,
|
|
||||||
startAfter: const Duration(seconds: 2),
|
|
||||||
pauseAfterRound: const Duration(seconds: 2),
|
|
||||||
accelerationDuration:
|
|
||||||
const Duration(seconds: 1),
|
|
||||||
accelerationCurve: Curves.linear,
|
|
||||||
decelerationDuration:
|
|
||||||
const Duration(milliseconds: 500),
|
|
||||||
decelerationCurve: Curves.easeOut,
|
|
||||||
fadingEdgeStartFraction: 0.15,
|
|
||||||
fadingEdgeEndFraction: 0.15,
|
|
||||||
)
|
)
|
||||||
: Text(
|
: Text(
|
||||||
description!,
|
description!,
|
||||||
|
30
lib/components/Shared/SpotubeWidgets.dart
Normal file
30
lib/components/Shared/SpotubeWidgets.dart
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:marquee/marquee.dart';
|
||||||
|
|
||||||
|
class SpotubeMarqueeText extends StatelessWidget {
|
||||||
|
const SpotubeMarqueeText(
|
||||||
|
{Key? key, required this.text, required this.textStyle})
|
||||||
|
: super(key: key);
|
||||||
|
final TextStyle textStyle;
|
||||||
|
final String text;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Marquee(
|
||||||
|
text: text,
|
||||||
|
style: textStyle,
|
||||||
|
scrollAxis: Axis.horizontal,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
blankSpace: 60.0,
|
||||||
|
velocity: 30.0,
|
||||||
|
startAfter: const Duration(seconds: 2),
|
||||||
|
pauseAfterRound: const Duration(seconds: 2),
|
||||||
|
accelerationDuration: const Duration(seconds: 1),
|
||||||
|
accelerationCurve: Curves.linear,
|
||||||
|
decelerationDuration: const Duration(milliseconds: 500),
|
||||||
|
decelerationCurve: Curves.easeOut,
|
||||||
|
fadingEdgeStartFraction: 0.15,
|
||||||
|
fadingEdgeEndFraction: 0.15,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user