r_calendar

📅 📆 Flutter calendar plugin, support custom calendar, week of month view/view switch, click the intercept, radio (switch on automatically choose), multiple-choice (powder/poly (optional). — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — – | making address: | github.com/rhymelph/r_… | pub address: | pub. Dev/packages/r_… | apk experience: | fir. Im / 2 aut ` — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — –

• ➤ Switch from month view to week view
• Customize your calendar
• [查 看 全 部
• ✔ Single selection, switch month/week automatic selection
• [误] Come to the foreground in large numbers

1. How to use it.

• pubspec.yamlFile add dependency

dependencies:
    r_calendar: last version
Copy the code

• Import packages

import 'package:r_calendar/r_calendar.dart';

Copy the code

• The optional controller is initialized

///
/// [selectedDate] The day that is selected by default
/// [isAutoSelect] Specifies whether to automatically select the same day of the month when the month is changed

    RCalendarController controller= RCalendarController.single(
                    selectedDate: DateTime.now(),
                    isAutoSelect: true,);
Copy the code

• Initialization of multiple selected controllers

///
/// [selectedDates] an array of selectedDates by default
/// [isDispersion] Specifies whether dispersion is used. If dispersion is not used, continuous dispersion is used

    RCalendarController controller = RCalendarController.multiple(
                    selectedDates: [
                        DateTime(2019.12.1),
                        DateTime(2019.12.2),
                        DateTime(2019.12.3),
                    ],
                    isDispersion: true);
Copy the code

• Weekly/monthly view (default monthly view)

///
/ / / (mode) model
/// -rcalendarmode. week Indicates the weekly view mode
/// -rcalendarMode. Month Calendar mode

    RCalendarController controller = RCalendarController.single(
                    mode:RCalendarMode.week);
Copy the code

• Data change monitor

/// add a listener to observe the value change
    RCalendarController controller = RCalendarController.multiple(...)
    ..addListener((){
    // Whether to select multiple options
    // controller.isMultiple

    / / radio
    // Whether to automatically select the same day of the month when the month is changed
    // controller.isAutoSelect
    // The currently selected date
    // controller.selectedDate;

    / / multi-select
    // Whether to scatter the selection. Otherwise, the selection is continuous
    // controller.isDispersion;
    // List of currently selected dates
    // controller.selectedDates;

    // Weekly view/monthly view
    // controller.mode
    });
Copy the code

• Custom calendar

class MyRCalendarCustomWidget extends RCalendarCustomWidget {
  // If you want the first day to be Monday, change the MaterialLocalizations firstDayOfWeekIndex
  // Day one two three four five six
  // Build the header
  @override
  List<Widget> buildWeekListWidget(BuildContext context,MaterialLocalizations localizations){... };// 1 2 3 4 5 6 7
  // Build the normal date
  @override
  Widget buildDateTime(BuildContext context,DateTime time, List<RCalendarType> types){... };// < November 2019 >
  // Build year and month left indicator, right indicator, return null no
  @overrideWidget buildTopWidget(BuildContext context,RCalendarController controller){... };// If not available, no click event
  @override
  bool isUnable(DateTime time, boolisSameMonth){... };// Click intercept, intercept when true is returned, and the selected date will not change
  @override
  FutureOr<bool> clickInterceptor(BuildContext context,DateTimedateTime){... };// The height of the subview
  @override
  double getchildHeight=>{... }; }Copy the code

2. Use it.

import 'package:flutter/material.dart';
import 'package:r_calendar/r_calendar.dart';

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page')); }}class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
  RCalendarController controller;

  @override
  void initState() {
    super.initState();
    controller = RCalendarController.multiple(selectedDates: [
      DateTime(2019.12.1),
      DateTime(2019.12.2),
      DateTime(2019.12.3),]);// controller = RCalendarController.single(selectedDate: DateTime.now(),isAutoSelect: true);
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: RCalendarWidget(
               controller: controller,
               customWidget: DefaultRCalendarCustomWidget(),
               firstDate: DateTime(1970.1.1), // The minimum date of the current calendar
               lastDate: DateTime(2055.12.31),// The maximum date of the current calendar)); }}Copy the code

3. Custom data (please update version to V0.1.6)

Users can set the data to the Controller and then retrieve it from the RCalendarCustomWidget

/// initialize the controller, I set the custom data type to List<DateTime>Of course, you can set it to whatever type you want
/// add one to the constructor`initialData`Parameter to initialize your custom data
    RCalendarController<List<DateTime>> controller =  RCalendarController.single(
    initialData: [
            DateTime.now(),
            DateTime.now().add(Duration(days: 1)),
            DateTime.now().add(Duration(days: 2)));/// If you want to change custom data, use the following example without setStatecontroller.data = [....] ;/// You can get the corresponding Controller by context in the RCalendarCustomWidget custom class. Then according to the custom data display judgment

class MyRCalendarCustomWidget extends RCalendarCustomWidget {
/ / /...
  @override
  Widget buildDateTime(
      BuildContext context, DateTime time, List<RCalendarType> types) {

    // new
    RCalendarController<List<DateTime>> controller =RCalendarMarker.of(context).notifier;
    // new

    / /...
   }
/ / /...
Copy the code