hello, I am creating a shared calendar application which allows you to display several calendars specific to a user. Each calendar has events that should be displayed like this:
For this I created an "event" MAP which collects all the added and existing events in the database.
Here is my problem: When I add an event, it is displayed perfectly as in the screen above. However, it does not display events that have already been added in the past (i.e. events collected in the database). I don't know what the reason for this, knowing that they are in the map event. why all the events contained inside are not displayed as expected?
Here is my custom widget's code:
// Automatic FlutterFlow imports
import '/backend/backend.dart';
import '/flutter_flow/flutter_flow_theme.dart';
import '/flutter_flow/flutter_flow_util.dart';
import '/custom_code/widgets/index.dart'; // Imports other custom widgets
import '/flutter_flow/custom_functions.dart'; // Imports custom functions
import 'package:flutter/material.dart';
// Begin custom widget code
// DO NOT REMOVE OR MODIFY THE CODE ABOVE!
import 'package:table_calendar/table_calendar.dart';
import 'dart:collection';
import 'package:flutter/services.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
/// Example event class.
class Event {
final String title;
const Event(this.title);
@override
String toString() => title;
}
final kToday = DateTime.now();
final kFirstDay = DateTime.utc(2010, 10, 16);
final kLastDay = DateTime.utc(2030, 3, 14);
class Calendar extends StatefulWidget {
const Calendar({
Key? key,
this.width,
this.height,
required this.titre,
required this.code,
}) : super(key: key);
final double? width;
final double? height;
final String titre;
final String code;
@override
_CalendarState createState() => _CalendarState();
}
class _CalendarState extends State<Calendar> {
CalendarFormat _calendarFormat = CalendarFormat.month;
RangeSelectionMode _rangeSelectionMode = RangeSelectionMode.toggledOff;
DateTime _focusedDay = DateTime.now();
DateTime? _selectedDay;
DateTime? _rangeStart;
DateTime? _rangeEnd;
late ValueNotifier<List<Event>> _selectedEvents =
ValueNotifier<List<Event>>([]);
late Map<DateTime, List<Event>> events = {};
TextEditingController _eventController = TextEditingController();
@override
void initState() {
super.initState();
events = {};
initialyze();
}
void initialyze() async {
await putEventsInList();
_selectedDay = _focusedDay;
_selectedEvents = ValueNotifier(_getEventsForDay(_selectedDay!));
}
@override
void dispose() {
_selectedEvents.dispose();
super.dispose();
}
List<Event> _getEventsForDay(DateTime day) {
return events[day] ?? [];
}
void _onDaySelected(DateTime selectedDay, DateTime focusedDay) {
if (!isSameDay(_selectedDay, selectedDay)) {
setState(() {
_selectedDay = selectedDay;
_focusedDay = focusedDay;
_rangeSelectionMode = RangeSelectionMode.toggledOff;
});
_selectedEvents.value = _getEventsForDay(selectedDay);
}
}
Future<void> addEventToFirestore(
DateTime selectedDay, String eventName) async {
FirebaseFirestore firestore = FirebaseFirestore.instance;
final eventDocRef = FirebaseFirestore.instance.collection('events').doc();
final eventId = eventDocRef.id; // Obtenez l'ID du document
await firestore.collection('events').doc(eventId).set({
'date': selectedDay,
'name': eventName,
'id': eventId, // Utilisez le même ID pour le champ 'id'
});
addEventCalendarToFirestore(eventId);
}
Future<void> addEventCalendarToFirestore(String event) async {
FirebaseFirestore firestore = FirebaseFirestore.instance;
await firestore.collection('calendarsEvents').add({
'lEvent': event,
'leCalendar': widget.code,
});
}
Future<void> putEventsInList() async {
try {
print("début de la méthode");
QuerySnapshot calendarsEventsSnapshot =
await FirebaseFirestore.instance.collection('calendarsEvents').get();
for (QueryDocumentSnapshot calendarEventDoc
in calendarsEventsSnapshot.docs) {
String eventId = calendarEventDoc['lEvent'];
DocumentSnapshot eventSnapshot = await FirebaseFirestore.instance
.collection('events')
.doc(eventId)
.get();
if (eventSnapshot.exists) {
DateTime eventDate = (eventSnapshot['date'] as Timestamp).toDate();
print('ici');
setState(() {
// Vérifiez si la clé existe déjà dans la map
if (events.containsKey(eventDate)) {
// Ajoutez l'événement à la liste existante pour cette clé
events[eventDate]!.add(Event(eventSnapshot['name']));
} else {
// Créez une nouvelle liste pour cette clé
events[eventDate] = [Event(eventSnapshot['name'])];
}
});
}
}
print("la map event :" + events.toString());
} catch (e) {
// Gérez les erreurs ici
print(
'Erreur lors de la récupération des événements pour les calendriers : $e');
throw e; // Vous pouvez choisir de lever l'exception ou de la gérer autrement
}
print("fin de la méthode");
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.titre),
actions: <Widget>[
Padding(
padding: EdgeInsets.only(right: 16.0),
child: IconButton(
icon: Icon(Icons.share_sharp),
onPressed: () {
Clipboard.setData(ClipboardData(text: widget.code.toString()));
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('Code copié dans le presse-papiers'),
),
);
},
),
),
IconButton(
icon: Icon(Icons.add),
onPressed: () {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
scrollable: true,
title: Text("Nom de l'évènement"),
content: Padding(
padding: EdgeInsets.all(8),
child: TextField(
controller: _eventController,
),
),
actions: [
ElevatedButton(
onPressed: () {
events.addAll({
_selectedDay!: [Event(_eventController.text)]
});
addEventToFirestore(
_selectedDay!, _eventController.text);
Navigator.of(context).pop();
_selectedEvents.value =
_getEventsForDay(_selectedDay!);
},
child: Text("Valider"),
)
],
);
});
},
),
],
),
body: Column(
children: [
TableCalendar<Event>(
firstDay: kFirstDay,
lastDay: kLastDay,
focusedDay: _focusedDay,
selectedDayPredicate: (day) => isSameDay(_selectedDay, day),
rangeStartDay: _rangeStart,
rangeEndDay: _rangeEnd,
calendarFormat: _calendarFormat,
rangeSelectionMode: _rangeSelectionMode,
eventLoader: _getEventsForDay,
startingDayOfWeek: StartingDayOfWeek.monday,
calendarStyle: CalendarStyle(
// Use `CalendarStyle` to customize the UI
outsideDaysVisible: true,
),
onDaySelected: _onDaySelected,
onFormatChanged: (format) {
if (_calendarFormat != format) {
setState(() {
_calendarFormat = format;
});
}
},
onPageChanged: (focusedDay) {
_focusedDay = focusedDay;
},
),
const SizedBox(height: 8.0),
Expanded(
child: ValueListenableBuilder<List<Event>>(
valueListenable: _selectedEvents,
builder: (context, value, _) {
return ListView.builder(
itemCount: value.length,
itemBuilder: (context, index) {
return Container(
margin: const EdgeInsets.symmetric(
horizontal: 12.0,
vertical: 4.0,
),
decoration: BoxDecoration(
border: Border.all(),
borderRadius: BorderRadius.circular(12.0),
),
child: ListTile(
onTap: () => print('${value[index]}'),
title: Text('${value[index]}'),
),
);
},
);
},
),
),
],
),
);
}
}