viewHeaderStyle property

DateRangePickerViewHeaderStyle viewHeaderStyle

Sets the style to customize SfDateRangePicker month view view header.

Allows to customize the textStyle and backgroundColor of the view header view in month view of SfDateRangePicker.

See also:

• DateRangePickerViewHeaderStyle, to know more about the available option for customize the view header view of month view.
• viewHeaderHeight, which is the size for the view header view in the month view of date range picker.
• dayFormat, which is used to customize the format of the view header text in the month view of date range picker.
• SfDateRangePicker.todayHighlightColor, which highlights the today date cell in the date range picker.
• Knowledge base: How to replace the view header with the custom widget

Widget build(BuildContext context) {
   return MaterialApp(
     home: Scaffold(
       body: SfDateRangePicker(
         controller: _pickerController,
         view: DateRangePickerView.month,
         selectionMode: DateRangePickerSelectionMode.single,
         monthViewSettings: DateRangePickerMonthViewSettings(
             viewHeaderStyle: DateRangePickerViewHeaderStyle(
                 backgroundColor: Colors.red,
                 textStyle: TextStyle(
                     fontWeight: FontWeight.w500,
                     fontStyle: FontStyle.italic,
                    fontSize: 20,
                     color: Colors.white))),
       ),
     ),
   );
 }

Implementation

final DateRangePickerViewHeaderStyle viewHeaderStyle;