从同步日历中获取选定日期的值数据

Question

我想如果我们在syncfusion日历上按下某一天，那么文本将自动设置点击的日期。

在此处输入图像描述

这是我在Flutter中使用Syncfusion Calendar的代码：

import 'package:flutter/material.dart';
import 'package:myhumgupdate/App/Config/palette.dart';
import 'package:myhumgupdate/Icon/dbicons.dart';
import 'package:myhumgupdate/Widgets/dialog_loading.dart';
import 'package:myhumgupdate/giangvien/Screens/XemTKB/TKBTheoNgay/tkbngay_viewmodel.dart';
import 'package:myhumgupdate/giangvien/models/meeting.dart';
import 'package:myhumgupdate/giangvien/models/meetingdata_source.dart';
import 'package:stacked/stacked.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';
class TKBNgay extends StatefulWidget {
@override
_TKBNgayState createState() => _TKBNgayState();
}
class _TKBNgayState extends State<TKBNgay> {
List<DateTime> _blackoutDates = <DateTime>[];
CalendarController _calendarController;
CalendarDataSource _calendarDataSource;
dynamic scheduleViewBuilder;
bool _showDatePickerButton = true;
bool _allowViewNavigation = true;
bool _showLeadingAndTrailingDates = true;
DateTime _minDate;
DateTime _maxDate;
final List<CalendarView> _allowedViews = <CalendarView>[
CalendarView.day,
CalendarView.week,
CalendarView.workWeek,
CalendarView.month,
CalendarView.schedule
];
ViewChangedCallback viewChangedCallback;
@override
Widget build(BuildContext context) {
return ViewModelBuilder<TKBNgayViewModel>.reactive(
onModelReady: (model) => Future.delayed(Duration.zero,
() => DialogLoading.show(context, model.getTkbNgay(model.timeNow))),
builder: (context, model, child) => Column(
children: [
Expanded(
child: SfCalendar(
controller: _calendarController,
dataSource: MeetingDataSource(model.getDataSource),
scheduleViewMonthHeaderBuilder: scheduleViewBuilder,
appointmentTimeTextFormat: 'hh:mm:ss a',
initialDisplayDate: DateTime(DateTime.now().year,
DateTime.now().month, DateTime.now().day, 00, 45, 0),
allowedViews: _allowedViews,
showDatePickerButton: _showDatePickerButton,
allowViewNavigation: _allowViewNavigation,
onViewChanged: viewChangedCallback,
blackoutDates: _blackoutDates,
minDate: _minDate,
maxDate: _maxDate,
monthViewSettings: MonthViewSettings(
appointmentDisplayMode:
MonthAppointmentDisplayMode.appointment,
showTrailingAndLeadingDates:
_showLeadingAndTrailingDates,
appointmentDisplayCount: 4),
// timeSlotViewSettings: const TimeSlotViewSettings(
//     minimumAppointmentDuration: Duration(minutes: 60)),
timeSlotViewSettings: TimeSlotViewSettings(
startHour: 0,
endHour: 16,
timeFormat: " H",
timeIntervalHeight: 60,
timeTextStyle: TextStyle(
color: Colors.black,
fontWeight: FontWeight.bold,
),
),
selectionDecoration: BoxDecoration(
color: Colors.transparent,
border: Border.all(color: Colors.yellow, width: 2),
shape: BoxShape.rectangle,
),
),
),
],
),
viewModelBuilder: () => TKBNgayViewModel());
}
}

有人能给我一些想法吗？我在TableCalendar中找不到任何类似onDaySelected或在SmartCalendar中找不到此onDayAddedOrRemoved的事件

Answer 1

获取日历中的点击日期详细信息-当在标题日期范围选择器上选择日期时，您可以在日历的onViewChanged回调中获取所选日期详细信息。此外，当点击日历单元格时，所选日期的详细信息可以通过日历的onTap回调获得。

参考：https://help.syncfusion.com/flutter/calendar/callbacks

一些KB可能有助于

1. https://www.syncfusion.com/kb/11026/how-to-get-visible-dates-details-from-the-flutter-calendar
2. https://www.syncfusion.com/kb/10997/how-to-add-custom-header-and-view-header-in-the-flutter-calendar
3. https://www.syncfusion.com/kb/10998/how-to-get-datetime-details-while-tapping-the-flutter-calendar
4. https://www.syncfusion.com/kb/12551/how-to-get-the-selected-dates-using-selection-changed-callback-in-the-flutter-calendar