Styling changes
- add and use yaru and yaru_icons - remove the pink accent colors - add padding to the download options list
This commit is contained in:
parent
d38146736c
commit
b666c6bd4b
|
|
@ -1,5 +1,6 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:quickgui/src/pages/main_page.dart';
|
||||
import 'package:yaru/yaru.dart' as yaru;
|
||||
|
||||
class App extends StatelessWidget {
|
||||
const App({Key? key}) : super(key: key);
|
||||
|
|
@ -7,9 +8,9 @@ class App extends StatelessWidget {
|
|||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MaterialApp(
|
||||
theme: ThemeData(
|
||||
primarySwatch: Colors.pink,
|
||||
),
|
||||
home: const MainPage(title: 'Quickgui - A Flutter frontend for Quickget and Quickemu'));
|
||||
theme: yaru.lightTheme,
|
||||
darkTheme: yaru.darkTheme,
|
||||
home: const MainPage(
|
||||
title: 'Quickgui - A Flutter frontend for Quickget and Quickemu'));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:quickgui/src/widgets/home_page/downloader_menu.dart';
|
||||
import 'package:quickgui/src/widgets/home_page/logo.dart';
|
||||
import 'package:yaru_icons/widgets/yaru_icons.dart';
|
||||
|
||||
class DownloaderPage extends StatelessWidget {
|
||||
const DownloaderPage({Key? key}) : super(key: key);
|
||||
|
|
@ -9,6 +10,10 @@ class DownloaderPage extends StatelessWidget {
|
|||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
leading: IconButton(
|
||||
icon: const Icon(YaruIcons.window_close),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
),
|
||||
title: const Text('Downloader'),
|
||||
),
|
||||
body: Column(
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import 'dart:io';
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:quickgui/src/widgets/home_page/logo.dart';
|
||||
import 'package:quickgui/src/widgets/home_page/main_menu.dart';
|
||||
import 'package:yaru_icons/widgets/yaru_icons.dart';
|
||||
|
||||
class MainPage extends StatefulWidget {
|
||||
const MainPage({Key? key, required this.title}) : super(key: key);
|
||||
|
|
@ -23,7 +24,7 @@ class _MainPageState extends State<MainPage> {
|
|||
onPressed: () {
|
||||
exit(0);
|
||||
},
|
||||
icon: const Icon(Icons.exit_to_app),
|
||||
icon: const Icon(YaruIcons.pan_start),
|
||||
),
|
||||
),
|
||||
body: Column(
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import 'dart:io';
|
|||
import 'package:quickgui/src/globals.dart';
|
||||
import 'package:quickgui/src/model/vminfo.dart';
|
||||
import 'package:quickgui/src/mixins/preferences_mixin.dart';
|
||||
import 'package:yaru_icons/widgets/yaru_icons.dart';
|
||||
|
||||
/// VM manager page.
|
||||
/// Displays a list of available VMs, running state and connection info,
|
||||
|
|
@ -32,7 +33,8 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
setState(() {
|
||||
Directory.current = pref;
|
||||
});
|
||||
Future.delayed(Duration.zero, () => _getVms(context)); // Reload VM list when we enter the page.
|
||||
Future.delayed(Duration.zero,
|
||||
() => _getVms(context)); // Reload VM list when we enter the page.
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -79,7 +81,8 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
List<String> currentVms = [];
|
||||
Map<String, VmInfo> activeVms = {};
|
||||
|
||||
await for (var entity in Directory.current.list(recursive: false, followLinks: true)) {
|
||||
await for (var entity
|
||||
in Directory.current.list(recursive: false, followLinks: true)) {
|
||||
if ((entity.path.endsWith('.conf')) && (_isValidConf(entity.path))) {
|
||||
String name = path.basenameWithoutExtension(entity.path);
|
||||
currentVms.add(name);
|
||||
|
|
@ -152,7 +155,11 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
IconButton(
|
||||
icon: Icon(Icons.monitor, color: spicy ? Colors.red : null, semanticLabel: spicy ? 'Using SPICE display' : 'Click to use SPICE display'),
|
||||
icon: Icon(YaruIcons.desktop_display,
|
||||
color: spicy ? Colors.red : null,
|
||||
semanticLabel: spicy
|
||||
? 'Using SPICE display'
|
||||
: 'Click to use SPICE display'),
|
||||
tooltip: spicy ? 'Using SPICE display' : 'Use SPICE display',
|
||||
onPressed: () {
|
||||
if (spicy) {
|
||||
|
|
@ -167,7 +174,7 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
}),
|
||||
IconButton(
|
||||
icon: Icon(
|
||||
active ? Icons.play_arrow : Icons.play_arrow_outlined,
|
||||
YaruIcons.media_playback_start,
|
||||
color: active ? Colors.green : null,
|
||||
semanticLabel: active ? 'Running' : 'Run',
|
||||
),
|
||||
|
|
@ -188,7 +195,7 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
}),
|
||||
IconButton(
|
||||
icon: Icon(
|
||||
active ? Icons.stop : Icons.stop_outlined,
|
||||
YaruIcons.media_playback_stop,
|
||||
color: active ? Colors.red : null,
|
||||
semanticLabel: active ? 'Stop' : 'Not running',
|
||||
),
|
||||
|
|
@ -198,7 +205,8 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
context: context,
|
||||
builder: (BuildContext context) => AlertDialog(
|
||||
title: const Text('Stop The Virtual Machine?'),
|
||||
content: Text('You are about to terminate the virtual machine $currentVm'),
|
||||
content: Text(
|
||||
'You are about to terminate the virtual machine $currentVm'),
|
||||
actions: <Widget>[
|
||||
TextButton(
|
||||
onPressed: () => Navigator.pop(context, false),
|
||||
|
|
@ -236,6 +244,10 @@ class _ManagerState extends State<Manager> with PreferencesMixin {
|
|||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
leading: IconButton(
|
||||
icon: const Icon(YaruIcons.window_close),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
),
|
||||
title: const Text('Manager'),
|
||||
),
|
||||
body: _buildVmList(),
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:quickgui/src/model/operating_system.dart';
|
||||
import 'package:yaru_icons/widgets/yaru_icons.dart';
|
||||
|
||||
class OperatingSystemSelection extends StatefulWidget {
|
||||
const OperatingSystemSelection({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
State<OperatingSystemSelection> createState() => _OperatingSystemSelectionState();
|
||||
State<OperatingSystemSelection> createState() =>
|
||||
_OperatingSystemSelectionState();
|
||||
}
|
||||
|
||||
class _OperatingSystemSelectionState extends State<OperatingSystemSelection> {
|
||||
|
|
@ -20,9 +22,15 @@ class _OperatingSystemSelectionState extends State<OperatingSystemSelection> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var list = gOperatingSystems.where((os) => os.name.toLowerCase().contains(term.toLowerCase())).toList();
|
||||
var list = gOperatingSystems
|
||||
.where((os) => os.name.toLowerCase().contains(term.toLowerCase()))
|
||||
.toList();
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
leading: IconButton(
|
||||
icon: const Icon(YaruIcons.window_close),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
),
|
||||
title: const Text('Select operating system'),
|
||||
bottom: PreferredSize(
|
||||
preferredSize: const Size.fromHeight(kToolbarHeight),
|
||||
|
|
@ -30,6 +38,7 @@ class _OperatingSystemSelectionState extends State<OperatingSystemSelection> {
|
|||
padding: const EdgeInsets.all(8.0),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
color: Theme.of(context).canvasColor,
|
||||
),
|
||||
child: Padding(
|
||||
|
|
@ -38,11 +47,12 @@ class _OperatingSystemSelectionState extends State<OperatingSystemSelection> {
|
|||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
const Icon(Icons.search),
|
||||
const Icon(YaruIcons.search),
|
||||
Expanded(
|
||||
child: TextField(
|
||||
focusNode: focusNode,
|
||||
decoration: const InputDecoration.collapsed(hintText: 'Search operating system'),
|
||||
decoration: const InputDecoration.collapsed(
|
||||
hintText: 'Search operating system'),
|
||||
onChanged: (value) {
|
||||
setState(() {
|
||||
term = value;
|
||||
|
|
@ -67,12 +77,15 @@ class _OperatingSystemSelectionState extends State<OperatingSystemSelection> {
|
|||
itemCount: list.length,
|
||||
itemBuilder: (context, index) {
|
||||
var item = list[index];
|
||||
return Card(
|
||||
child: ListTile(
|
||||
title: Text(item.name),
|
||||
onTap: () {
|
||||
Navigator.of(context).pop(item);
|
||||
},
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(left: 4, right: 4),
|
||||
child: Card(
|
||||
child: ListTile(
|
||||
title: Text(item.name),
|
||||
onTap: () {
|
||||
Navigator.of(context).pop(item);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import 'package:flutter/material.dart';
|
||||
import 'package:quickgui/src/model/version.dart';
|
||||
import 'package:yaru_icons/widgets/yaru_icons.dart';
|
||||
|
||||
class OptionSelection extends StatefulWidget {
|
||||
const OptionSelection(this.version, {Key? key}) : super(key: key);
|
||||
|
|
@ -22,7 +23,9 @@ class _OptionSelectionState extends State<OptionSelection> {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var list = widget.version.options.where((e) => e.option.toLowerCase().contains(term.toLowerCase())).toList();
|
||||
var list = widget.version.options
|
||||
.where((e) => e.option.toLowerCase().contains(term.toLowerCase()))
|
||||
.toList();
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
|
|
@ -43,11 +46,12 @@ class _OptionSelectionState extends State<OptionSelection> {
|
|||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
const Icon(Icons.search),
|
||||
const Icon(YaruIcons.search),
|
||||
Expanded(
|
||||
child: TextField(
|
||||
focusNode: focusNode,
|
||||
decoration: const InputDecoration.collapsed(hintText: 'Search option'),
|
||||
decoration: const InputDecoration.collapsed(
|
||||
hintText: 'Search option'),
|
||||
onChanged: (value) {
|
||||
setState(() {
|
||||
term = value;
|
||||
|
|
|
|||
|
|
@ -24,12 +24,12 @@ class _DownloaderMenuState extends State<DownloaderMenu> with PreferencesMixin {
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Expanded(
|
||||
child: Container(
|
||||
color: Colors.pink,
|
||||
// color: Colors.pink,
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
|
|
@ -49,7 +49,8 @@ class _DownloaderMenuState extends State<DownloaderMenu> with PreferencesMixin {
|
|||
),
|
||||
InkWell(
|
||||
onTap: () async {
|
||||
var folder = await FilePicker.platform.getDirectoryPath(dialogTitle: "Pick a folder");
|
||||
var folder = await FilePicker.platform
|
||||
.getDirectoryPath(dialogTitle: "Pick a folder");
|
||||
if (folder != null) {
|
||||
setState(() {
|
||||
Directory.current = folder;
|
||||
|
|
@ -59,7 +60,10 @@ class _DownloaderMenuState extends State<DownloaderMenu> with PreferencesMixin {
|
|||
},
|
||||
child: Text(
|
||||
"Working directory : ${Directory.current.path}",
|
||||
style: Theme.of(context).textTheme.subtitle1!.copyWith(color: Colors.white),
|
||||
style: Theme.of(context)
|
||||
.textTheme
|
||||
.subtitle1!
|
||||
.copyWith(color: Colors.white),
|
||||
),
|
||||
),
|
||||
],
|
||||
|
|
|
|||
|
|
@ -26,15 +26,18 @@ class HomePageButton extends StatelessWidget {
|
|||
child: Center(
|
||||
child: Text(
|
||||
label?.toUpperCase() ?? '',
|
||||
style: Theme.of(context).textTheme.subtitle2?.copyWith(color: Colors.white),
|
||||
style: Theme.of(context)
|
||||
.textTheme
|
||||
.subtitle2
|
||||
?.copyWith(color: Colors.white),
|
||||
),
|
||||
),
|
||||
),
|
||||
ElevatedButton(
|
||||
style: ElevatedButton.styleFrom(
|
||||
primary: Colors.white,
|
||||
onPrimary: Colors.pink,
|
||||
),
|
||||
// style: ElevatedButton.styleFrom(
|
||||
// primary: Colors.white,
|
||||
// onPrimary: Colors.pink,
|
||||
// ),
|
||||
onPressed: onPressed,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(0, 16, 0, 16),
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ class MainMenu extends StatelessWidget {
|
|||
Widget build(BuildContext context) {
|
||||
return Expanded(
|
||||
child: Container(
|
||||
color: Colors.pink,
|
||||
// color: Colors.pink,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: Row(
|
||||
|
|
@ -21,7 +21,8 @@ class MainMenu extends StatelessWidget {
|
|||
Navigator.of(context).push(
|
||||
PageRouteBuilder(
|
||||
fullscreenDialog: true,
|
||||
pageBuilder: (context, animation1, animation2) => const Manager(),
|
||||
pageBuilder: (context, animation1, animation2) =>
|
||||
const Manager(),
|
||||
transitionDuration: Duration.zero,
|
||||
),
|
||||
);
|
||||
|
|
@ -34,7 +35,8 @@ class MainMenu extends StatelessWidget {
|
|||
Navigator.of(context).push(
|
||||
PageRouteBuilder(
|
||||
fullscreenDialog: true,
|
||||
pageBuilder: (context, animation1, animation2) => const DownloaderPage(),
|
||||
pageBuilder: (context, animation1, animation2) =>
|
||||
const DownloaderPage(),
|
||||
transitionDuration: Duration.zero,
|
||||
),
|
||||
);
|
||||
|
|
|
|||
|
|
@ -43,6 +43,8 @@ dependencies:
|
|||
tuple: ^2.0.0
|
||||
file_picker: ^4.1.6
|
||||
shared_preferences: ^2.0.8
|
||||
yaru: ^0.1.7
|
||||
yaru_icons: ^0.0.6
|
||||
|
||||
dev_dependencies:
|
||||
flutter_test:
|
||||
|
|
|
|||
Loading…
Reference in New Issue