mirror of
https://bitbucket.org/FransoletThomas/tablet-app.git
synced 2025-12-06 00:21:19 +00:00
Add main view component + selected frame
This commit is contained in:
Thomas Fransolet
parent
db1a95d1b2
commit
9e457b5d02
242
lib/Components/MainView/main_view.dart
Normal file
242
lib/Components/MainView/main_view.dart
Normal file
@ -0,0 +1,242 @@
|
|||||||
|
import 'dart:convert';
|
||||||
|
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter/services.dart';
|
||||||
|
import 'package:provider/provider.dart';
|
||||||
|
import 'package:tablet_app/Components/Map/map_context.dart';
|
||||||
|
import 'package:tablet_app/Components/Map/map_view.dart';
|
||||||
|
import 'package:tablet_app/Models/map-marker.dart';
|
||||||
|
import 'package:tablet_app/Models/section.dart';
|
||||||
|
import 'package:tablet_app/constants.dart';
|
||||||
|
import 'package:http/http.dart' as http;
|
||||||
|
|
||||||
|
class MainViewWidget extends StatefulWidget {
|
||||||
|
MainViewWidget();
|
||||||
|
|
||||||
|
@override
|
||||||
|
_MainViewWidget createState() => _MainViewWidget();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _MainViewWidget extends State<MainViewWidget> {
|
||||||
|
Size sizeScreen = new Size(1080.0, 1920.0); // Tablet resolution
|
||||||
|
Section sectionSelected;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
SystemChrome.setEnabledSystemUIOverlays([]);
|
||||||
|
Size size = MediaQuery.of(context).size;
|
||||||
|
|
||||||
|
if(sectionSelected != null) {
|
||||||
|
var elementToShow;
|
||||||
|
switch (sectionSelected.category) {
|
||||||
|
case 0 : // MAP
|
||||||
|
elementToShow = ChangeNotifierProvider<MapContext>(
|
||||||
|
create: (_) =>
|
||||||
|
MapContext(new MapMarker(
|
||||||
|
latitude: null,
|
||||||
|
longitude: null,
|
||||||
|
title: '',
|
||||||
|
description: '',
|
||||||
|
text: '')),
|
||||||
|
child: MapViewWidget() /*FutureBuilder(
|
||||||
|
future: _url,
|
||||||
|
builder: (BuildContext context, AsyncSnapshot snapshot) => snapshot.hasData
|
||||||
|
? WebViewWidget(url: snapshot.data,)
|
||||||
|
: CircularProgressIndicator()),*/
|
||||||
|
);
|
||||||
|
break;
|
||||||
|
case 1 : // WEB
|
||||||
|
break;
|
||||||
|
case 0 :
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return Scaffold(
|
||||||
|
body: Column(
|
||||||
|
children: [
|
||||||
|
Container(
|
||||||
|
width: size.width,
|
||||||
|
height: size.height * 0.15,
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 15.0, top: 10.0),
|
||||||
|
child: Container(
|
||||||
|
width: 150,
|
||||||
|
height: 150,
|
||||||
|
decoration: boxDecoration(sectionSelected),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
width: 25,
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.all(8.0),
|
||||||
|
child: Column(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Align(
|
||||||
|
alignment: Alignment.centerLeft,
|
||||||
|
child: Text(sectionSelected.title, style: new TextStyle(fontSize: 35))
|
||||||
|
),
|
||||||
|
Align(
|
||||||
|
alignment: Alignment.centerLeft,
|
||||||
|
child: Text(sectionSelected.description, style: new TextStyle(fontSize: 25)))
|
||||||
|
],
|
||||||
|
),
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 15.0, right: 15.0, top: 10.0),
|
||||||
|
child: Container(
|
||||||
|
width: size.width,
|
||||||
|
height: size.height * 0.822,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: kBackgroundLight,
|
||||||
|
shape: BoxShape.rectangle,
|
||||||
|
borderRadius: BorderRadius.circular(30.0),
|
||||||
|
boxShadow: [
|
||||||
|
BoxShadow(
|
||||||
|
color: kBackgroundSecondGrey,
|
||||||
|
spreadRadius: 0.5,
|
||||||
|
blurRadius: 5,
|
||||||
|
offset: Offset(0, 1.5), // changes position of shadow
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
floatingActionButtonLocation: FloatingActionButtonLocation.startFloat,
|
||||||
|
floatingActionButton: Container(
|
||||||
|
height: 125.0,
|
||||||
|
width: 125.0,
|
||||||
|
child: FittedBox(
|
||||||
|
child: FloatingActionButton.extended(
|
||||||
|
onPressed: () {
|
||||||
|
setState(() {
|
||||||
|
sectionSelected = null;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
icon: Icon(Icons.arrow_back),
|
||||||
|
label: Text("Menu"),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return Scaffold(
|
||||||
|
body: Container(
|
||||||
|
height: size.height,
|
||||||
|
width: size.width,
|
||||||
|
color: kBackgroundGrey,
|
||||||
|
child: Center(
|
||||||
|
child: Container(
|
||||||
|
height: size.height * 0.85,
|
||||||
|
width: size.width * 0.9,
|
||||||
|
child: FutureBuilder(
|
||||||
|
future: getSections(),
|
||||||
|
builder: (context, AsyncSnapshot<dynamic> snapshot) {
|
||||||
|
print('helloo test');
|
||||||
|
if (snapshot.connectionState == ConnectionState.done) {
|
||||||
|
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(20),
|
||||||
|
margin: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
|
||||||
|
child: Align(
|
||||||
|
alignment: Alignment.bottomRight,
|
||||||
|
child: FractionallySizedBox(
|
||||||
|
heightFactor: 0.35,
|
||||||
|
child: Column(
|
||||||
|
children: [
|
||||||
|
Align(
|
||||||
|
alignment: Alignment.centerRight,
|
||||||
|
child: Text(snapshot.data[index].title, style: new TextStyle(fontSize: 35))),
|
||||||
|
Align(
|
||||||
|
alignment: Alignment.centerRight,
|
||||||
|
child: Text(snapshot.data[index].description, style: new TextStyle(fontSize: 25, fontFamily: ""))
|
||||||
|
),
|
||||||
|
],
|
||||||
|
)
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
);
|
||||||
|
} else if (snapshot.connectionState == ConnectionState.none) {
|
||||||
|
return Text("No data");
|
||||||
|
} else {
|
||||||
|
return Center(child: Container(height: size.height * 0.2, child: Text('LOADING TODO FRAISE')));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Future<List<Section>> getSections() async {
|
||||||
|
|
||||||
|
print('in future');
|
||||||
|
final response = await http.get('https://jsonplaceholder.typicode.com/posts/1');
|
||||||
|
|
||||||
|
if (response.statusCode == 200) {
|
||||||
|
// If the call to the server was successful, parse the JSON.
|
||||||
|
return [
|
||||||
|
new Section(id: 0, title: "TEST Map", description: "Ceci est l'essai d'une carte", image: "https://www.novo-monde.com/app/uploads/2017/11/novo-map-banner-3.jpg", category: 0),
|
||||||
|
new Section(id: 0, title: "TEST Site web", description: "Ceci est l'essai d'un site web", image: "https://static.wixstatic.com/media/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.jpg/v1/fill/w_892,h_564,al_c,q_85,usm_0.66_1.00_0.01/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.webp", category: 1),
|
||||||
|
new Section(id: 0, title: "TEST 2", description: "fsfsdf", image: "https://static.wixstatic.com/media/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.jpg/v1/fill/w_892,h_564,al_c,q_85,usm_0.66_1.00_0.01/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.webp", category: 0),
|
||||||
|
new Section(id: 0, title: "TEST 3", description: "fsfsdf", image: "https://static.wixstatic.com/media/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.jpg/v1/fill/w_892,h_564,al_c,q_85,usm_0.66_1.00_0.01/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.webp", category: 0),
|
||||||
|
new Section(id: 0, title: "TEST 4", description: "fsfsdf", image: "https://static.wixstatic.com/media/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.jpg/v1/fill/w_892,h_564,al_c,q_85,usm_0.66_1.00_0.01/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.webp", category: 0),
|
||||||
|
new Section(id: 0, title: "TEST 5", description: "fsfsdf", image: "https://static.wixstatic.com/media/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.jpg/v1/fill/w_892,h_564,al_c,q_85,usm_0.66_1.00_0.01/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.webp", category: 0),
|
||||||
|
new Section(id: 0, title: "TEST 6", description: "fsfsdf", image: "https://static.wixstatic.com/media/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.jpg/v1/fill/w_892,h_564,al_c,q_85,usm_0.66_1.00_0.01/38e2f4_4c1714f38942446e99c1e736726e4465~mv2.webp", category: 0),
|
||||||
|
];
|
||||||
|
} else {
|
||||||
|
// If that call was not successful, throw an error.
|
||||||
|
throw Exception('Failed to load post');
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
boxDecoration(Section section) {
|
||||||
|
return BoxDecoration(
|
||||||
|
color: kBackgroundLight,
|
||||||
|
shape: BoxShape.rectangle,
|
||||||
|
borderRadius: BorderRadius.circular(30.0),
|
||||||
|
image: new DecorationImage(
|
||||||
|
fit: BoxFit.cover,
|
||||||
|
colorFilter: new ColorFilter.mode(Colors.black.withOpacity(0.6), BlendMode.dstATop),
|
||||||
|
image: new NetworkImage(
|
||||||
|
section.image,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
boxShadow: [
|
||||||
|
BoxShadow(
|
||||||
|
color: kBackgroundSecondGrey,
|
||||||
|
spreadRadius: 0.5,
|
||||||
|
blurRadius: 5,
|
||||||
|
offset: Offset(0, 1.5), // changes position of shadow
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -84,15 +84,15 @@ class _MarkerInfoWidget extends State<MarkerViewWidget> {
|
|||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||||
children: [
|
children: [
|
||||||
Text(mapContext.getSelectedMarker().title),
|
Text(mapContext.getSelectedMarker().title, style: TextStyle(fontSize: 15)),
|
||||||
Text(mapContext.getSelectedMarker().description),
|
Text(mapContext.getSelectedMarker().description, style: TextStyle(fontSize: 15)),
|
||||||
Text(mapContext.getSelectedMarker().text),
|
Text(mapContext.getSelectedMarker().text, style: TextStyle(fontSize: 15)),
|
||||||
Column(
|
Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||||
children: [
|
children: [
|
||||||
Text('Sub menu 1'),
|
Text('Sub menu 1', style: TextStyle(fontSize: 15)),
|
||||||
Text('Sub menu 2'),
|
Text('Sub menu 2', style: TextStyle(fontSize: 15)),
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
]
|
]
|
||||||
|
|||||||
341
lib/Components/Previous/previous_view.dart
Normal file
341
lib/Components/Previous/previous_view.dart
Normal file
@ -0,0 +1,341 @@
|
|||||||
|
import 'dart:async';
|
||||||
|
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter/services.dart';
|
||||||
|
import 'package:provider/provider.dart';
|
||||||
|
import 'package:tablet_app/Components/Map/map_context.dart';
|
||||||
|
import 'package:tablet_app/Components/Map/map_view.dart';
|
||||||
|
import 'package:tablet_app/Models/map-marker.dart';
|
||||||
|
import 'package:webview_flutter/webview_flutter.dart';
|
||||||
|
|
||||||
|
import '../../constants.dart';
|
||||||
|
import '../custom_clipper.dart';
|
||||||
|
|
||||||
|
class PreviousViewWidget extends StatefulWidget {
|
||||||
|
PreviousViewWidget({Key key, this.title}) : super(key: key);
|
||||||
|
|
||||||
|
final String title;
|
||||||
|
|
||||||
|
@override
|
||||||
|
_PreviousViewWidget createState() => _PreviousViewWidget();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _PreviousViewWidget extends State<PreviousViewWidget> with TickerProviderStateMixin {
|
||||||
|
static String url = "https://my.matterport.com/show/?m=k8bvdezfHbT";
|
||||||
|
Size sizeScreen = new Size(1080.0, 1920.0); // Tablet resolution
|
||||||
|
double elementMinimizedSize = 200.0;
|
||||||
|
double elementMaximizedSize = 400.0;
|
||||||
|
bool minimized = false;
|
||||||
|
|
||||||
|
double _leftMain;
|
||||||
|
double _topMain;
|
||||||
|
double _rightMain;
|
||||||
|
double _bottomMain;
|
||||||
|
|
||||||
|
double _leftTitle;
|
||||||
|
double _topTitle;
|
||||||
|
double _rightTitle;
|
||||||
|
double _bottomTitle;
|
||||||
|
|
||||||
|
double _leftElement;
|
||||||
|
double _topElement;
|
||||||
|
double _rightElement;
|
||||||
|
double _bottomElement;
|
||||||
|
|
||||||
|
double _leftMenu;
|
||||||
|
double _topMenu;
|
||||||
|
double _rightMenu;
|
||||||
|
double _bottomMenu;
|
||||||
|
|
||||||
|
AnimationController _controller;
|
||||||
|
Completer<WebViewController> _webViewController = Completer<
|
||||||
|
WebViewController>();
|
||||||
|
|
||||||
|
@override
|
||||||
|
void initState() {
|
||||||
|
setState(() {
|
||||||
|
_leftMain = (sizeScreen.height / 2) - elementMaximizedSize;
|
||||||
|
_topMain = (sizeScreen.width / 2) - elementMaximizedSize;
|
||||||
|
_rightMain = (sizeScreen.height / 2) - elementMaximizedSize;
|
||||||
|
_bottomMain = (sizeScreen.width / 2) - elementMaximizedSize;
|
||||||
|
|
||||||
|
_leftElement = (sizeScreen.height / 2) - elementMaximizedSize;
|
||||||
|
_topElement = (sizeScreen.width / 2) - elementMaximizedSize;
|
||||||
|
_rightElement = (sizeScreen.height / 2);
|
||||||
|
_bottomElement = (sizeScreen.width / 2);
|
||||||
|
|
||||||
|
_leftMenu = 0;
|
||||||
|
_topMenu = sizeScreen.width * 0.15;
|
||||||
|
_rightMenu = sizeScreen.height;
|
||||||
|
_bottomMenu = sizeScreen.width * 0.2;
|
||||||
|
|
||||||
|
_leftTitle = 0;
|
||||||
|
_topTitle = 0;
|
||||||
|
_rightTitle = sizeScreen.height;
|
||||||
|
_bottomTitle = sizeScreen.width;
|
||||||
|
});
|
||||||
|
|
||||||
|
_controller = AnimationController(
|
||||||
|
value: 12, vsync: this, duration: Duration(seconds: 1));
|
||||||
|
_controller.animateBack(0);
|
||||||
|
|
||||||
|
super.initState();
|
||||||
|
}
|
||||||
|
|
||||||
|
void _incrementCounter() {
|
||||||
|
setState(() {
|
||||||
|
minimized = !minimized;
|
||||||
|
|
||||||
|
if (minimized) {
|
||||||
|
_controller.animateBack(5.0);
|
||||||
|
} else {
|
||||||
|
_controller.animateBack(0.0);
|
||||||
|
}
|
||||||
|
|
||||||
|
_leftMenu = 0;
|
||||||
|
_topMenu = sizeScreen.width * 0.18;
|
||||||
|
_rightMenu =
|
||||||
|
minimized ? sizeScreen.height - elementMinimizedSize : sizeScreen.height;
|
||||||
|
_bottomMenu = minimized ? sizeScreen.width * 0.2 : sizeScreen.width * 0.2;
|
||||||
|
|
||||||
|
_leftMain =
|
||||||
|
minimized ? 0 : (sizeScreen.height / 2) - elementMaximizedSize;
|
||||||
|
_topMain =
|
||||||
|
minimized ? sizeScreen.width - elementMinimizedSize : (sizeScreen.width /
|
||||||
|
2) - elementMaximizedSize;
|
||||||
|
_rightMain =
|
||||||
|
minimized ? sizeScreen.height - elementMinimizedSize : (sizeScreen
|
||||||
|
.height / 2) - elementMaximizedSize;
|
||||||
|
_bottomMain =
|
||||||
|
minimized ? 0 : (sizeScreen.width / 2) - elementMaximizedSize;
|
||||||
|
|
||||||
|
_leftElement =
|
||||||
|
minimized ? sizeScreen.height * 0.11 : (sizeScreen.height / 2) -
|
||||||
|
elementMaximizedSize;
|
||||||
|
_topElement =
|
||||||
|
minimized ? 0 : (sizeScreen.width / 2) - elementMaximizedSize;
|
||||||
|
_rightElement = minimized ? 0 : (sizeScreen.height / 2);
|
||||||
|
_bottomElement = minimized ? 0 : (sizeScreen.width / 2);
|
||||||
|
|
||||||
|
_leftTitle = 0;
|
||||||
|
_topTitle = 0;
|
||||||
|
_rightTitle =
|
||||||
|
minimized ? sizeScreen.height - elementMinimizedSize : sizeScreen.height;
|
||||||
|
_bottomTitle = minimized ? sizeScreen.width * 0.83 : sizeScreen.width;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
Future<bool> _onWillPop() async {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
void dispose() {
|
||||||
|
_controller.dispose();
|
||||||
|
super.dispose();
|
||||||
|
}
|
||||||
|
|
||||||
|
static Future<String> get _url async {
|
||||||
|
await Future.delayed(Duration(seconds: 1));
|
||||||
|
return url;
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
SystemChrome.setEnabledSystemUIOverlays([]);
|
||||||
|
Size size = MediaQuery
|
||||||
|
.of(context)
|
||||||
|
.size;
|
||||||
|
return new WillPopScope(
|
||||||
|
onWillPop: _onWillPop,
|
||||||
|
child: Scaffold(
|
||||||
|
// Tablet size
|
||||||
|
body: Container(
|
||||||
|
height: size.height,
|
||||||
|
width: size.width,
|
||||||
|
child: Stack(
|
||||||
|
children: <Widget>[
|
||||||
|
// Main
|
||||||
|
AnimatedPositioned(
|
||||||
|
duration: const Duration(milliseconds: 1500),
|
||||||
|
curve: Curves.easeInOutSine,
|
||||||
|
left: _leftMain,
|
||||||
|
top: _topMain,
|
||||||
|
right: _rightMain,
|
||||||
|
bottom: _bottomMain,
|
||||||
|
child: InkWell(
|
||||||
|
onTap: () {
|
||||||
|
if (minimized) _incrementCounter();
|
||||||
|
},
|
||||||
|
child: Container(
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
borderRadius: new BorderRadius.only(
|
||||||
|
topRight: const Radius.circular(20.0),
|
||||||
|
),
|
||||||
|
color: kSecondRed
|
||||||
|
),
|
||||||
|
child: Center(
|
||||||
|
child: Text(
|
||||||
|
'MAIN MENU',
|
||||||
|
style: TextStyle(color: kTextRed, fontSize: 25),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
// Title opened
|
||||||
|
AnimatedPositioned(
|
||||||
|
duration: const Duration(milliseconds: 1500),
|
||||||
|
curve: Curves.easeInOutSine,
|
||||||
|
left: _leftTitle,
|
||||||
|
top: _topTitle,
|
||||||
|
right: _rightTitle,
|
||||||
|
bottom: _bottomTitle,
|
||||||
|
child: InkWell(
|
||||||
|
onTap: () {
|
||||||
|
if (minimized) _incrementCounter();
|
||||||
|
},
|
||||||
|
child: Container(
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
borderRadius: new BorderRadius.only(
|
||||||
|
bottomRight: const Radius.circular(20.0),
|
||||||
|
),
|
||||||
|
color: kSecondRed
|
||||||
|
),
|
||||||
|
child: Center(
|
||||||
|
child: Text(
|
||||||
|
'Title opened element',
|
||||||
|
style: TextStyle(color: kTextRed, fontSize: 25),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
// Element
|
||||||
|
AnimatedPositioned(
|
||||||
|
duration: const Duration(milliseconds: 1000),
|
||||||
|
curve: Curves.easeInOutSine,
|
||||||
|
top: _topElement,
|
||||||
|
left: _leftElement,
|
||||||
|
right: _rightElement,
|
||||||
|
bottom: _bottomElement,
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.all(5.0),
|
||||||
|
child: AnimatedBuilder(
|
||||||
|
animation: _controller,
|
||||||
|
builder: (BuildContext context, Widget child) {
|
||||||
|
return ClipPath(
|
||||||
|
clipper: WaveClipper(move: _controller.value,
|
||||||
|
minimized: minimized,
|
||||||
|
height: _leftMain,
|
||||||
|
width: _topMain),
|
||||||
|
clipBehavior: Clip.hardEdge,
|
||||||
|
child: InkWell(
|
||||||
|
onTap: () =>
|
||||||
|
{
|
||||||
|
if (!minimized) _incrementCounter()
|
||||||
|
},
|
||||||
|
child: AnimatedContainer(
|
||||||
|
// Define how long the animation should take.
|
||||||
|
duration: Duration(seconds: 2),
|
||||||
|
// Provide an optional curve to make the animation feel smoother.
|
||||||
|
curve: Curves.easeInOutCubic,
|
||||||
|
height: elementMaximizedSize,
|
||||||
|
width: elementMaximizedSize,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
borderRadius: BorderRadius.circular(20.0),
|
||||||
|
gradient: LinearGradient(
|
||||||
|
begin: Alignment.centerRight,
|
||||||
|
end: Alignment.centerLeft,
|
||||||
|
colors: [
|
||||||
|
minimized
|
||||||
|
? kBackgroundSecondGrey
|
||||||
|
: kSecondGrey,
|
||||||
|
minimized ? kBackgroundSecondGrey : Colors
|
||||||
|
.transparent
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
child: Center(
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.all(20.0),
|
||||||
|
child: Container(
|
||||||
|
width: size.width,
|
||||||
|
height: size.height,
|
||||||
|
child: ChangeNotifierProvider<MapContext>(
|
||||||
|
create: (_) =>
|
||||||
|
MapContext(new MapMarker(
|
||||||
|
latitude: null,
|
||||||
|
longitude: null,
|
||||||
|
title: '',
|
||||||
|
description: '',
|
||||||
|
text: '')),
|
||||||
|
child: MapViewWidget() /*FutureBuilder(
|
||||||
|
future: _url,
|
||||||
|
builder: (BuildContext context, AsyncSnapshot snapshot) => snapshot.hasData
|
||||||
|
? WebViewWidget(url: snapshot.data,)
|
||||||
|
: CircularProgressIndicator()),*/
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
// MENU
|
||||||
|
AnimatedPositioned(
|
||||||
|
duration: const Duration(milliseconds: 2000),
|
||||||
|
curve: Curves.easeInOutSine,
|
||||||
|
top: _topMenu,
|
||||||
|
left: _leftMenu,
|
||||||
|
right: _rightMenu,
|
||||||
|
bottom: _bottomMenu,
|
||||||
|
child: Container(
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
borderRadius: new BorderRadius.only(
|
||||||
|
topRight: const Radius.circular(20.0),
|
||||||
|
bottomRight: const Radius.circular(20.0),
|
||||||
|
),
|
||||||
|
color: Colors.lightBlue
|
||||||
|
),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||||
|
children: [
|
||||||
|
if(minimized) ... [
|
||||||
|
Text('MENU'),
|
||||||
|
Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||||
|
children: [
|
||||||
|
Text('Sub menu 1'),
|
||||||
|
Text('Sub menu 2'),
|
||||||
|
]
|
||||||
|
)
|
||||||
|
]
|
||||||
|
|
||||||
|
]
|
||||||
|
),
|
||||||
|
/*Icon(
|
||||||
|
Icons.autorenew,
|
||||||
|
color: Colors.pink,
|
||||||
|
size: 24.0,
|
||||||
|
semanticLabel: 'Text to announce in accessibility modes',
|
||||||
|
),*/
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
/*floatingActionButton: FloatingActionButton(
|
||||||
|
onPressed: _incrementCounter,
|
||||||
|
tooltip: 'Increment',
|
||||||
|
child: Icon(Icons.add),
|
||||||
|
),*/
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
19
lib/Models/section.dart
Normal file
19
lib/Models/section.dart
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
class Section {
|
||||||
|
int id;
|
||||||
|
String title;
|
||||||
|
String description;
|
||||||
|
String image;
|
||||||
|
int category;
|
||||||
|
|
||||||
|
Section({this.id, this.title, this.description, this.image, this.category});
|
||||||
|
|
||||||
|
factory Section.fromJson(Map<String, dynamic> json) {
|
||||||
|
return new Section(
|
||||||
|
id: json['id'] as int,
|
||||||
|
title: json['title'] as String,
|
||||||
|
description: json['description'] as String,
|
||||||
|
image: json['image'] as String,
|
||||||
|
category: json['text'] as int
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
302
lib/main.dart
302
lib/main.dart
@ -4,9 +4,11 @@ import 'dart:collection';
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter/services.dart';
|
import 'package:flutter/services.dart';
|
||||||
import 'package:provider/provider.dart';
|
import 'package:provider/provider.dart';
|
||||||
|
import 'package:tablet_app/Components/MainView/main_view.dart';
|
||||||
import 'package:webview_flutter/webview_flutter.dart';
|
import 'package:webview_flutter/webview_flutter.dart';
|
||||||
|
|
||||||
import 'Components/Map/map_context.dart';
|
import 'Components/Map/map_context.dart';
|
||||||
|
import 'Components/Previous/previous_view.dart';
|
||||||
import 'Components/custom_clipper.dart';
|
import 'Components/custom_clipper.dart';
|
||||||
import 'Components/Map/map_view.dart';
|
import 'Components/Map/map_view.dart';
|
||||||
import 'Components/webView.dart';
|
import 'Components/webView.dart';
|
||||||
@ -57,306 +59,10 @@ class _MyAppState extends State<MyApp> {
|
|||||||
visualDensity: VisualDensity.adaptivePlatformDensity,
|
visualDensity: VisualDensity.adaptivePlatformDensity,
|
||||||
),
|
),
|
||||||
routes: {
|
routes: {
|
||||||
'/home': (context) => MyHomePage(title: 'Tablet App Demo Home Page')
|
'/previous': (context) => PreviousViewWidget(title: 'Tablet App Demo Home Page'),
|
||||||
|
'/home': (context) => MainViewWidget()
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class MyHomePage extends StatefulWidget {
|
|
||||||
MyHomePage({Key key, this.title}) : super(key: key);
|
|
||||||
|
|
||||||
final String title;
|
|
||||||
|
|
||||||
@override
|
|
||||||
_MyHomePageState createState() => _MyHomePageState();
|
|
||||||
}
|
|
||||||
|
|
||||||
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
|
|
||||||
static String url= "https://my.matterport.com/show/?m=k8bvdezfHbT";
|
|
||||||
Size sizeScreen = new Size(1080.0, 1920.0); // Tablet resolution
|
|
||||||
double elementMinimizedSize = 200.0;
|
|
||||||
double elementMaximizedSize = 400.0;
|
|
||||||
bool minimized = false;
|
|
||||||
|
|
||||||
double _leftMain;
|
|
||||||
double _topMain;
|
|
||||||
double _rightMain;
|
|
||||||
double _bottomMain;
|
|
||||||
|
|
||||||
double _leftTitle;
|
|
||||||
double _topTitle;
|
|
||||||
double _rightTitle;
|
|
||||||
double _bottomTitle;
|
|
||||||
|
|
||||||
double _leftElement;
|
|
||||||
double _topElement;
|
|
||||||
double _rightElement;
|
|
||||||
double _bottomElement;
|
|
||||||
|
|
||||||
double _leftMenu;
|
|
||||||
double _topMenu;
|
|
||||||
double _rightMenu;
|
|
||||||
double _bottomMenu;
|
|
||||||
|
|
||||||
AnimationController _controller;
|
|
||||||
Completer<WebViewController> _webViewController = Completer<WebViewController>();
|
|
||||||
|
|
||||||
@override
|
|
||||||
void initState() {
|
|
||||||
setState(() {
|
|
||||||
_leftMain = (sizeScreen.height / 2) - elementMaximizedSize;
|
|
||||||
_topMain = (sizeScreen.width / 2) - elementMaximizedSize;
|
|
||||||
_rightMain = (sizeScreen.height / 2) - elementMaximizedSize;
|
|
||||||
_bottomMain = (sizeScreen.width / 2) - elementMaximizedSize;
|
|
||||||
|
|
||||||
_leftElement = (sizeScreen.height/2)-elementMaximizedSize;
|
|
||||||
_topElement = (sizeScreen.width/2)-elementMaximizedSize;
|
|
||||||
_rightElement = (sizeScreen.height/2);
|
|
||||||
_bottomElement = (sizeScreen.width/2);
|
|
||||||
|
|
||||||
_leftMenu = 0;
|
|
||||||
_topMenu = sizeScreen.width * 0.15;
|
|
||||||
_rightMenu = sizeScreen.height;
|
|
||||||
_bottomMenu = sizeScreen.width * 0.2;
|
|
||||||
|
|
||||||
_leftTitle = 0;
|
|
||||||
_topTitle = 0;
|
|
||||||
_rightTitle = sizeScreen.height;
|
|
||||||
_bottomTitle = sizeScreen.width;
|
|
||||||
});
|
|
||||||
|
|
||||||
_controller = AnimationController(value: 12, vsync: this, duration: Duration(seconds: 1));
|
|
||||||
_controller.animateBack(0);
|
|
||||||
|
|
||||||
super.initState();
|
|
||||||
}
|
|
||||||
|
|
||||||
void _incrementCounter() {
|
|
||||||
setState(() {
|
|
||||||
|
|
||||||
minimized = !minimized;
|
|
||||||
|
|
||||||
if (minimized) {
|
|
||||||
_controller.animateBack(5.0);
|
|
||||||
} else {
|
|
||||||
_controller.animateBack(0.0);
|
|
||||||
}
|
|
||||||
|
|
||||||
_leftMenu = 0;
|
|
||||||
_topMenu = sizeScreen.width * 0.18;
|
|
||||||
_rightMenu = minimized ? sizeScreen.height - elementMinimizedSize : sizeScreen.height;
|
|
||||||
_bottomMenu = minimized ? sizeScreen.width * 0.2 : sizeScreen.width * 0.2;
|
|
||||||
|
|
||||||
_leftMain = minimized ? 0 : (sizeScreen.height/2)-elementMaximizedSize;
|
|
||||||
_topMain = minimized ? sizeScreen.width-elementMinimizedSize : (sizeScreen.width/2)-elementMaximizedSize;
|
|
||||||
_rightMain = minimized ? sizeScreen.height-elementMinimizedSize : (sizeScreen.height/2)-elementMaximizedSize;
|
|
||||||
_bottomMain = minimized ? 0 : (sizeScreen.width/2)-elementMaximizedSize;
|
|
||||||
|
|
||||||
_leftElement = minimized ? sizeScreen.height * 0.11 : (sizeScreen.height/2)-elementMaximizedSize;
|
|
||||||
_topElement = minimized ? 0 : (sizeScreen.width/2)-elementMaximizedSize;
|
|
||||||
_rightElement = minimized ? 0 : (sizeScreen.height/2);
|
|
||||||
_bottomElement = minimized ? 0 : (sizeScreen.width/2);
|
|
||||||
|
|
||||||
_leftTitle = 0;
|
|
||||||
_topTitle = 0;
|
|
||||||
_rightTitle = minimized ? sizeScreen.height - elementMinimizedSize : sizeScreen.height;
|
|
||||||
_bottomTitle = minimized ? sizeScreen.width * 0.83 : sizeScreen.width;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
Future<bool> _onWillPop() async {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
@override
|
|
||||||
void dispose() {
|
|
||||||
_controller.dispose();
|
|
||||||
super.dispose();
|
|
||||||
}
|
|
||||||
|
|
||||||
static Future<String> get _url async {
|
|
||||||
await Future.delayed(Duration(seconds: 1));
|
|
||||||
return url;
|
|
||||||
}
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
SystemChrome.setEnabledSystemUIOverlays([]);
|
|
||||||
Size size = MediaQuery.of(context).size;
|
|
||||||
return new WillPopScope(
|
|
||||||
onWillPop: _onWillPop,
|
|
||||||
child: Scaffold(
|
|
||||||
// Tablet size
|
|
||||||
body: Container(
|
|
||||||
height: size.height,
|
|
||||||
width: size.width,
|
|
||||||
child: Stack(
|
|
||||||
children: <Widget>[
|
|
||||||
// Main
|
|
||||||
AnimatedPositioned(
|
|
||||||
duration: const Duration(milliseconds: 1500),
|
|
||||||
curve: Curves.easeInOutSine,
|
|
||||||
left: _leftMain,
|
|
||||||
top: _topMain,
|
|
||||||
right: _rightMain,
|
|
||||||
bottom: _bottomMain,
|
|
||||||
child: InkWell(
|
|
||||||
onTap: () { if (minimized) _incrementCounter(); },
|
|
||||||
child: Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
borderRadius: new BorderRadius.only(
|
|
||||||
topRight: const Radius.circular(20.0),
|
|
||||||
),
|
|
||||||
color: kSecondRed
|
|
||||||
),
|
|
||||||
child: Center(
|
|
||||||
child: Text(
|
|
||||||
'MAIN MENU',
|
|
||||||
style: TextStyle(color: kTextRed, fontSize: 25),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
// Title opened
|
|
||||||
AnimatedPositioned(
|
|
||||||
duration: const Duration(milliseconds: 1500),
|
|
||||||
curve: Curves.easeInOutSine,
|
|
||||||
left: _leftTitle,
|
|
||||||
top: _topTitle,
|
|
||||||
right: _rightTitle,
|
|
||||||
bottom: _bottomTitle,
|
|
||||||
child: InkWell(
|
|
||||||
onTap: () { if (minimized) _incrementCounter(); },
|
|
||||||
child: Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
borderRadius: new BorderRadius.only(
|
|
||||||
bottomRight: const Radius.circular(20.0),
|
|
||||||
),
|
|
||||||
color: kSecondRed
|
|
||||||
),
|
|
||||||
child: Center(
|
|
||||||
child: Text(
|
|
||||||
'Title opened element',
|
|
||||||
style: TextStyle(color: kTextRed, fontSize: 25),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
// Element
|
|
||||||
AnimatedPositioned(
|
|
||||||
duration: const Duration(milliseconds: 1000),
|
|
||||||
curve: Curves.easeInOutSine,
|
|
||||||
top: _topElement,
|
|
||||||
left: _leftElement,
|
|
||||||
right: _rightElement,
|
|
||||||
bottom: _bottomElement,
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.all(5.0),
|
|
||||||
child: AnimatedBuilder(
|
|
||||||
animation: _controller,
|
|
||||||
builder: (BuildContext context, Widget child) {
|
|
||||||
return ClipPath(
|
|
||||||
clipper: WaveClipper(move: _controller.value, minimized: minimized, height: _leftMain, width: _topMain),
|
|
||||||
clipBehavior: Clip.hardEdge,
|
|
||||||
child: InkWell(
|
|
||||||
onTap: () => {
|
|
||||||
if (!minimized) _incrementCounter()
|
|
||||||
},
|
|
||||||
child: AnimatedContainer(
|
|
||||||
// Define how long the animation should take.
|
|
||||||
duration: Duration(seconds: 2),
|
|
||||||
// Provide an optional curve to make the animation feel smoother.
|
|
||||||
curve: Curves.easeInOutCubic,
|
|
||||||
height: elementMaximizedSize,
|
|
||||||
width: elementMaximizedSize,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
borderRadius: BorderRadius.circular(20.0),
|
|
||||||
gradient: LinearGradient(
|
|
||||||
begin: Alignment.centerRight,
|
|
||||||
end: Alignment.centerLeft,
|
|
||||||
colors: [
|
|
||||||
minimized ? kBackgroundSecondGrey : kSecondGrey,
|
|
||||||
minimized ? kBackgroundSecondGrey : Colors.transparent
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
child: Center(
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.all(20.0),
|
|
||||||
child: Container(
|
|
||||||
width: size.width,
|
|
||||||
height: size.height,
|
|
||||||
child: ChangeNotifierProvider<MapContext>(
|
|
||||||
create: (_) => MapContext(new MapMarker(latitude: null, longitude: null, title: '', description: '', text: '')),
|
|
||||||
child: MapViewWidget()/*FutureBuilder(
|
|
||||||
future: _url,
|
|
||||||
builder: (BuildContext context, AsyncSnapshot snapshot) => snapshot.hasData
|
|
||||||
? WebViewWidget(url: snapshot.data,)
|
|
||||||
: CircularProgressIndicator()),*/
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
// MENU
|
|
||||||
AnimatedPositioned(
|
|
||||||
duration: const Duration(milliseconds: 2000),
|
|
||||||
curve: Curves.easeInOutSine,
|
|
||||||
top: _topMenu,
|
|
||||||
left: _leftMenu,
|
|
||||||
right: _rightMenu,
|
|
||||||
bottom: _bottomMenu,
|
|
||||||
child: Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
borderRadius: new BorderRadius.only(
|
|
||||||
topRight: const Radius.circular(20.0),
|
|
||||||
bottomRight: const Radius.circular(20.0),
|
|
||||||
),
|
|
||||||
color: Colors.lightBlue
|
|
||||||
),
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
|
||||||
children: [
|
|
||||||
if(minimized) ... [
|
|
||||||
Text('MENU'),
|
|
||||||
Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
|
||||||
children: [
|
|
||||||
Text('Sub menu 1'),
|
|
||||||
Text('Sub menu 2'),
|
|
||||||
]
|
|
||||||
)
|
|
||||||
]
|
|
||||||
|
|
||||||
]
|
|
||||||
),
|
|
||||||
/*Icon(
|
|
||||||
Icons.autorenew,
|
|
||||||
color: Colors.pink,
|
|
||||||
size: 24.0,
|
|
||||||
semanticLabel: 'Text to announce in accessibility modes',
|
|
||||||
),*/
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
/*floatingActionButton: FloatingActionButton(
|
|
||||||
onPressed: _incrementCounter,
|
|
||||||
tooltip: 'Increment',
|
|
||||||
child: Icon(Icons.add),
|
|
||||||
),*/
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|||||||
21
pubspec.lock
21
pubspec.lock
@ -88,6 +88,20 @@ packages:
|
|||||||
url: "https://pub.dartlang.org"
|
url: "https://pub.dartlang.org"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "1.2.0"
|
version: "1.2.0"
|
||||||
|
http:
|
||||||
|
dependency: "direct main"
|
||||||
|
description:
|
||||||
|
name: http
|
||||||
|
url: "https://pub.dartlang.org"
|
||||||
|
source: hosted
|
||||||
|
version: "0.12.2"
|
||||||
|
http_parser:
|
||||||
|
dependency: transitive
|
||||||
|
description:
|
||||||
|
name: http_parser
|
||||||
|
url: "https://pub.dartlang.org"
|
||||||
|
source: hosted
|
||||||
|
version: "3.1.4"
|
||||||
matcher:
|
matcher:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
@ -116,6 +130,13 @@ packages:
|
|||||||
url: "https://pub.dartlang.org"
|
url: "https://pub.dartlang.org"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "1.8.0-nullsafety.2"
|
version: "1.8.0-nullsafety.2"
|
||||||
|
pedantic:
|
||||||
|
dependency: transitive
|
||||||
|
description:
|
||||||
|
name: pedantic
|
||||||
|
url: "https://pub.dartlang.org"
|
||||||
|
source: hosted
|
||||||
|
version: "1.9.2"
|
||||||
plugin_platform_interface:
|
plugin_platform_interface:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
|
|||||||
@ -26,6 +26,7 @@ dependencies:
|
|||||||
webview_flutter: ^1.0.7
|
webview_flutter: ^1.0.7
|
||||||
google_maps_flutter: ^1.1.1
|
google_maps_flutter: ^1.1.1
|
||||||
provider: ^4.3.2
|
provider: ^4.3.2
|
||||||
|
http: ^0.12.2
|
||||||
|
|
||||||
# The following adds the Cupertino Icons font to your application.
|
# The following adds the Cupertino Icons font to your application.
|
||||||
# Use with the CupertinoIcons class for iOS style icons.
|
# Use with the CupertinoIcons class for iOS style icons.
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user