Add side menu + children (devices, configurations & resources)
This commit is contained in:
parent
ea7f3876c1
commit
1a043ec675
@ -7,12 +7,13 @@ class ManagerAppContext with ChangeNotifier{
|
||||
String email;
|
||||
TokenDTO token;
|
||||
dynamic clientAPI;
|
||||
String currentRoute;
|
||||
|
||||
ManagerAppContext({this.email, this.token});
|
||||
ManagerAppContext({this.email, this.token, this.currentRoute});
|
||||
|
||||
// Implement toString to make it easier to see information about
|
||||
@override
|
||||
String toString() {
|
||||
return 'ManagerAppContext{email: $email, token: $token}';
|
||||
return 'ManagerAppContext{email: $email, token: $token, currentRoute: $currentRoute}';
|
||||
}
|
||||
}
|
||||
30
lib/Models/menu.dart
Normal file
30
lib/Models/menu.dart
Normal file
@ -0,0 +1,30 @@
|
||||
import 'dart:io';
|
||||
import 'dart:ui' as ui;
|
||||
|
||||
import 'package:manager_app/Models/menuSection.dart';
|
||||
|
||||
class Menu {
|
||||
String title;
|
||||
List<MenuSection> sections;
|
||||
|
||||
Menu({this.title, this.sections});
|
||||
|
||||
factory Menu.fromJson(Map<String, dynamic> json) {
|
||||
return new Menu(
|
||||
title: json['title'] as String,
|
||||
sections: json['sections'] as List<MenuSection>,
|
||||
);
|
||||
}
|
||||
|
||||
Map<String, dynamic> toMap() {
|
||||
return {
|
||||
'title': title,
|
||||
'sections': sections
|
||||
};
|
||||
}
|
||||
|
||||
@override
|
||||
String toString() {
|
||||
return '{title: $title, sections: $sections}';
|
||||
}
|
||||
}
|
||||
31
lib/Models/menuSection.dart
Normal file
31
lib/Models/menuSection.dart
Normal file
@ -0,0 +1,31 @@
|
||||
import 'dart:io';
|
||||
import 'dart:ui' as ui;
|
||||
|
||||
class MenuSection {
|
||||
String name;
|
||||
String type;
|
||||
int order;
|
||||
|
||||
MenuSection({this.name, this.type, this.order});
|
||||
|
||||
factory MenuSection.fromJson(Map<String, dynamic> json) {
|
||||
return new MenuSection(
|
||||
name: json['name'] as String,
|
||||
type: json['type'] as String,
|
||||
order: json['order'] as int,
|
||||
);
|
||||
}
|
||||
|
||||
Map<String, dynamic> toMap() {
|
||||
return {
|
||||
'name': name,
|
||||
'type': type,
|
||||
'order': order
|
||||
};
|
||||
}
|
||||
|
||||
@override
|
||||
String toString() {
|
||||
return '{name: $name, type: $type, order: $order}';
|
||||
}
|
||||
}
|
||||
21
lib/Screens/Configurations/configurations_screen.dart
Normal file
21
lib/Screens/Configurations/configurations_screen.dart
Normal file
@ -0,0 +1,21 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class ConfigurationsScreen extends StatefulWidget {
|
||||
ConfigurationsScreen({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_ConfigurationsScreenState createState() => _ConfigurationsScreenState();
|
||||
}
|
||||
|
||||
class _ConfigurationsScreenState extends State<ConfigurationsScreen> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
child: Center(
|
||||
child: Text(
|
||||
"Configurations"
|
||||
)
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
21
lib/Screens/Devices/devices_screen.dart
Normal file
21
lib/Screens/Devices/devices_screen.dart
Normal file
@ -0,0 +1,21 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class DevicesScreen extends StatefulWidget {
|
||||
DevicesScreen({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_DevicesScreenState createState() => _DevicesScreenState();
|
||||
}
|
||||
|
||||
class _DevicesScreenState extends State<DevicesScreen> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
child: Center(
|
||||
child: Text(
|
||||
"Devices"
|
||||
)
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
47
lib/Screens/Main/components/background.dart
Normal file
47
lib/Screens/Main/components/background.dart
Normal file
@ -0,0 +1,47 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:manager_app/constants.dart';
|
||||
|
||||
class Background extends StatelessWidget {
|
||||
final Widget child;
|
||||
const Background({
|
||||
Key key,
|
||||
@required this.child,
|
||||
}) : super(key: key);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
Size size = MediaQuery.of(context).size;
|
||||
final notchInset = MediaQuery.of(context).padding;
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
height: size.height,
|
||||
color: kTextLightColor,
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: <Widget>[
|
||||
/*Positioned(
|
||||
top: - 15,
|
||||
left: -1,
|
||||
child: SvgPicture.asset(
|
||||
'assets/images/hungry/top_bar2.svg',
|
||||
width: size.width * 1.01,
|
||||
)
|
||||
),*/
|
||||
/*Positioned.fill(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(top: (size.height - notchInset.top) * 0.14, left: size.width * 0.025),
|
||||
child: Align(
|
||||
alignment: Alignment.topLeft,
|
||||
child: Text(
|
||||
"Étape 1",
|
||||
style: kSubTitleTextStyle,
|
||||
),
|
||||
),
|
||||
),
|
||||
),*/
|
||||
child,
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
167
lib/Screens/Main/components/body.dart
Normal file
167
lib/Screens/Main/components/body.dart
Normal file
@ -0,0 +1,167 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/gestures.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:fluttertoast/fluttertoast.dart';
|
||||
import 'package:manager_app/Models/menu.dart';
|
||||
import 'package:manager_app/Models/menuSection.dart';
|
||||
import 'package:manager_app/Screens/Configurations/configurations_screen.dart';
|
||||
import 'package:manager_app/Screens/Devices/devices_screen.dart';
|
||||
import 'package:manager_app/Screens/Main/components/background.dart';
|
||||
import 'package:manager_app/Screens/Resources/resources_screen.dart';
|
||||
import 'package:manager_app/app_context.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../../../constants.dart';
|
||||
|
||||
|
||||
class Body extends StatefulWidget {
|
||||
Body({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_BodyState createState() => _BodyState();
|
||||
}
|
||||
|
||||
class _BodyState extends State<Body> {
|
||||
bool isChecked = false;
|
||||
int currentPosition = 0;
|
||||
var selectedElement;
|
||||
|
||||
MenuSection devices = new MenuSection(name: "Devices", type: "devices", order: 0);
|
||||
MenuSection configurations = new MenuSection(name: "Configurations", type: "configurations", order: 1);
|
||||
MenuSection resources = new MenuSection(name: "Resources", type: "resources", order: 2);
|
||||
|
||||
Menu menu = new Menu(title: "Manager");
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final appContext = Provider.of<AppContext>(context);
|
||||
Size size = MediaQuery.of(context).size;
|
||||
|
||||
menu.sections = new List<MenuSection>(); // TODO CLEAN
|
||||
menu.sections.add(devices);
|
||||
menu.sections.add(configurations);
|
||||
menu.sections.add(resources);
|
||||
|
||||
selectedElement = InitElementToShow(currentPosition, menu);
|
||||
|
||||
return Background(
|
||||
child: Row(
|
||||
children: [
|
||||
// MENU
|
||||
Container(
|
||||
width: size.width * 0.15,
|
||||
decoration: BoxDecoration(
|
||||
color: kSecond,
|
||||
borderRadius: BorderRadius.only(topRight: Radius.circular(20), bottomRight: Radius.circular(20)),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: kSecond.withOpacity(0.3),
|
||||
spreadRadius: 0.5,
|
||||
blurRadius: 0.5,
|
||||
offset: Offset(0, 1.5), // changes position of shadow
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: <Widget>[
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: Container(
|
||||
alignment: AlignmentDirectional.bottomStart,
|
||||
child: Text(
|
||||
menu.title,
|
||||
style: new TextStyle(color: kBlack, fontSize: 30, fontWeight: FontWeight.w400, fontFamily: "Helvetica"),
|
||||
),
|
||||
),
|
||||
),
|
||||
Container(
|
||||
height: size.height * 0.2,
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
for (var section in menu.sections)
|
||||
InkWell(
|
||||
onTap: () => {
|
||||
setState(() {
|
||||
currentPosition = section.order;
|
||||
selectedElement = InitElementToShow(currentPosition, menu);
|
||||
})
|
||||
},
|
||||
child: Container(
|
||||
alignment: AlignmentDirectional.bottomStart,
|
||||
decoration: BoxDecoration(
|
||||
border: currentPosition == section.order ? Border(
|
||||
right: BorderSide(
|
||||
color: kPrimaryColor,
|
||||
width: 4,
|
||||
),
|
||||
): null,
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(left: 10),
|
||||
child: Text(
|
||||
section.name,
|
||||
style: new TextStyle(color: kBodyTextColor, fontSize: 25, fontWeight: FontWeight.w300, fontFamily: "Helvetica"),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
]
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: size.height * 0.35,
|
||||
),
|
||||
Container(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: Text(
|
||||
appContext.getContext().email
|
||||
),
|
||||
)
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
// Main Container
|
||||
Container(
|
||||
width: size.width * 0.85,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(0.0),
|
||||
child: selectedElement),
|
||||
),
|
||||
]
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
InitElementToShow(int currentPosition, Menu menu) {
|
||||
MenuSection elementToShow = menu.sections.where((s) => s.order == currentPosition).first;
|
||||
|
||||
switch (elementToShow.type) {
|
||||
case 'devices' :
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: DevicesScreen()
|
||||
);
|
||||
break;
|
||||
case 'configurations' :
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: ConfigurationsScreen()
|
||||
);
|
||||
break;
|
||||
case 'resources' :
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: ResourcesScreen()
|
||||
);
|
||||
break;
|
||||
default:
|
||||
return Text('Hellow default');
|
||||
break;
|
||||
}
|
||||
}
|
||||
@ -1,46 +1,18 @@
|
||||
import 'package:manager_app/app_context.dart';
|
||||
import 'package:managerapi/api.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:manager_app/Screens/Main/components/body.dart';
|
||||
|
||||
class MainScreen extends StatefulWidget {
|
||||
MainScreen({Key key, this.title}) : super(key: key);
|
||||
|
||||
final String title;
|
||||
MainScreen({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_MainScreenState createState() => _MainScreenState();
|
||||
}
|
||||
|
||||
class _MainScreenState extends State<MainScreen> {
|
||||
int _counter = 0;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final appContext = Provider.of<AppContext>(context);
|
||||
|
||||
print(appContext.getContext().email);
|
||||
|
||||
return Scaffold(
|
||||
body: Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
'You have pushed the button this many times:',
|
||||
),
|
||||
Text(
|
||||
'$_counter',
|
||||
style: Theme.of(context).textTheme.headline4,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
floatingActionButton: FloatingActionButton(
|
||||
onPressed: () => print("YOULOU"),
|
||||
tooltip: 'Increment',
|
||||
child: Icon(Icons.add),
|
||||
), // This trailing comma makes auto-formatting nicer for build methods.
|
||||
body: Body(),
|
||||
);
|
||||
}
|
||||
}
|
||||
21
lib/Screens/Resources/resources_screen.dart
Normal file
21
lib/Screens/Resources/resources_screen.dart
Normal file
@ -0,0 +1,21 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class ResourcesScreen extends StatefulWidget {
|
||||
ResourcesScreen({Key key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_ResourcesScreenState createState() => _ResourcesScreenState();
|
||||
}
|
||||
|
||||
class _ResourcesScreenState extends State<ResourcesScreen> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
child: Center(
|
||||
child: Text(
|
||||
"Resources"
|
||||
)
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -8,8 +8,8 @@ const kBodyTextColor = Color(0xFF4B4B4B); // TODO
|
||||
|
||||
const kBackgroundColor = Color(0xFFf5f5f7);
|
||||
const kPrimaryColor = Color(0xFFCA413F);
|
||||
const kTextLightColor = Color(0xFFE3DfDE);
|
||||
const kSecond = Color(0xFFC4B1AE);
|
||||
const kTextLightColor = Color(0xFFFCFDFD);
|
||||
const kSecond = Color(0xFFC2C9D6);
|
||||
const kWhite = Color(0xFFFFFFFF);
|
||||
const kBlack = Color(0xFF000000);
|
||||
|
||||
|
||||
@ -53,7 +53,7 @@ class _MyAppState extends State<MyApp> {
|
||||
),
|
||||
routes: {
|
||||
'/welcome': (context) => LoginScreen(),
|
||||
'/main': (context) => MainScreen(title: 'Manager App Demo Home Page')
|
||||
'/main': (context) => MainScreen()
|
||||
}
|
||||
),
|
||||
);
|
||||
|
||||
21
pubspec.lock
21
pubspec.lock
@ -67,6 +67,18 @@ packages:
|
||||
description: flutter
|
||||
source: sdk
|
||||
version: "0.0.0"
|
||||
flutter_web_plugins:
|
||||
dependency: transitive
|
||||
description: flutter
|
||||
source: sdk
|
||||
version: "0.0.0"
|
||||
fluttertoast:
|
||||
dependency: "direct main"
|
||||
description:
|
||||
name: fluttertoast
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "8.0.5"
|
||||
http:
|
||||
dependency: transitive
|
||||
description:
|
||||
@ -88,6 +100,13 @@ packages:
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "0.16.1"
|
||||
js:
|
||||
dependency: transitive
|
||||
description:
|
||||
name: js
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "0.6.3"
|
||||
managerapi:
|
||||
dependency: "direct main"
|
||||
description:
|
||||
@ -206,5 +225,5 @@ packages:
|
||||
source: hosted
|
||||
version: "2.1.0"
|
||||
sdks:
|
||||
dart: ">=2.12.0-0.0 <3.0.0"
|
||||
dart: ">=2.12.0 <3.0.0"
|
||||
flutter: ">=1.16.0"
|
||||
|
||||
@ -26,6 +26,7 @@ dependencies:
|
||||
|
||||
rxdart: 0.22.0
|
||||
provider: ^5.0.0
|
||||
fluttertoast:
|
||||
managerapi:
|
||||
path: manager_api
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user