Add flags + change language + if first use, ask for a configuration

This commit is contained in:
Thomas Fransolet 2021-07-08 18:20:53 +02:00
parent fb202d252c
commit 234fc83cbd
9 changed files with 337 additions and 84 deletions

BIN
assets/images/DE.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 225 B

BIN
assets/images/EN.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
assets/images/FR.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 233 B

BIN
assets/images/NL.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 219 B

View File

@ -0,0 +1,52 @@
import 'package:flutter/material.dart';
import 'package:managerapi/api.dart';
import 'package:provider/provider.dart';
import 'package:tablet_app/app_context.dart';
import 'package:tablet_app/constants.dart';
class DropDownConfig extends StatefulWidget {
final List<ConfigurationDTO> configurations;
final ValueChanged<ConfigurationDTO> onChange;
const DropDownConfig({
Key key,
this.configurations,
this.onChange,
}) : super(key: key);
@override
_DropDownConfigState createState() => _DropDownConfigState();
}
class _DropDownConfigState extends State<DropDownConfig> {
ConfigurationDTO configurationDTO;
@override
Widget build(BuildContext context) {
final appContext = Provider.of<AppContext>(context);
Size size = MediaQuery.of(context).size;
return DropdownButton<ConfigurationDTO>(
value: configurationDTO,
icon: const Icon(Icons.arrow_downward),
iconSize: 24,
elevation: 16,
style: const TextStyle(color: kMainGrey),
underline: Container(
height: 2,
color: kMainRed, // TODO CHANGEEEEE
),
onChanged: (ConfigurationDTO newValue) {
setState(() {
configurationDTO = newValue;
widget.onChange(configurationDTO);
});
},
items: widget.configurations.map<DropdownMenuItem<ConfigurationDTO>>((ConfigurationDTO value) {
return DropdownMenuItem<ConfigurationDTO>(
value: value,
child: Text(value.label, style: TextStyle(fontSize: 20, fontWeight: FontWeight.w400)),
);
}).toList(),
);
}
}

View File

@ -0,0 +1,153 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:tablet_app/Models/tabletContext.dart';
import 'package:tablet_app/app_context.dart';
import 'package:tablet_app/constants.dart';
import 'package:webview_flutter/webview_flutter.dart';
class LanguageSelection extends StatefulWidget {
LanguageSelection();
@override
_LanguageSelection createState() => _LanguageSelection();
}
class _LanguageSelection extends State<LanguageSelection> with TickerProviderStateMixin {
Size sizeScreen = new Size(1080.0, 1920.0); // Tablet resolution
double flagSize = 60;
String selectedLanguage;
double elementMinimizedSize;
bool minimized = false;
double _leftLanguage;
double _topLanguage;
double _rightLanguage;
double _bottomLanguage;
AnimationController _controller;
@override
void initState() {
setState(() {
_leftLanguage = sizeScreen.width - (sizeScreen.width *0.07); //size.width - size.width *0.07;
_topLanguage = sizeScreen.height * 0.075;
_rightLanguage = 0;
_bottomLanguage = minimized ? sizeScreen.height*0.6 : sizeScreen.height - (sizeScreen.height *0.07);
});
_controller = AnimationController(
value: 12, vsync: this, duration: Duration(seconds: 1));
_controller.animateBack(0);
super.initState();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final appContext = Provider.of<AppContext>(context);
Size size = MediaQuery.of(context).size;
selectedLanguage = (appContext.getContext() as TabletAppContext).language;
return Stack(
children: [
Positioned(
top: 0,
right: 0,
child: Padding(
padding: const EdgeInsets.only(right: 0.0, top: 25.0),
child: InkWell(
onTap: () {
minimizedAnimation(size);
},
child: Container(
height: size.height *0.07,//size.height *0.07,
width: size.width *0.07,//size.width *0.07,
decoration: flagDecoration(selectedLanguage),
),
),
)
),
AnimatedPositioned(
duration: const Duration(milliseconds: 1500),
curve: Curves.fastLinearToSlowEaseIn,
top: _topLanguage,
left: _leftLanguage,
right: _rightLanguage,
bottom: _bottomLanguage,
child: Container(
child:
ListView(
children: [
if(minimized) ... [
for(var language in languages.where((element) => element.toUpperCase() != selectedLanguage ))
InkWell(
onTap: () {
setState(() {
// TODO STORE IT LOCALLY !!
TabletAppContext tabletAppContext = appContext.getContext();
tabletAppContext.language = language;
appContext.setContext(tabletAppContext);
minimizedAnimation(size);
});
},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
width: sizeScreen.height *0.07,
height: sizeScreen.width *0.07,
decoration: flagDecoration(language),
),
),
)
]
],
)
,
),
),
],
);
}
minimizedAnimation(Size size) {
minimized = !minimized;
if (minimized) {
_controller.animateBack(15.0);
} else {
_controller.animateBack(0.0);
}
setState(() {
_leftLanguage = size.width - (size.width *0.07); //size.width - size.width *0.07;
_topLanguage = sizeScreen.height * 0.07;
_rightLanguage = 0;
_bottomLanguage = minimized ? size.height*0.6 : size.height - (size.height *0.07);
});
}
flagDecoration(String language) {
return BoxDecoration(
color: kBackgroundColor,
shape: BoxShape.circle,
border: Border.all(width: 1.5, color: kSecondGrey),
image: new DecorationImage(
fit: BoxFit.contain,
image: new AssetImage("assets/images/"+language+".png"),
),
boxShadow: [
BoxShadow(
color: kSecondGrey,
spreadRadius: 0.5,
blurRadius: 5,
offset: Offset(0, 1.5), // changes position of shadow
),
],
);
}
}

