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

refactor: use CustomScrollView in player queue

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2024-03-28 22:49:40 +06:00
parent ee97aedcfc
commit 044d3b4820
1 changed files with 158 additions and 157 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
lib/components/player/player_queue.dart
View File

@ -3,11 +3,15 @@ import 'dart:ui';
import 'package:collection/collection.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:fuzzywuzzy/fuzzywuzzy.dart';
import 'package:gap/gap.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:scroll_to_index/scroll_to_index.dart';
import 'package:sliver_tools/sliver_tools.dart';
import 'package:spotube/collections/fake.dart';
import 'package:spotube/collections/spotube_icons.dart';
import 'package:spotube/components/shared/fallbacks/not_found.dart';
import 'package:spotube/components/shared/inter_scrollbar/inter_scrollbar.dart';
@ -109,10 +113,15 @@ class PlayerQueue extends HookConsumerWidget {
searchText.value = '';
}
},
child: Column(
children: [
child: InterScrollbar(
controller: controller,
child: CustomScrollView(
controller: controller,
slivers: [
if (!floating)
Container(
SliverToBoxAdapter(
child: Center(
child: Container(
height: 5,
width: 100,
margin: const EdgeInsets.only(bottom: 5, top: 2),
@ -121,13 +130,26 @@ class PlayerQueue extends HookConsumerWidget {
borderRadius: BorderRadius.circular(20),
),
),
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (mediaQuery.mdAndUp || !isSearching.value) ...[
const SizedBox(width: 10),
Text(
),
),
SliverAppBar(
floating: true,
pinned: false,
snap: false,
backgroundColor: Colors.transparent,
elevation: 0,
automaticallyImplyLeading: !isSearching.value,
title: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: 10,
sigmaY: 10,
),
child: SizedBox(
height: kToolbarHeight,
child: mediaQuery.mdAndUp || !isSearching.value
? Align(
alignment: Alignment.centerLeft,
child: Text(
context.l10n.tracks_in_queue(tracks.length),
style: TextStyle(
color: headlineColor,
@ -135,8 +157,11 @@ class PlayerQueue extends HookConsumerWidget {
fontSize: 18,
),
),
const Spacer(),
],
)
: null,
),
),
actions: [
if (mediaQuery.mdAndUp || isSearching.value)
TextField(
onChanged: (value) {
@ -181,7 +206,8 @@ class PlayerQueue extends HookConsumerWidget {
style: FilledButton.styleFrom(
backgroundColor:
theme.scaffoldBackgroundColor.withOpacity(0.5),
foregroundColor: theme.textTheme.headlineSmall?.color,
foregroundColor:
theme.textTheme.headlineSmall?.color,
),
child: Row(
children: [
@ -199,17 +225,12 @@ class PlayerQueue extends HookConsumerWidget {
],
],
),
const SizedBox(height: 10),
if (!isSearching.value && searchText.value.isEmpty)
Flexible(
child: ReorderableListView.builder(
const SliverGap(10),
SliverReorderableList(
onReorder: (oldIndex, newIndex) {
playlistNotifier.moveTrack(oldIndex, newIndex);
},
scrollController: controller,
itemCount: tracks.length,
shrinkWrap: true,
buildDefaultDragHandles: false,
itemCount: filteredTracks.length,
onReorderStart: (index) {
HapticFeedback.selectionClick();
},
@ -217,14 +238,13 @@ class PlayerQueue extends HookConsumerWidget {
HapticFeedback.selectionClick();
},
itemBuilder: (context, i) {
final track = tracks.elementAt(i);
final track = filteredTracks.elementAt(i);
return AutoScrollTag(
key: ValueKey(i),
key: ValueKey<int>(i),
controller: controller,
index: i,
child: Padding(
padding:
const EdgeInsets.symmetric(horizontal: 8.0),
child: Material(
color: Colors.transparent,
child: TrackTile(
index: i,
track: track,
@ -235,9 +255,16 @@ class PlayerQueue extends HookConsumerWidget {
await playlistNotifier.jumpToTrack(track);
},
leadingActions: [
ReorderableDragStartListener(
if (!isSearching.value &&
searchText.value.isEmpty)
Padding(
padding: const EdgeInsets.only(left: 8.0),
child: ReorderableDragStartListener(
index: i,
child: const Icon(SpotubeIcons.dragHandle),
child: const Icon(
SpotubeIcons.dragHandle,
),
),
),
],
),
@ -245,39 +272,13 @@ class PlayerQueue extends HookConsumerWidget {
);
},
),
)
else
Flexible(
child: InterScrollbar(
controller: controller,
child: ListView.builder(
controller: controller,
itemCount: filteredTracks.length,
itemBuilder: (context, i) {
final track = filteredTracks.elementAt(i);
return Padding(
padding:
const EdgeInsets.symmetric(horizontal: 8.0),
child: TrackTile(
index: i,
track: track,
onTap: () async {
if (playlist.activeTrack?.id == track.id) {
return;
}
await playlistNotifier.jumpToTrack(track);
},
),
);
},
),
),
),
const SliverGap(100),
],
),
),
),
),
),
);
}
}