timeRegionBuilder property
A builder that builds a widget that replaces the time region view in day, week, workweek, and timeline day, week, workweek views.
See also:
- specialRegions, to set the special time regions in the calendar.
- TimeRegion, to now the details about the special time regions and it's properties in calendar.
- Knowledge base: How to customize special regions with builder
List<TimeRegion> _getTimeRegions() {
final List<TimeRegion> regions = <TimeRegion>[];
DateTime date = DateTime.now();
date = DateTime(date.year, date.month, date.day, 12, 0, 0);
regions.add(TimeRegion(
startTime: date,
endTime: date.add(Duration(hours: 2)),
enablePointerInteraction: false,
color: Colors.grey.withOpacity(0.2),
text: 'Break'));
return regions;
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: SfCalendar(
view: CalendarView.day,
specialRegions: _getTimeRegions(),
timeRegionBuilder:
(BuildContext context, TimeRegionDetails timeRegionDetails) {
return Container(
margin: EdgeInsets.all(1),
alignment: Alignment.center,
child: Text(
timeRegionDetails.region.text!,
style: TextStyle(color: Colors.black),
),
decoration: BoxDecoration(
shape: BoxShape.rectangle,
borderRadius: BorderRadius.all(Radius.circular(4.0)),
gradient: LinearGradient(
colors: [timeRegionDetails.region.color!, Colors.cyan],
begin: Alignment.centerRight,
end: Alignment.centerLeft)),
);
},
),
));
}
Implementation
final TimeRegionBuilder? timeRegionBuilder;