View File

@ -3,6 +3,7 @@ import 'package:flutter/rendering.dart';
import 'package:flutter/services.dart';
import 'package:managerapi/api.dart';
import 'package:provider/provider.dart';
import 'package:tablet_app/Components/MainView/dropDown_configuration.dart';
import 'package:tablet_app/Components/Map/map_context.dart';
import 'package:tablet_app/Components/Map/map_view.dart';
import 'package:tablet_app/Components/loading.dart';
@ -15,6 +16,8 @@ import 'package:tablet_app/constants.dart';
import 'package:http/http.dart' as http;
import 'package:auto_size_text/auto_size_text.dart';
import 'language_selection.dart';
class MainViewWidget extends StatefulWidget {
MainViewWidget();
@ -166,88 +169,132 @@ class _MainViewWidget extends State<MainViewWidget> {
height: size.height,
width: size.width,
color: kBackgroundGrey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
child: Stack(
children: [
Align(
alignment: Alignment.centerRight,
LanguageSelection(),
Center(
child: Container(
height: size.height * 0.1,
color: Colors.blue,
child: Text("Langues")
),
),
Container(
height: size.height * 0.9,
width: size.width * 0.9,
child: FutureBuilder(
future: getSections(appContext),
builder: (context, AsyncSnapshot<dynamic> snapshot) {
print('helloo test');
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.data == null) {
return Text("NO CONFIGURATION");
}
else {
return GridView.builder(
shrinkWrap: true,
gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
itemCount: snapshot.data?.length,
itemBuilder: (BuildContext context, int index) {
return // User Picture
InkWell(
onTap: () {
setState(() {
sectionSelected = snapshot.data[index];
});
},
child: Container(
decoration: boxDecoration(snapshot.data[index]),
padding: const EdgeInsets.all(25),
margin: EdgeInsets.symmetric(vertical: 25, horizontal: 25),
child: Align(
alignment: Alignment.bottomRight,
child: FractionallySizedBox(
heightFactor: 0.4,
child: Column(
children: [
Align(
alignment: Alignment.centerRight,
child: AutoSizeText(
snapshot.data[index].title.firstWhere((translation) => translation.language == appContext.getContext().language).value,
style: new TextStyle(fontSize: 25),
maxLines: 1,
),
height: size.height * 0.85,
width: size.width * 0.9,
child: FutureBuilder(
future: getSections(appContext),
builder: (context, AsyncSnapshot<dynamic> snapshot) {
print('helloo test');
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.data == null) {
//return Text("NO CONFIGURATION");
return FutureBuilder(
future: getConfigurations(appContext),
builder: (context, AsyncSnapshot<dynamic> snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Center(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29),
color: kBackgroundLight,
),
height: size.height*0.3,
width: size.width*0.3,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.all(15.0),
child: Text(
"Choisir une configuration",
style: new TextStyle(
fontSize: 25
),
Align(
alignment: Alignment.centerRight,
child: AutoSizeText(
snapshot.data[index].description.firstWhere((translation) => translation.language == appContext.getContext().language).value,
style: new TextStyle(fontSize: 18, fontFamily: ""),
maxLines: 1,
),
),
],
)
),
),
DropDownConfig(
configurations: snapshot.data,
onChange: (ConfigurationDTO configurationOut) {
setState(() {
// TODO STORE IT LOCALLY !!
TabletAppContext tabletAppContext = appContext.getContext();
tabletAppContext.configuration = configurationOut;
appContext.setContext(tabletAppContext);
});
},
),
],
),
),
),
);
}
);
} else if (snapshot.connectionState == ConnectionState.none) {
return Text("No data");
} else {
return Center(
child: Container(
height: size.height * 0.2,
child: Loading()
)
);
}
}
);
}
else {
return GridView.builder(
shrinkWrap: true,
gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
itemCount: snapshot.data?.length,
itemBuilder: (BuildContext context, int index) {
return InkWell(
onTap: () {
setState(() {
sectionSelected = snapshot.data[index];
});
},
child: Container(
decoration: boxDecoration(snapshot.data[index]),
padding: const EdgeInsets.all(25),
margin: EdgeInsets.symmetric(vertical: 25, horizontal: 25),
child: Align(
alignment: Alignment.bottomRight,
child: FractionallySizedBox(
heightFactor: 0.4,
child: Column(
children: [
Align(
alignment: Alignment.centerRight,
child: AutoSizeText(
snapshot.data[index].title.firstWhere((translation) => translation.language == appContext.getContext().language).value,
style: new TextStyle(fontSize: 25),
maxLines: 1,
),
),
Align(
alignment: Alignment.centerRight,
child: AutoSizeText(
snapshot.data[index].description.firstWhere((translation) => translation.language == appContext.getContext().language).value,
style: new TextStyle(fontSize: 18, fontFamily: ""),
maxLines: 1,
),
),
],
)
),
),
),
);
}
);
}
} else if (snapshot.connectionState == ConnectionState.none) {
return Text("No data");
} else {
return Center(
child: Container(
child: Loading()
)
);
}
} else if (snapshot.connectionState == ConnectionState.none) {
return Text("No data");
} else {
return Center(
child: Container(
height: size.height * 0.2,
child: Loading()
)
);
}
}
),
),
),
]),
@ -258,15 +305,6 @@ class _MainViewWidget extends State<MainViewWidget> {
Future<List<SectionDTO>> getSections(dynamic appContext) async {
TabletAppContext tabletAppContext = await appContext.getContext();
// TODO if null ask user to select a config (first use)
if (tabletAppContext.configuration == null) {
print("config is null");
tabletAppContext.configuration = await tabletAppContext.clientAPI.configurationApi.configurationGetDetail("60b1257a2939c9163c3f0921");
print("Set context.. if no config");
appContext.setContext(tabletAppContext);
}
print(tabletAppContext.toString());
List<SectionDTO> sections = await tabletAppContext.clientAPI.sectionApi.sectionGetFromConfiguration(tabletAppContext.configuration.id);
print(sections);
@ -315,3 +353,12 @@ boxDecoration(SectionDTO section) {
],
);
}
Future<List<ConfigurationDTO>> getConfigurations(dynamic appContext) async {
List<ConfigurationDTO> configurations = await appContext.getContext().clientAPI.configurationApi.configurationGet();
print("number of configurations " + configurations.length.toString());
configurations.forEach((element) {
print(element);
});
return configurations;
}

View File

@ -14,6 +14,8 @@ const kBackgroundSecondGrey = Color(0xFF5b5b63);
const kBackgroundLight = Color(0xfff3f3f3);
const List<String> languages = ["FR", "NL", "EN", "DE"];
/*
const kTextStyle = TextStyle(
fontSize: 23,

View File

@ -46,7 +46,6 @@ class _MyAppState extends State<MyApp> {
tabletAppContext = new TabletAppContext();
// store user info locally
tabletAppContext.clientAPI = clientAPI;
tabletAppContext.configuration = new ConfigurationDTO(id: "60b1257a2939c9163c3f0921");
tabletAppContext.language = "FR";
//appContext.setContext(tabletAppContext);