UNOV/mymuseum-visitapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Misc, update layout, nice main page + hero to configuration detail

Browse Source
This commit is contained in:
Thomas Fransolet 2025-06-05 18:20:48 +02:00
parent 878a2e4cf0
commit b7ca69162c
8 changed files with 319 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
lib/Components/CustomAppBar.dart
View File

@ -4,6 +4,7 @@ import 'package:mymuseum_visitapp/Components/AdminPopup.dart';
import 'package:mymuseum_visitapp/Components/LanguageSelection.dart';
import 'package:mymuseum_visitapp/Models/visitContext.dart';
import 'package:mymuseum_visitapp/Screens/Home/home.dart';
import 'package:mymuseum_visitapp/Screens/Home/home_3.0.dart';
import 'package:mymuseum_visitapp/app_context.dart';
import 'package:mymuseum_visitapp/constants.dart';
import 'package:provider/provider.dart';
@ -77,7 +78,7 @@ class _CustomAppBarState extends State<CustomAppBar> {
visitAppContext.isScanningBeacons = false;
//Navigator.of(context).pop();
Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(
builder: (context) => const HomePage(),
builder: (context) => const HomePage3(),
),(route) => false);
});
}
@ -96,14 +97,14 @@ class _CustomAppBarState extends State<CustomAppBar> {
child: visitAppContext.isMaximizeTextSize ? const Icon(Icons.text_fields, color: Colors.white) : const Icon(Icons.format_size, color: Colors.white)
),
),
Padding(
/*Padding(
padding: const EdgeInsets.only(right: 5.0),
child: SizedBox(
width: 50,
height: 50,
child: LanguageSelection()
)
),
),*/
],
flexibleSpace: Container(
decoration: const BoxDecoration(

5
lib/Components/LanguageSelection.dart
View File

@ -48,9 +48,10 @@ class _LanguageSelection extends State<LanguageSelection> with TickerProviderSta
}
return PopupMenuButton(
color: kMainColor.withValues(alpha: 0.65),
icon: Container(
height: size.height *0.07,
width: size.width *0.07,
height: size.height *0.08,
width: size.width *0.08,
decoration: flagDecoration(selectedLanguage!),
),
itemBuilder: (context){

4
lib/Screens/Home/configurations_list.dart
View File

@ -79,7 +79,7 @@ class _ConfigurationsListState extends State<ConfigurationsList> {
Navigator.of(context).pushReplacement(MaterialPageRoute(
builder: (context) =>
VisitPage(configurationId: configurations[index].id!, isAlreadyAllowed: visitAppContext.isScanBeaconAlreadyAllowed),
VisitPage(configuration: configurations[index], isAlreadyAllowed: visitAppContext.isScanBeaconAlreadyAllowed),
));
}
@ -110,7 +110,7 @@ class _ConfigurationsListState extends State<ConfigurationsList> {
Navigator.of(context).pushReplacement(MaterialPageRoute(
builder: (context) =>
VisitPage(configurationId: configurations[index].id!, isAlreadyAllowed: visitAppContext.isScanBeaconAlreadyAllowed),
VisitPage(configuration: configurations[index], isAlreadyAllowed: visitAppContext.isScanBeaconAlreadyAllowed),
));
}
}

145
lib/Screens/Home/home_3.0.dart
View File

@ -8,6 +8,7 @@ import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
import 'package:manager_api_new/api.dart';
import 'package:mymuseum_visitapp/Components/CustomAppBar.dart';
import 'package:mymuseum_visitapp/Components/LanguageSelection.dart';
import 'package:mymuseum_visitapp/Components/ScannerBouton.dart';
import 'package:mymuseum_visitapp/Components/loading_common.dart';
import 'package:mymuseum_visitapp/Helpers/DatabaseHelper.dart';
@ -17,6 +18,7 @@ import 'package:mymuseum_visitapp/Helpers/requirement_state_controller.dart';
import 'package:mymuseum_visitapp/Helpers/translationHelper.dart';
import 'package:mymuseum_visitapp/Models/beaconSection.dart';
import 'package:mymuseum_visitapp/Models/visitContext.dart';
import 'package:mymuseum_visitapp/Screens/Visit/visit.dart';
import 'package:mymuseum_visitapp/Services/apiService.dart';
import 'package:mymuseum_visitapp/Services/downloadConfiguration.dart';
import 'package:mymuseum_visitapp/app_context.dart';
@ -50,6 +52,12 @@ class _HomePage3State extends State<HomePage3> with WidgetsBindingObserver {
Colors.red,
];
@override
void initState() {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
super.initState();
}
@override
Widget build(BuildContext context) {
Size size = MediaQuery.of(context).size;
@ -57,6 +65,7 @@ class _HomePage3State extends State<HomePage3> with WidgetsBindingObserver {
visitAppContext = appContext.getContext();
return Scaffold(
extendBody: true,
body: FutureBuilder(
future: getConfigurationsCall(visitAppContext.clientAPI, appContext),
builder: (context, AsyncSnapshot<dynamic> snapshot) {
@ -67,16 +76,26 @@ class _HomePage3State extends State<HomePage3> with WidgetsBindingObserver {
return Stack(
children: [
SizedBox(
Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [Colors.grey, Colors.lightGreen],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
),
/*SizedBox(
height: size.height * 0.35,
width: size.width,
child: Image.network(
configurations[2].imageSource!,
fit: BoxFit.cover,
)
),
Padding(
padding: EdgeInsets.only(top: size.height * 0.15),
),*/
SafeArea(
top: false,
bottom: false,
child: CustomScrollView(
slivers: [
/*SliverAppBar(
@ -94,33 +113,60 @@ class _HomePage3State extends State<HomePage3> with WidgetsBindingObserver {
),*/
SliverAppBar(
backgroundColor: Colors.transparent,
pinned: true,
expandedHeight: 225.0,
flexibleSpace: Container() /*FlexibleSpaceBar(
collapseMode: CollapseMode.none, // 👈 Optionnel pour éviter le fade
pinned: false,
expandedHeight: 235.0,
flexibleSpace: FlexibleSpaceBar(
collapseMode: CollapseMode.pin, // 👈 Optionnel pour éviter le fade
centerTitle: true,
background: Image.network(
configurations[2].imageSource!,
background: Container(
padding: const EdgeInsets.only(bottom: 25.0),
decoration: const BoxDecoration(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(25),
bottomRight: Radius.circular(25),
),
boxShadow: [
BoxShadow(
color: Colors.black26,
blurRadius: 3.5,
offset: Offset(0, -20),
),
],
),
child: ClipRRect(
borderRadius: const BorderRadius.only(
bottomLeft: Radius.circular(25),
bottomRight: Radius.circular(25),
),
child: Stack(
fit: StackFit.expand,
children: [
Opacity(
opacity: 0.85,
child: Image.network(
configurations[1].imageSource!,
fit: BoxFit.cover,
),
title: InkWell(
onLongPress: () {
showDialog(
builder: (BuildContext context) => const AlertDialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(10.0))
),
//content: AdminPopup(),
contentPadding: EdgeInsets.zero,
), context: context
);
},
Positioned(
top: 35,
right: 10,
child: SizedBox(
width: /*widget.isHomeButton ?*/ size.width * 0.8 /*: null*/,
height: 60,
width: 75,
height: 75,
child: LanguageSelection()
),
),
],
),
),
),
title: SizedBox(
width: /*widget.isHomeButton ?*/ size.width * 1.0 /*: null*/,
height: 120,
child: Center(
child: HtmlWidget(
"Carnaval de Marche",
configurations[0].title!.firstWhere((t) => t.language == "FR").value!,
textStyle: const TextStyle(color: Colors.white, fontFamily: 'Roboto', fontSize: 20),
customStylesBuilder: (element)
{
@ -129,11 +175,10 @@ class _HomePage3State extends State<HomePage3> with WidgetsBindingObserver {
),
),
),
),
),*/ // plus de FlexibleSpaceBar
), // plus de FlexibleSpaceBar
),
SliverPadding(
padding: const EdgeInsets.all(8),
padding: const EdgeInsets.only(left: 8.0, right: 8.0, top: 8.0, bottom: 20.0),
sliver: SliverMasonryGrid.count(
crossAxisCount: 2,
mainAxisSpacing: 12,
@ -141,16 +186,54 @@ class _HomePage3State extends State<HomePage3> with WidgetsBindingObserver {
childCount: configurations.length,
itemBuilder: (context, index) {
//return buildTile(configurations[index]);
return Container(
String cleanedTitle = configurations[index].title!.firstWhere((t) => t.language == "FR").value!.replaceAll('\n', ' ').replaceAll('<br>', ' ');
return InkWell(
onTap: () {
// Update context (it's in visit now, hero..
Navigator.of(context).push(MaterialPageRoute(
builder: (context) =>
VisitPage(configuration: configurations[index], isAlreadyAllowed: visitAppContext.isScanBeaconAlreadyAllowed),
));
},
child: Hero(
tag: configurations[index].id!,
child: Container(
height: 200 + (index % 3) * 55,
decoration: BoxDecoration(
color: colors[index % colors.length],
borderRadius: BorderRadius.circular(16),
boxShadow: const [
BoxShadow(
color: kMainGrey,
spreadRadius: 0.5,
blurRadius: 5,
offset: Offset(0, 1), // changes position of shadow
),
],
image: configurations[index].imageSource != null ? DecorationImage(
fit: BoxFit.cover,
opacity: 0.5,
image: NetworkImage(
configurations[index].imageSource!,
),
): null,
),
child: Center(
child: Text(
'Bloc ${index + 1}',
style: const TextStyle(color: Colors.white, fontSize: 18),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: HtmlWidget(
cleanedTitle,
textStyle: const TextStyle(color: Colors.white, fontFamily: 'Roboto', fontSize: 20),
customStylesBuilder: (element)
{
return {'text-align': 'center', 'font-family': "Roboto", '-webkit-line-clamp': "2"};
},
),
),
),
),
),
);

84
lib/Screens/Visit/components/body.dart
View File

@ -8,6 +8,7 @@ import 'package:mymuseum_visitapp/Helpers/DatabaseHelper.dart';
import 'package:mymuseum_visitapp/Helpers/translationHelper.dart';
import 'package:mymuseum_visitapp/Models/visitContext.dart';
import 'package:mymuseum_visitapp/Screens/Article/article_page.dart';
import 'package:mymuseum_visitapp/Screens/Home/home_3.0.dart';
import 'package:mymuseum_visitapp/Screens/Quizz/quizz_page.dart';
import 'package:mymuseum_visitapp/Screens/section_page.dart';
import 'package:mymuseum_visitapp/Services/apiService.dart';
@ -18,9 +19,9 @@ import 'package:provider/provider.dart';
import 'section_card.dart';
class Body extends StatefulWidget {
const Body({Key? key, required this.configurationId}) : super(key: key);
const Body({Key? key, required this.configuration}) : super(key: key);
final String? configurationId;
final ConfigurationDTO configuration;
@override
State<Body> createState() => _BodyState();
@ -35,12 +36,75 @@ class _BodyState extends State<Body> {
@override
Widget build(BuildContext context) {
final appContext = Provider.of<AppContext>(context);
VisitAppContext visitAppContext = appContext.getContext();
Size size = MediaQuery.of(context).size;
return SafeArea(
bottom: false,
child: Column(
top: false,
child: Stack(
children: [
Hero(
tag: widget.configuration.id!,
child: Container(
height: size.height * 0.28,
decoration: BoxDecoration(
boxShadow: const [
BoxShadow(
color: kMainGrey,
spreadRadius: 0.5,
blurRadius: 5,
offset: Offset(0, 1), // changes position of shadow
),
],
image: widget.configuration.imageSource != null ? DecorationImage(
fit: BoxFit.cover,
opacity: 0.65,
image: NetworkImage(
widget.configuration.imageSource!,
),
): null,
),
),
),
Column(
children: <Widget>[
SizedBox(
height: size.height * 0.11,
width: size.width,
child: Stack(
fit: StackFit.expand,
children: [
Positioned(
top: 35,
left: 10,
child: SizedBox(
width: 50,
height: 50,
child: InkWell(
onTap: () {
setState(() {
visitAppContext.configuration = null;
visitAppContext.isScanningBeacons = false;
Navigator.of(context).pop();
/*Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(
builder: (context) => const HomePage3(),
),(route) => false);*/
});
},
child: Container(
decoration: const BoxDecoration(
color: kMainColor,
shape: BoxShape.circle,
),
child: const Icon(Icons.chevron_left, size: 28, color: Colors.white)
),
)
),
),
],
),
),
Row(
children: [
SearchBox(onChanged: (value) {
@ -91,7 +155,7 @@ class _BodyState extends State<Body> {
padding: const EdgeInsets.only(bottom: 0),
child: RefreshIndicator(
onRefresh: () async {
if(!(appContext.getContext() as VisitAppContext).configuration!.isOffline!) {
if(!widget.configuration.isOffline!) {
// Force refresh if online
setState(() {});
} },
@ -133,12 +197,14 @@ class _BodyState extends State<Body> {
),
],
),
],
),
);
}
getSections(AppContext appContext) async {
VisitAppContext visitAppContext = (appContext.getContext() as VisitAppContext);
if(visitAppContext.configuration!.isOffline!)
VisitAppContext visitAppContext = appContext.getContext();
if(widget.configuration.isOffline!)
{
// OFFLINE
sections = List<SectionDTO>.from(await DatabaseHelper.instance.getData(DatabaseTableType.sections));
@ -146,15 +212,15 @@ class _BodyState extends State<Body> {
else
{
// ONLINE
List<SectionDTO>? sectionsDownloaded = await ApiService.getAllSections(visitAppContext.clientAPI, visitAppContext.configuration!.id!);
List<SectionDTO>? sectionsDownloaded = await ApiService.getAllSections(visitAppContext.clientAPI, widget.configuration.id!);
//print(sectionsDownloaded);
if(sectionsDownloaded!.isNotEmpty) {
sections = sectionsDownloaded.where((s) => s.type == SectionType.Article || s.type == SectionType.Quiz).toList(); // TODO Support more than Article and Quizz section type
sections = sectionsDownloaded.toList();
//print(sections);
}
}
sections = sections.where((s) => s.configurationId == widget.configurationId).toList();
sections = sections.where((s) => s.configurationId == widget.configuration.id!).toList();
sections.sort((a,b) => a.order!.compareTo(b.order!));
sectionsToDisplay = sections;

4
lib/Screens/Visit/components/section_card.dart
View File

@ -33,7 +33,7 @@ class SectionCard extends StatelessWidget {
Size size = MediaQuery.of(context).size;
final appContext = Provider.of<AppContext>(context);
VisitAppContext visitAppContext = appContext.getContext();
bool isOffline = (appContext.getContext() as VisitAppContext).configuration!.isOffline!;
bool isOffline = (appContext.getContext() as VisitAppContext).configuration?.isOffline! ?? false;
return Container(
margin: EdgeInsets.only(
@ -69,7 +69,7 @@ class SectionCard extends StatelessWidget {
),
),
),
if(sectionDTO.imageId != null)
if(sectionDTO.imageId != null && (appContext.getContext() as VisitAppContext).configuration != null)
// section main image
Positioned(
top: kDefaultPadding +4.0,

20
lib/Screens/Visit/visit.dart
View File

@ -25,9 +25,9 @@ import 'package:provider/provider.dart';
import 'components/body.dart';
class VisitPage extends StatefulWidget {
const VisitPage({Key? key, required this.configurationId, required this.isAlreadyAllowed}) : super(key: key);
const VisitPage({Key? key,required this.configuration, required this.isAlreadyAllowed}) : super(key: key);
final String configurationId;
final ConfigurationDTO configuration;
final bool isAlreadyAllowed;
@override
@ -35,7 +35,7 @@ class VisitPage extends StatefulWidget {
}
class _VisitPageState extends State<VisitPage> with WidgetsBindingObserver {
ConfigurationDTO? configuration;
//ConfigurationDTO? configuration;
int timeBetweenBeaconPopUp = 20000; // 20 sec
int meterToBeacon = 100; // 15 meters
@ -73,6 +73,10 @@ class _VisitPageState extends State<VisitPage> with WidgetsBindingObserver {
if(widget.isAlreadyAllowed) {
listeningState();
}
/*WidgetsBinding.instance.addPostFrameCallback((_) {
final appContext = Provider.of<AppContext>(context, listen: false);
});*/
//listeningState();
}
@ -320,7 +324,7 @@ class _VisitPageState extends State<VisitPage> with WidgetsBindingObserver {
Widget build(BuildContext context) {
final appContext = Provider.of<AppContext>(context);
VisitAppContext visitAppContext = appContext.getContext();
configuration = visitAppContext.configuration;
//configuration = visitAppContext.configuration;
listener = controller.startStream.listen((flag) async {
print(flag);
@ -331,17 +335,15 @@ class _VisitPageState extends State<VisitPage> with WidgetsBindingObserver {
}
});
return PopScope(
canPop: false,
child: Scaffold(
appBar: CustomAppBar(
/*appBar: CustomAppBar(
title: TranslationHelper.get(configuration!.title, visitAppContext),
isHomeButton: true,
),
),*/
backgroundColor: kBackgroundGrey,
body: Body(configurationId: configuration!.id), // TODO handle error..
body: Body(configuration: widget.configuration),
floatingActionButton: Stack(
children: [
visitAppContext.beaconSections != null && visitAppContext.beaconSections!.where((bs) => bs!.configurationId == visitAppContext.configuration!.id).isNotEmpty ? Align(

6
lib/main.dart
View File

@ -72,6 +72,12 @@ void main() async {
//);
//AudioPlayer.global.setGlobalAudioContext(audioContext);
WidgetsFlutterBinding.ensureInitialized();
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
systemNavigationBarColor: Colors.transparent, // ← important
statusBarColor: Colors.transparent,
));
runApp(myApp);
}