Raid_Manager/app/lib/app.dart
2022-12-09 12:50:58 +01:00

202 lines
5.7 KiB
Dart

import 'package:flutter/material.dart';
import 'package:raid_manager/raid_page.dart';
import 'package:sidebarx/sidebarx.dart';
import 'disk_page.dart';
class App extends StatelessWidget {
App({Key? key}) : super(key: key);
final _controller = SidebarXController(selectedIndex: 0, extended: true);
final _key = GlobalKey<ScaffoldState>();
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Raid Manager',
theme: ThemeData(
primaryColor: primaryColor,
canvasColor: canvasColor,
scaffoldBackgroundColor: scaffoldBackgroundColor,
textTheme: const TextTheme(
headlineSmall: TextStyle(
color: Colors.white,
fontSize: 12,
fontWeight: FontWeight.w800,
),
headlineMedium: TextStyle(
color: Colors.white,
fontSize: 17,
fontWeight: FontWeight.w500,
),
labelMedium: TextStyle(
color: Colors.white,
fontSize: 14,
fontWeight: FontWeight.w200)),
),
home: Builder(
builder: (context) {
final isSmallScreen = MediaQuery.of(context).size.width < 600;
return Scaffold(
key: _key,
appBar: isSmallScreen
? AppBar(
backgroundColor: canvasColor,
title: Text(_getTitleByIndex(_controller.selectedIndex)),
leading: IconButton(
onPressed: () {
// if (!Platform.isAndroid && !Platform.isIOS) {
// _controller.setExtended(true);
// }
_key.currentState?.openDrawer();
},
icon: const Icon(Icons.menu),
),
)
: null,
drawer: ExampleSidebarX(controller: _controller),
body: Row(
children: [
if (!isSmallScreen) ExampleSidebarX(controller: _controller),
Expanded(
child: Center(
child: _ScreensExample(
controller: _controller,
),
),
),
],
),
);
},
),
);
}
}
class ExampleSidebarX extends StatelessWidget {
const ExampleSidebarX({
Key? key,
required SidebarXController controller,
}) : _controller = controller,
super(key: key);
final SidebarXController _controller;
@override
Widget build(BuildContext context) {
return SidebarX(
controller: _controller,
theme: SidebarXTheme(
margin: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: canvasColor,
borderRadius: BorderRadius.circular(20),
),
hoverColor: scaffoldBackgroundColor,
textStyle: TextStyle(color: Colors.white.withOpacity(0.7)),
selectedTextStyle: const TextStyle(color: Colors.white),
itemTextPadding: const EdgeInsets.only(left: 30),
selectedItemTextPadding: const EdgeInsets.only(left: 30),
itemDecoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(color: canvasColor),
),
selectedItemDecoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: actionColor.withOpacity(0.37),
),
gradient: const LinearGradient(
colors: [accentCanvasColor, canvasColor],
),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.28),
blurRadius: 30,
)
],
),
iconTheme: IconThemeData(
color: Colors.white.withOpacity(0.7),
size: 20,
),
selectedIconTheme: const IconThemeData(
color: Colors.white,
size: 20,
),
),
extendedTheme: const SidebarXTheme(
width: 200,
decoration: BoxDecoration(
color: canvasColor,
),
),
footerDivider: divider,
headerBuilder: (context, extended) {
return const SizedBox(height: 20);
},
items: const [
SidebarXItem(
icon: Icons.home,
label: 'Raids',
),
SidebarXItem(
icon: Icons.search,
label: 'Disks',
),
],
);
}
}
class _ScreensExample extends StatelessWidget {
const _ScreensExample({
Key? key,
required this.controller,
}) : super(key: key);
final SidebarXController controller;
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
return AnimatedBuilder(
animation: controller,
builder: (context, child) {
final pageTitle = _getTitleByIndex(controller.selectedIndex);
switch (controller.selectedIndex) {
case 0:
return const RaidPage();
case 1:
return const DiskPage();
default:
return Text(
pageTitle,
style: theme.textTheme.headlineSmall,
);
}
},
);
}
}
String _getTitleByIndex(int index) {
switch (index) {
case 0:
return 'Raids';
case 1:
return 'Disks';
default:
return 'Not found page';
}
}
const primaryColor = Color(0xFF685BFF);
const canvasColor = Color(0xFF232323);
const scaffoldBackgroundColor = Color(0xFF343434);
const accentCanvasColor = Color(0xFF464646);
const white = Colors.white;
final actionColor = const Color(0xFF343434).withOpacity(0.6);
final divider = Divider(color: white.withOpacity(0.3), height: 1);