Goatworks/GroovyBox
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

💄 Better desktop view

Browse Source
This commit is contained in:
LittleSheep
2025-12-20 13:50:11 +08:00
parent 3c986afa7c
commit 6657ff6ebd
13 changed files with 429 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
lib/logic/window_helpers.dart Normal file
View File

@@ -0,0 +1,30 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:window_manager/window_manager.dart';
Future<void> initializeWindowManager() async {
await windowManager.ensureInitialized();
const windowOptions = WindowOptions(
size: Size(1200, 800),
minimumSize: Size(800, 600),
center: true,
backgroundColor: Colors.transparent,
skipTaskbar: false,
titleBarStyle: TitleBarStyle.hidden,
);
await windowManager.waitUntilReadyToShow(windowOptions, () async {
await windowManager.show();
await windowManager.focus();
});
}
bool isDesktopPlatform() {
return !Platform.isIOS && !Platform.isAndroid;
}
bool isWideScreen(BuildContext context) {
return MediaQuery.of(context).size.width > 900;
}

6
lib/main.dart
View File

@@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:groovybox/logic/audio_handler.dart';
import 'package:groovybox/logic/window_helpers.dart';
import 'package:groovybox/providers/audio_provider.dart';
import 'package:groovybox/providers/theme_provider.dart';
import 'package:groovybox/ui/shell.dart';
@@ -13,6 +14,11 @@ Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
MediaKit.ensureInitialized();
// Initialize window manager for desktop platforms
if (isDesktopPlatform()) {
await initializeWindowManager();
}
// Initialize AudioService
_audioHandler = await audio_service.AudioService.init(
builder: () => AudioHandler(),

27
lib/providers/settings_provider.dart
View File

@@ -1,3 +1,5 @@
import 'dart:ui';
import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'package:shared_preferences/shared_preferences.dart';
@@ -38,6 +40,7 @@ class SettingsState {
final LyricsMode lyricsMode;
final bool continuePlays;
final Set<String> supportedFormats;
final Size? windowSize;
const SettingsState({
this.importMode = ImportMode.mixed,
@@ -56,6 +59,7 @@ class SettingsState {
'.wma',
'.opus',
},
this.windowSize,
});
SettingsState copyWith({
@@ -66,6 +70,7 @@ class SettingsState {
LyricsMode? lyricsMode,
bool? continuePlays,
Set<String>? supportedFormats,
Size? windowSize,
}) {
return SettingsState(
importMode: importMode ?? this.importMode,
@@ -75,6 +80,7 @@ class SettingsState {
lyricsMode: lyricsMode ?? this.lyricsMode,
continuePlays: continuePlays ?? this.continuePlays,
supportedFormats: supportedFormats ?? this.supportedFormats,
windowSize: windowSize ?? this.windowSize,
);
}
}
@@ -87,6 +93,8 @@ class SettingsNotifier extends _$SettingsNotifier {
static const String _defaultPlayerScreenKey = 'default_player_screen';
static const String _lyricsModeKey = 'lyrics_mode';
static const String _continuePlaysKey = 'continue_plays';
static const String _windowWidthKey = 'window_width';
static const String _windowHeightKey = 'window_height';
@override
Future<SettingsState> build() async {
@@ -108,6 +116,14 @@ class SettingsNotifier extends _$SettingsNotifier {
final continuePlays = prefs.getBool(_continuePlaysKey) ?? false;
// Load window size
Size? windowSize;
final windowWidth = prefs.getDouble(_windowWidthKey);
final windowHeight = prefs.getDouble(_windowHeightKey);
if (windowWidth != null && windowHeight != null) {
windowSize = Size(windowWidth, windowHeight);
}
return SettingsState(
importMode: importMode,
autoScan: autoScan,
@@ -115,6 +131,7 @@ class SettingsNotifier extends _$SettingsNotifier {
defaultPlayerScreen: defaultPlayerScreen,
lyricsMode: lyricsMode,
continuePlays: continuePlays,
windowSize: windowSize,
);
}
@@ -173,6 +190,16 @@ class SettingsNotifier extends _$SettingsNotifier {
state = AsyncValue.data(state.value!.copyWith(continuePlays: enabled));
}
}
Future<void> setWindowSize(Size size) async {
final prefs = await SharedPreferences.getInstance();
await prefs.setDouble(_windowWidthKey, size.width);
await prefs.setDouble(_windowHeightKey, size.height);
if (state.hasValue) {
state = AsyncValue.data(state.value!.copyWith(windowSize: size));
}
}
}
// Convenience providers for specific settings

69
lib/ui/screens/library_screen.dart
View File

@@ -80,7 +80,7 @@ class LibraryScreen extends HookConsumerWidget {
onPressed: clearSelection,
),
title: Text('${selectedTrackIds.value.length} selected'),
backgroundColor: Theme.of(context).primaryColorDark,
backgroundColor: Theme.of(context).colorScheme.primary,
actions: [
IconButton(
icon: const Icon(Symbols.playlist_add),
@@ -110,6 +110,9 @@ class LibraryScreen extends HookConsumerWidget {
],
)
: AppBar(
backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
elevation: 0,
scrolledUnderElevation: 0,
title: isLargeScreen
? Row(
children: [
@@ -187,33 +190,37 @@ class LibraryScreen extends HookConsumerWidget {
const Gap(8),
],
),
body: Column(
children: [
const Divider(height: 1),
Expanded(
child: Row(
children: [
NavigationRail(
extended: isExtraLargeScreen,
selectedIndex: selectedTab!.value,
onDestinationSelected: (index) => selectedTab.value = index,
destinations: const [
NavigationRailDestination(
icon: Icon(Symbols.audiotrack),
label: Text('Tracks'),
),
NavigationRailDestination(
icon: Icon(Symbols.album),
label: Text('Albums'),
),
NavigationRailDestination(
icon: Icon(Symbols.queue_music),
label: Text('Playlists'),
),
],
body: Container(
color: Theme.of(context).colorScheme.surfaceContainer,
child: Row(
children: [
NavigationRail(
backgroundColor: Colors.transparent,
extended: isExtraLargeScreen,
selectedIndex: selectedTab!.value,
onDestinationSelected: (index) => selectedTab.value = index,
destinations: const [
NavigationRailDestination(
icon: Icon(Symbols.audiotrack),
label: Text('Tracks'),
),
const VerticalDivider(width: 1),
Expanded(
NavigationRailDestination(
icon: Icon(Symbols.album),
label: Text('Albums'),
),
NavigationRailDestination(
icon: Icon(Symbols.queue_music),
label: Text('Playlists'),
),
],
),
Expanded(
child: ClipRRect(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(16),
),
child: ColoredBox(
color: Theme.of(context).colorScheme.surface,
child: _buildTabContent(
selectedTab.value,
ref,
@@ -224,10 +231,10 @@ class LibraryScreen extends HookConsumerWidget {
isSelectionMode,
),
),
],
),
),
),
],
],
),
),
);
} else {
@@ -241,7 +248,7 @@ class LibraryScreen extends HookConsumerWidget {
onPressed: clearSelection,
),
title: Text('${selectedTrackIds.value.length} selected'),
backgroundColor: Theme.of(context).primaryColorDark,
backgroundColor: Theme.of(context).colorScheme.primary,
actions: [
IconButton(
icon: const Icon(Symbols.playlist_add),

260
lib/ui/shell.dart
View File

@@ -1,26 +1,256 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:gap/gap.dart';
import 'package:groovybox/logic/window_helpers.dart';
import 'package:groovybox/providers/settings_provider.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:material_symbols_icons/symbols.dart';
import 'package:styled_widget/styled_widget.dart';
import 'package:window_manager/window_manager.dart';
import 'dart:io';
import 'screens/library_screen.dart';
import 'widgets/mini_player.dart';
class Shell extends StatelessWidget {
// Navigation intents and actions
class PopIntent extends Intent {
const PopIntent();
}
class PopAction extends Action<PopIntent> {
final WidgetRef ref;
PopAction(this.ref);
@override
void invoke(PopIntent intent) {
// Handle pop navigation
// Since we don't have a router, we can handle back navigation here if needed
}
}
// Window management helpers
class _WindowSizeObserver extends WidgetsBindingObserver {
final VoidCallback callback;
_WindowSizeObserver(this.callback);
@override
void didChangeMetrics() {
callback();
}
}
class _WindowMaximizeListener extends WindowListener {
final ValueNotifier<bool> isMaximized;
_WindowMaximizeListener(this.isMaximized);
@override
void onWindowMaximize() {
isMaximized.value = true;
}
@override
void onWindowUnmaximize() {
isMaximized.value = false;
}
@override
void onWindowRestore() {
isMaximized.value = false;
}
}
class Shell extends HookConsumerWidget {
const Shell({super.key});
@override
Widget build(BuildContext context) {
return const Scaffold(
body: Stack(
children: [
// Main Content
Positioned.fill(
child: LibraryScreen(),
// Note: LibraryScreen might need padding at bottom to avoid occlusion by mini player
// We can wrap LibraryScreen content or handle it there.
// For now, let's just place it.
),
Widget build(BuildContext context, WidgetRef ref) {
final isMaximized = useState(false);
// Mini Player
Positioned(left: 0, right: 0, bottom: 0, child: MiniPlayer()),
],
// Add window resize listener for desktop platforms
useEffect(() {
if (isDesktopPlatform()) {
void saveWindowSize() {
windowManager.getBounds().then((bounds) {
final settingsNotifier = ref.read(settingsProvider.notifier);
settingsNotifier.setWindowSize(bounds.size);
});
}
// Save window size when app is about to close
WidgetsBinding.instance.addObserver(
_WindowSizeObserver(saveWindowSize),
);
final maximizeListener = _WindowMaximizeListener(isMaximized);
windowManager.addListener(maximizeListener);
windowManager.isMaximized().then((max) => isMaximized.value = max);
return () {
// Cleanup observer when widget is disposed
WidgetsBinding.instance.removeObserver(
_WindowSizeObserver(saveWindowSize),
);
windowManager.removeListener(maximizeListener);
};
}
return null;
}, []);
final pageActionsButton = [
IconButton(
icon: Icon(Symbols.home),
onPressed: () => Navigator.of(context).pushAndRemoveUntil(
MaterialPageRoute(builder: (context) => const LibraryScreen()),
(route) => false,
),
iconSize: 16,
padding: EdgeInsets.all(8),
constraints: BoxConstraints(),
color: Theme.of(context).iconTheme.color,
),
const Gap(8),
];
if (isDesktopPlatform()) {
return Shortcuts(
shortcuts: <LogicalKeySet, Intent>{
LogicalKeySet(LogicalKeyboardKey.escape): const PopIntent(),
},
child: Actions(
actions: <Type, Action<Intent>>{PopIntent: PopAction(ref)},
child: Material(
color: Theme.of(context).colorScheme.surfaceContainer,
child: Stack(
fit: StackFit.expand,
children: [
Column(
children: [
DragToMoveArea(
child: Platform.isMacOS
? Stack(
alignment: Alignment.center,
children: [
if (isWideScreen(context))
Row(
children: [
const Spacer(),
...pageActionsButton,
],
)
else
SizedBox(height: 32),
Text(
'GroovyBox',
textAlign: TextAlign.center,
style: TextStyle(
color: Theme.of(
context,
).colorScheme.onSurface,
),
),
],
)
: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
child: Row(
children: [
Image.asset(
Theme.of(context).brightness ==
Brightness.dark
? 'assets/images/icon-dark.png'
: 'assets/images/icon.jpg',
width: 20,
height: 20,
),
const SizedBox(width: 8),
Text(
'GroovyBox',
textAlign: TextAlign.start,
),
],
).padding(horizontal: 12, vertical: 5),
),
...pageActionsButton,
IconButton(
icon: Icon(Symbols.minimize),
onPressed: () => windowManager.minimize(),
iconSize: 16,
padding: EdgeInsets.all(8),
constraints: BoxConstraints(),
color: Theme.of(context).iconTheme.color,
),
IconButton(
icon: Icon(
isMaximized.value
? Symbols.fullscreen_exit
: Symbols.fullscreen,
),
onPressed: () async {
if (await windowManager.isMaximized()) {
windowManager.restore();
} else {
windowManager.maximize();
}
},
iconSize: 16,
padding: EdgeInsets.all(8),
constraints: BoxConstraints(),
color: Theme.of(context).iconTheme.color,
),
IconButton(
icon: Icon(Symbols.close),
onPressed: () => windowManager.hide(),
iconSize: 16,
padding: EdgeInsets.all(8),
constraints: BoxConstraints(),
color: Theme.of(context).iconTheme.color,
),
],
),
),
Expanded(
child: Stack(
children: [
// Main Content
Positioned.fill(child: LibraryScreen()),
// Mini Player
Positioned(
left: 0,
right: 0,
bottom: 0,
child: MiniPlayer(),
),
],
),
),
],
),
],
),
),
),
);
}
return Shortcuts(
shortcuts: <LogicalKeySet, Intent>{
LogicalKeySet(LogicalKeyboardKey.escape): const PopIntent(),
},
child: Actions(
actions: <Type, Action<Intent>>{PopIntent: PopAction(ref)},
child: Stack(
fit: StackFit.expand,
children: [
Positioned.fill(child: LibraryScreen()),
Positioned(left: 0, right: 0, bottom: 0, child: MiniPlayer()),
],
),
),
);
}