mirror of
https://github.com/KRTirtho/spotube.git
synced 2025-09-12 23:45:18 +00:00
feat: platform slider and progress indicator integration
This commit is contained in:
parent
512446dcab
commit
46b00bafdf
@ -139,7 +139,8 @@ class ArtistProfile extends HookConsumerWidget {
|
|||||||
return const SizedBox(
|
return const SizedBox(
|
||||||
height: 20,
|
height: 20,
|
||||||
width: 20,
|
width: 20,
|
||||||
child: CircularProgressIndicator(),
|
child:
|
||||||
|
PlatformCircularProgressIndicator(),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -214,7 +215,7 @@ class ArtistProfile extends HookConsumerWidget {
|
|||||||
);
|
);
|
||||||
|
|
||||||
if (topTracksQuery.isLoading || !topTracksQuery.hasData) {
|
if (topTracksQuery.isLoading || !topTracksQuery.hasData) {
|
||||||
return const CircularProgressIndicator.adaptive();
|
return const PlatformCircularProgressIndicator();
|
||||||
} else if (topTracksQuery.hasError) {
|
} else if (topTracksQuery.hasError) {
|
||||||
return Center(
|
return Center(
|
||||||
child: Text(topTracksQuery.error.toString()),
|
child: Text(topTracksQuery.error.toString()),
|
||||||
@ -313,7 +314,7 @@ class ArtistProfile extends HookConsumerWidget {
|
|||||||
);
|
);
|
||||||
|
|
||||||
if (relatedArtists.isLoading || !relatedArtists.hasData) {
|
if (relatedArtists.isLoading || !relatedArtists.hasData) {
|
||||||
return const CircularProgressIndicator.adaptive();
|
return const PlatformCircularProgressIndicator();
|
||||||
} else if (relatedArtists.hasError) {
|
} else if (relatedArtists.hasError) {
|
||||||
return Center(
|
return Center(
|
||||||
child: Text(relatedArtists.error.toString()),
|
child: Text(relatedArtists.error.toString()),
|
||||||
|
@ -141,7 +141,7 @@ class Sidebar extends HookConsumerWidget {
|
|||||||
),
|
),
|
||||||
Text(
|
Text(
|
||||||
"Spotube",
|
"Spotube",
|
||||||
style: Theme.of(context).textTheme.headline4,
|
style: PlatformTheme.of(context).textTheme?.headline,
|
||||||
),
|
),
|
||||||
PlatformIconButton(
|
PlatformIconButton(
|
||||||
icon: const Icon(Icons.menu_rounded),
|
icon: const Icon(Icons.menu_rounded),
|
||||||
@ -207,7 +207,7 @@ class SidebarFooter extends HookConsumerWidget {
|
|||||||
children: [
|
children: [
|
||||||
if (auth.isLoggedIn && data == null)
|
if (auth.isLoggedIn && data == null)
|
||||||
const Center(
|
const Center(
|
||||||
child: CircularProgressIndicator(),
|
child: PlatformCircularProgressIndicator(),
|
||||||
)
|
)
|
||||||
else if (data != null)
|
else if (data != null)
|
||||||
Flexible(
|
Flexible(
|
||||||
@ -233,9 +233,10 @@ class SidebarFooter extends HookConsumerWidget {
|
|||||||
maxLines: 1,
|
maxLines: 1,
|
||||||
softWrap: false,
|
softWrap: false,
|
||||||
overflow: TextOverflow.fade,
|
overflow: TextOverflow.fade,
|
||||||
style: const TextStyle(
|
style: PlatformTheme.of(context)
|
||||||
fontWeight: FontWeight.bold,
|
.textTheme
|
||||||
),
|
?.body
|
||||||
|
?.copyWith(fontWeight: FontWeight.bold),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
@ -67,7 +67,7 @@ class UserDownloads extends HookConsumerWidget {
|
|||||||
trailing: const SizedBox(
|
trailing: const SizedBox(
|
||||||
width: 30,
|
width: 30,
|
||||||
height: 30,
|
height: 30,
|
||||||
child: CircularProgressIndicator.adaptive(),
|
child: PlatformCircularProgressIndicator(),
|
||||||
),
|
),
|
||||||
subtitle: Text(
|
subtitle: Text(
|
||||||
TypeConversionUtils.artists_X_String(
|
TypeConversionUtils.artists_X_String(
|
||||||
|
@ -68,13 +68,13 @@ class Player extends HookConsumerWidget {
|
|||||||
android: null,
|
android: null,
|
||||||
ios: Border(
|
ios: Border(
|
||||||
top: BorderSide(
|
top: BorderSide(
|
||||||
color: CupertinoTheme.of(context).barBackgroundColor,
|
color: PlatformTheme.of(context).borderColor ?? Colors.transparent,
|
||||||
width: 1,
|
width: 1,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
macos: Border(
|
macos: Border(
|
||||||
top: BorderSide(
|
top: BorderSide(
|
||||||
color: MacosTheme.of(context).dividerColor,
|
color: PlatformTheme.of(context).borderColor ?? Colors.transparent,
|
||||||
width: 1,
|
width: 1,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@ -130,7 +130,7 @@ class Player extends HookConsumerWidget {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
child: Slider.adaptive(
|
child: PlatformSlider(
|
||||||
min: 0,
|
min: 0,
|
||||||
max: 1,
|
max: 1,
|
||||||
value: volume.value,
|
value: volume.value,
|
||||||
|
@ -97,7 +97,7 @@ class PlayerControls extends HookConsumerWidget {
|
|||||||
children: [
|
children: [
|
||||||
Tooltip(
|
Tooltip(
|
||||||
message: "Slide to seek forward or backward",
|
message: "Slide to seek forward or backward",
|
||||||
child: Slider.adaptive(
|
child: PlatformSlider(
|
||||||
focusNode: FocusNode(),
|
focusNode: FocusNode(),
|
||||||
// cannot divide by zero
|
// cannot divide by zero
|
||||||
// there's an edge case for value being bigger
|
// there's an edge case for value being bigger
|
||||||
@ -174,7 +174,7 @@ class PlayerControls extends HookConsumerWidget {
|
|||||||
? const SizedBox(
|
? const SizedBox(
|
||||||
height: 20,
|
height: 20,
|
||||||
width: 20,
|
width: 20,
|
||||||
child: CircularProgressIndicator(),
|
child: PlatformCircularProgressIndicator(),
|
||||||
)
|
)
|
||||||
: Icon(
|
: Icon(
|
||||||
playback.isPlaying
|
playback.isPlaying
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||||
|
import 'package:platform_ui/platform_ui.dart';
|
||||||
import 'package:spotify/spotify.dart';
|
import 'package:spotify/spotify.dart';
|
||||||
import 'package:spotube/components/Playlist/PlaylistCard.dart';
|
import 'package:spotube/components/Playlist/PlaylistCard.dart';
|
||||||
import 'package:spotube/components/Shared/PageWindowTitleBar.dart';
|
import 'package:spotube/components/Shared/PageWindowTitleBar.dart';
|
||||||
@ -47,7 +48,7 @@ class PlaylistGenreView extends ConsumerWidget {
|
|||||||
return const Center(child: Text("Error occurred"));
|
return const Center(child: Text("Error occurred"));
|
||||||
}
|
}
|
||||||
if (!snapshot.hasData) {
|
if (!snapshot.hasData) {
|
||||||
return const CircularProgressIndicator.adaptive();
|
return const PlatformCircularProgressIndicator();
|
||||||
}
|
}
|
||||||
return Center(
|
return Center(
|
||||||
child: Wrap(
|
child: Wrap(
|
||||||
|
@ -143,7 +143,7 @@ class Search extends HookConsumerWidget {
|
|||||||
),
|
),
|
||||||
if (searchTrack.isLoading &&
|
if (searchTrack.isLoading &&
|
||||||
!searchTrack.isFetchingNextPage)
|
!searchTrack.isFetchingNextPage)
|
||||||
const CircularProgressIndicator()
|
const PlatformCircularProgressIndicator()
|
||||||
else if (searchTrack.hasError)
|
else if (searchTrack.hasError)
|
||||||
Text(
|
Text(
|
||||||
searchTrack.error?[searchTrack.pageParams.last])
|
searchTrack.error?[searchTrack.pageParams.last])
|
||||||
@ -190,7 +190,7 @@ class Search extends HookConsumerWidget {
|
|||||||
? null
|
? null
|
||||||
: () => searchTrack.fetchNextPage(),
|
: () => searchTrack.fetchNextPage(),
|
||||||
child: searchTrack.isFetchingNextPage
|
child: searchTrack.isFetchingNextPage
|
||||||
? const CircularProgressIndicator()
|
? const PlatformCircularProgressIndicator()
|
||||||
: const Text("Load more"),
|
: const Text("Load more"),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@ -202,7 +202,7 @@ class Search extends HookConsumerWidget {
|
|||||||
const SizedBox(height: 10),
|
const SizedBox(height: 10),
|
||||||
if (searchPlaylist.isLoading &&
|
if (searchPlaylist.isLoading &&
|
||||||
!searchPlaylist.isFetchingNextPage)
|
!searchPlaylist.isFetchingNextPage)
|
||||||
const CircularProgressIndicator()
|
const PlatformCircularProgressIndicator()
|
||||||
else if (searchPlaylist.hasError)
|
else if (searchPlaylist.hasError)
|
||||||
Text(searchPlaylist
|
Text(searchPlaylist
|
||||||
.error?[searchPlaylist.pageParams.last])
|
.error?[searchPlaylist.pageParams.last])
|
||||||
@ -256,7 +256,7 @@ class Search extends HookConsumerWidget {
|
|||||||
const SizedBox(height: 10),
|
const SizedBox(height: 10),
|
||||||
if (searchArtist.isLoading &&
|
if (searchArtist.isLoading &&
|
||||||
!searchArtist.isFetchingNextPage)
|
!searchArtist.isFetchingNextPage)
|
||||||
const CircularProgressIndicator()
|
const PlatformCircularProgressIndicator()
|
||||||
else if (searchArtist.hasError)
|
else if (searchArtist.hasError)
|
||||||
Text(searchArtist
|
Text(searchArtist
|
||||||
.error?[searchArtist.pageParams.last])
|
.error?[searchArtist.pageParams.last])
|
||||||
@ -310,7 +310,7 @@ class Search extends HookConsumerWidget {
|
|||||||
const SizedBox(height: 10),
|
const SizedBox(height: 10),
|
||||||
if (searchAlbum.isLoading &&
|
if (searchAlbum.isLoading &&
|
||||||
!searchAlbum.isFetchingNextPage)
|
!searchAlbum.isFetchingNextPage)
|
||||||
const CircularProgressIndicator()
|
const PlatformCircularProgressIndicator()
|
||||||
else if (searchAlbum.hasError)
|
else if (searchAlbum.hasError)
|
||||||
Text(
|
Text(
|
||||||
searchAlbum.error?[searchAlbum.pageParams.last])
|
searchAlbum.error?[searchAlbum.pageParams.last])
|
||||||
|
@ -122,7 +122,7 @@ class TrackHeartButton extends HookConsumerWidget {
|
|||||||
);
|
);
|
||||||
final toggler = useTrackToggleLike(track, ref);
|
final toggler = useTrackToggleLike(track, ref);
|
||||||
if (toggler.item3.isLoading || !toggler.item3.hasData) {
|
if (toggler.item3.isLoading || !toggler.item3.hasData) {
|
||||||
return const CircularProgressIndicator();
|
return const PlatformCircularProgressIndicator();
|
||||||
}
|
}
|
||||||
|
|
||||||
return HeartButton(
|
return HeartButton(
|
||||||
@ -182,7 +182,8 @@ class PlaylistHeartButton extends HookConsumerWidget {
|
|||||||
titleImage,
|
titleImage,
|
||||||
).dominantColor;
|
).dominantColor;
|
||||||
|
|
||||||
if (me.isLoading || !me.hasData) return const CircularProgressIndicator();
|
if (me.isLoading || !me.hasData)
|
||||||
|
return const PlatformCircularProgressIndicator();
|
||||||
|
|
||||||
return HeartButton(
|
return HeartButton(
|
||||||
isLiked: isLikedQuery.data ?? false,
|
isLiked: isLikedQuery.data ?? false,
|
||||||
@ -236,7 +237,8 @@ class AlbumHeartButton extends HookConsumerWidget {
|
|||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
if (me.isLoading || !me.hasData) return const CircularProgressIndicator();
|
if (me.isLoading || !me.hasData)
|
||||||
|
return const PlatformCircularProgressIndicator();
|
||||||
|
|
||||||
return HeartButton(
|
return HeartButton(
|
||||||
isLiked: isLiked,
|
isLiked: isLiked,
|
||||||
|
@ -32,17 +32,7 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final backgroundColor = usePlatformProperty<Color?>(
|
final backgroundColor = PlatformTheme.of(context).secondaryBackgroundColor;
|
||||||
(context) => PlatformProperty(
|
|
||||||
android: Theme.of(context).backgroundColor,
|
|
||||||
ios: CupertinoTheme.of(context).scaffoldBackgroundColor,
|
|
||||||
macos: MacosTheme.of(context).brightness == Brightness.dark
|
|
||||||
? Colors.grey[800]
|
|
||||||
: Colors.blueGrey[50],
|
|
||||||
linux: Theme.of(context).backgroundColor,
|
|
||||||
windows: FluentUI.FluentTheme.maybeOf(context)?.scaffoldBackgroundColor,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
|
|
||||||
final boxShadow = usePlatformProperty<BoxShadow?>(
|
final boxShadow = usePlatformProperty<BoxShadow?>(
|
||||||
(context) => PlatformProperty(
|
(context) => PlatformProperty(
|
||||||
@ -64,28 +54,9 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|
||||||
final titleStyle = usePlatformProperty<TextStyle?>(
|
final titleStyle = PlatformTextTheme.of(context).body;
|
||||||
(context) => PlatformProperty(
|
|
||||||
android: Theme.of(context).textTheme.bodyMedium,
|
|
||||||
ios: CupertinoTheme.of(context).textTheme.textStyle,
|
|
||||||
macos: MacosTheme.of(context).typography.body,
|
|
||||||
linux: Theme.of(context).textTheme.bodyMedium,
|
|
||||||
windows: FluentUI.FluentTheme.maybeOf(context)?.typography.body,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
|
|
||||||
final descriptionStyle = usePlatformProperty<TextStyle?>(
|
final descriptionStyle = PlatformTextTheme.of(context).caption;
|
||||||
(context) => PlatformProperty(
|
|
||||||
android: Theme.of(context).textTheme.caption,
|
|
||||||
ios: CupertinoTheme.of(context)
|
|
||||||
.textTheme
|
|
||||||
.textStyle
|
|
||||||
.copyWith(fontSize: 13),
|
|
||||||
macos: MacosTheme.of(context).typography.caption1,
|
|
||||||
linux: Theme.of(context).textTheme.caption,
|
|
||||||
windows: FluentUI.FluentTheme.maybeOf(context)?.typography.caption,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
|
|
||||||
final splash = usePlatformProperty<InteractiveInkFeatureFactory?>(
|
final splash = usePlatformProperty<InteractiveInkFeatureFactory?>(
|
||||||
(context) => PlatformProperty.multiPlatformGroup({
|
(context) => PlatformProperty.multiPlatformGroup({
|
||||||
@ -98,15 +69,7 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
|
|
||||||
final iconBgColor = usePlatformProperty<Color?>(
|
final iconBgColor = PlatformTheme.of(context).primaryColor;
|
||||||
(context) => PlatformProperty(
|
|
||||||
android: Theme.of(context).primaryColor,
|
|
||||||
ios: CupertinoTheme.of(context).primaryColor,
|
|
||||||
macos: MacosTheme.of(context).primaryColor,
|
|
||||||
linux: Theme.of(context).primaryColor,
|
|
||||||
windows: FluentUI.FluentTheme.maybeOf(context)?.accentColor,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
|
|
||||||
return Container(
|
return Container(
|
||||||
margin: margin,
|
margin: margin,
|
||||||
@ -174,7 +137,8 @@ class PlaybuttonCard extends HookWidget {
|
|||||||
? const SizedBox(
|
? const SizedBox(
|
||||||
height: 23,
|
height: 23,
|
||||||
width: 23,
|
width: 23,
|
||||||
child: CircularProgressIndicator(),
|
child:
|
||||||
|
PlatformCircularProgressIndicator(),
|
||||||
)
|
)
|
||||||
: Icon(
|
: Icon(
|
||||||
isPlaying
|
isPlaying
|
||||||
|
@ -132,7 +132,7 @@ class TrackTile extends HookConsumerWidget {
|
|||||||
width: 300,
|
width: 300,
|
||||||
child: !snapshot.hasData
|
child: !snapshot.hasData
|
||||||
? const Center(
|
? const Center(
|
||||||
child: CircularProgressIndicator.adaptive())
|
child: PlatformCircularProgressIndicator())
|
||||||
: ListView.builder(
|
: ListView.builder(
|
||||||
shrinkWrap: true,
|
shrinkWrap: true,
|
||||||
itemCount: snapshot.data!.length,
|
itemCount: snapshot.data!.length,
|
||||||
|
@ -201,7 +201,7 @@ class SpotubeState extends ConsumerState<Spotube> with WidgetsBindingObserver {
|
|||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
platform = TargetPlatform.macOS;
|
platform = TargetPlatform.windows;
|
||||||
|
|
||||||
return PlatformApp.router(
|
return PlatformApp.router(
|
||||||
routeInformationParser: router.routeInformationParser,
|
routeInformationParser: router.routeInformationParser,
|
||||||
|
@ -139,6 +139,9 @@ final macosTheme = MacosThemeData.light().copyWith(
|
|||||||
),
|
),
|
||||||
iconTheme: MacosIconThemeData(size: 16),
|
iconTheme: MacosIconThemeData(size: 16),
|
||||||
iconButtonTheme: MacosIconButtonThemeData(),
|
iconButtonTheme: MacosIconButtonThemeData(),
|
||||||
|
typography: MacosTypography(color: Colors.green),
|
||||||
|
);
|
||||||
|
final macosDarkTheme = MacosThemeData.dark().copyWith(
|
||||||
|
typography: MacosTypography(color: Colors.red),
|
||||||
);
|
);
|
||||||
final macosDarkTheme = MacosThemeData.dark();
|
|
||||||
final iosTheme = CupertinoThemeData();
|
final iosTheme = CupertinoThemeData();
|
||||||
|
Loading…
Reference in New Issue
Block a user