mirror of
https://github.com/KRTirtho/spotube.git
synced 2025-09-16 09:05:16 +00:00
fix(playbutton_card): annoying animation
This commit is contained in:
parent
ac0e2e74d8
commit
574406dd5f
@ -8,7 +8,6 @@ import 'package:spotube/components/shared/hover_builder.dart';
|
|||||||
import 'package:spotube/components/shared/image/universal_image.dart';
|
import 'package:spotube/components/shared/image/universal_image.dart';
|
||||||
import 'package:spotube/hooks/use_breakpoint_value.dart';
|
import 'package:spotube/hooks/use_breakpoint_value.dart';
|
||||||
import 'package:spotube/hooks/use_brightness_value.dart';
|
import 'package:spotube/hooks/use_brightness_value.dart';
|
||||||
import 'package:spotube/utils/platform.dart';
|
|
||||||
|
|
||||||
final htmlTagRegexp = RegExp(r"<[^>]*>", caseSensitive: true);
|
final htmlTagRegexp = RegExp(r"<[^>]*>", caseSensitive: true);
|
||||||
|
|
||||||
@ -59,9 +58,9 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
);
|
);
|
||||||
|
|
||||||
final end = useBreakpointValue<double>(
|
final end = useBreakpointValue<double>(
|
||||||
xs: 15,
|
xs: 10,
|
||||||
sm: 15,
|
sm: 10,
|
||||||
others: 20,
|
others: 15,
|
||||||
);
|
);
|
||||||
|
|
||||||
final textsHeight = useState(
|
final textsHeight = useState(
|
||||||
@ -84,9 +83,7 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
return null;
|
return null;
|
||||||
}, [textsKey]);
|
}, [textsKey]);
|
||||||
|
|
||||||
return Stack(
|
return Container(
|
||||||
children: [
|
|
||||||
Container(
|
|
||||||
constraints: BoxConstraints(maxWidth: size),
|
constraints: BoxConstraints(maxWidth: size),
|
||||||
margin: margin,
|
margin: margin,
|
||||||
child: Material(
|
child: Material(
|
||||||
@ -106,6 +103,9 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
child: Column(
|
child: Column(
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Stack(
|
||||||
|
clipBehavior: Clip.none,
|
||||||
children: [
|
children: [
|
||||||
Padding(
|
Padding(
|
||||||
padding: const EdgeInsets.only(
|
padding: const EdgeInsets.only(
|
||||||
@ -121,45 +121,10 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
Column(
|
|
||||||
key: textsKey,
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
const SizedBox(height: 15),
|
|
||||||
Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
|
||||||
child: AutoSizeText(
|
|
||||||
title,
|
|
||||||
maxLines: 1,
|
|
||||||
minFontSize: theme.textTheme.bodyMedium!.fontSize!,
|
|
||||||
overflow: TextOverflow.ellipsis,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
if (cleanDescription != null)
|
|
||||||
Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
|
||||||
child: AutoSizeText(
|
|
||||||
cleanDescription,
|
|
||||||
maxLines: 2,
|
|
||||||
style: theme.textTheme.bodySmall?.copyWith(
|
|
||||||
color:
|
|
||||||
theme.colorScheme.onSurface.withOpacity(.5),
|
|
||||||
),
|
|
||||||
overflow: TextOverflow.ellipsis,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(height: 10),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
if (isOwner)
|
if (isOwner)
|
||||||
Positioned(
|
Positioned(
|
||||||
top: 15,
|
top: 15,
|
||||||
left: 25,
|
left: 15,
|
||||||
child: AnimatedSize(
|
child: AnimatedSize(
|
||||||
duration: const Duration(milliseconds: 150),
|
duration: const Duration(milliseconds: 150),
|
||||||
alignment: Alignment.centerLeft,
|
alignment: Alignment.centerLeft,
|
||||||
@ -192,10 +157,9 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
}),
|
}),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
AnimatedPositioned(
|
Positioned(
|
||||||
duration: const Duration(milliseconds: 300),
|
|
||||||
right: end,
|
right: end,
|
||||||
bottom: textsHeight.value - (kIsMobile ? 5 : 10),
|
bottom: -15,
|
||||||
child: Column(
|
child: Column(
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
children: [
|
children: [
|
||||||
@ -219,7 +183,8 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
icon: isLoading
|
icon: isLoading
|
||||||
? SizedBox.fromSize(
|
? SizedBox.fromSize(
|
||||||
size: const Size.square(15),
|
size: const Size.square(15),
|
||||||
child: const CircularProgressIndicator(strokeWidth: 2),
|
child: const CircularProgressIndicator(
|
||||||
|
strokeWidth: 2),
|
||||||
)
|
)
|
||||||
: isPlaying
|
: isPlaying
|
||||||
? const Icon(SpotubeIcons.pause)
|
? const Icon(SpotubeIcons.pause)
|
||||||
@ -230,6 +195,40 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
),
|
||||||
|
Column(
|
||||||
|
key: textsKey,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
const SizedBox(height: 15),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
||||||
|
child: AutoSizeText(
|
||||||
|
title,
|
||||||
|
maxLines: 1,
|
||||||
|
minFontSize: theme.textTheme.bodyMedium!.fontSize!,
|
||||||
|
overflow: TextOverflow.ellipsis,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
if (cleanDescription != null)
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: 12.0),
|
||||||
|
child: AutoSizeText(
|
||||||
|
cleanDescription,
|
||||||
|
maxLines: 2,
|
||||||
|
style: theme.textTheme.bodySmall?.copyWith(
|
||||||
|
color: theme.colorScheme.onSurface.withOpacity(.5),
|
||||||
|
),
|
||||||
|
overflow: TextOverflow.ellipsis,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(height: 10),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,4 @@
|
|||||||
import 'package:collection/collection.dart';
|
import 'package:collection/collection.dart';
|
||||||
import 'package:flutter/foundation.dart';
|
|
||||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||||
import 'package:spotify/spotify.dart';
|
import 'package:spotify/spotify.dart';
|
||||||
import 'package:spotube/models/local_track.dart';
|
import 'package:spotube/models/local_track.dart';
|
||||||
|
Loading…
Reference in New Issue
Block a user