Code Monkey home page Code Monkey logo

some-calendar's Introduction

some calendar

pub package License support

Awesome Flutter

Custom calendar with Multi-select & range configurable calendar

New Features

  • Added View Mode Somecalendar #15

Help Maintenance

I've taken the time to make this library, help support to develop it or buy me coffee and snacks to be even more enthusiastic
Buy Me A Coffee Paypal

Gif Somecalendar (Dialog)


Multi

Range

Single

Requirements to run the demo

Setup

Add dependency to your pubspec.yaml:

some_calendar: ^{latest_version}

Basic use

First, add an import to your code:

import 'package:some_calendar/some_calendar.dart';

Setting Locale

First, add an import to your code:

import 'package:intl/intl.dart';
import 'package:intl/date_symbol_data_local.dart';

  @override
  void initState() {
    initializeDateFormatting();
    Intl.systemLocale = 'en_En'; // to change the calendar format based on localization
    super.initState();
  }

with dialog

Single Mode, add to your code:

    showDialog(
        context: context,
        builder: (_) => SomeCalendar(
          mode: SomeMode.Single,
          isWithoutDialog: false,
          selectedDate: selectedDate,
          labels: new Labels(
              dialogDone: 'Selesai',
              dialogCancel: 'Batal',
              dialogRangeFirstDate: 'Tanggal Pertama',
              dialogRangeLastDate: 'Tanggal Terakhir',
          ),
          startDate: Jiffy().subtract(years: 3),
          lastDate: Jiffy().add(months: 9),
          done: (date) {
            setState(() {
              selectedDate = date;
              showSnackbar(selectedDate.toString());
            });
          },
        ));

Multi Mode, add to your code:

    showDialog(
        context: context,
        builder: (_) => SomeCalendar(
          mode: SomeMode.Multi,
          startDate: Jiffy().subtract(years: 3),
          lastDate: Jiffy().add(months: 9),
          isWithoutDialog: false,
          selectedDates: selectedDates,
          viewMode: ViewMode.Edit,
          done: (date) {
            setState(() {
              selectedDates = date;
              showSnackbar(selectedDates.toString());
            });
          },
        ));

Range Mode, add to your code:

    showDialog(
        context: context,
        builder: (_) => SomeCalendar(
          mode: SomeMode.Range,
          startDate: Jiffy().subtract(years: 3),
          lastDate: Jiffy().add(months: 9),
          selectedDates: selectedDates,
          isWithoutDialog: false,
          viewMode: ViewMode.Edit,
          primaryColor: Colors.red,
          done: (date) {
            setState(() {
              selectedDates = date;
              showSnackbar(selectedDates.toString());
            });
          },
        ));

SomeMode

SomeMode
Range
Single
Multi

Parameters

parameter types defaultValues
primaryColor color Color(0xff365535)
textColor color Colors.black
selectedDate Date Date.now()
selectedDates Date[] Date.now() + 4 days
isWithoutDialog bool true
scrollDirection Axis Axis.vertical
startDate Date
lastDate Date
mode SomeMode
viewMode ViewMode ViewMode.Edit

some-calendar's People

Contributors

agryva avatar digit81 avatar lima21 avatar zlhz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

some-calendar's Issues

Wrong format when working with small device width

Testing on a simulator with a screen size of 480 x 800
The calendar simply shows overlapping context all over. numbers consistent of 2 digits are shown vertically instead of horizontally.

some_calendar: ^1.2.6

Screenshot:
Screenshot_1601482349

Change the firstDayOfWeek

I would like to change the first day of the week from Monday to Sunday. I see in the documentation there is a SomeWeekLabel constructor that includes firstDayOfWeek but I'm not sure how to implement it. Any help would be appreciated.

i18 isn't supported?

I want to have custom translations for days/month labels and this package as I understood requires some additional improvements for that?

selected dates are not updating when i get from server

Hello @agryva

SomeCalendar(
mode: SomeMode.Multi,
startDate: Jiffy().subtract(years: 3),
lastDate: Jiffy().add(months: 9),
selectedDates: selectedDates,
done: (date) {
setState(() {
selectedDates = date;
showSnackbar(selectedDates.toString());
});
},
onTapFunction: (selectedDate) {
print(selectedDate);
},
));

  • I get 'selected dates' from server,when i got these dates and set it to the calendar, with setState(){};
    It did not update the UI. Please also guide me that how can i remove selected date from the list when i tap on that date, If it is already selected

  • I don't want to show it as dialog

Thanks

Duplicate dates with empty view on last day fo month

Describe the bug
I am trying to select a single / range from the view on the last day of the month. While opening the calendar view 30th June is duplicated in all rows and selected by default and other dates are simply empty.

Please see the attached screenshot.
Screenshot_1593546219

When I tried to scroll to the next month all looks good.
Screenshot_1593546239

Here is the code I am trying to open the calendar view;

void _displayDateRangePicker(BuildContext context, TravelState state) async {
    print('show date picker');

    DateTime _startDate = DateTime.now();
    DateTime _endDate = DateTime.now().add(Duration(days: 180));

    showDialog(
        context: context,
        builder: (_) => SomeCalendar(
              mode:
                  (state.tripType is OneWay) ? SomeMode.Single : SomeMode.Range,
              isWithoutDialog: false,
              selectedDate: _startDate,
              startDate: _startDate,
              lastDate: _endDate,
              labels: Labels(
                  dialogRangeFirstDate: 'Departure Date',
                  dialogRangeLastDate: 'Return Date',
                  dialogDone: 'Ok'),
              scrollDirection: Axis.horizontal,
              primaryColor: AppColors.primary,
              done: (date) {
                print(date.toString());
                if (date is DateTime) {
                  _travelBloc.add(TravelEventSelectSingleDate(date));
                } else if (date is List) {
                  _travelBloc.add(TravelEventSelectDateRange(date));
                }
              },
            ));
  }

I am not sure If I am doing something wrong or it's a library issue. Please try to provide clarity on this. Overall the library is good and I'd to use this for my app.

Smartphone (please complete the following information):

  • Device: Android

Additional context
Add any other context about the problem here.

兼容不了最新的核心库

Because some_calendar >=1.2.3 depends on intl ^0.16.0 and every version of flutter_localizations from sdk depends on intl 0.17.0-nullsafety.2, some_calendar >=1.2.3 is incompatible with flutter_localizations from sdk.

So, because butler depends on both flutter_localizations any from sdk and some_calendar ^1.2.6, version solving failed.
pub get failed (1; So, because butler depends on both flutter_localizations any from sdk and some_calendar ^1.2.6, version solving failed.)
exit code 1

Clear default dates in range and multiple picker.

when passing an empty list to some-calendar you select the
default dates value(DateTime.now()+4 days).I want to clear the default selected dates.
and let User select dates.
To Reproduce
Steps to reproduce the behavior:
1.SomeCalendar(
primaryColor: Color(0xff5833A5),
mode: SomeMode.Multi,
scrollDirection: Axis.vertical,
isWithoutDialog: true,
selectedDates: selectedDates,
selectedDate: selectedDate,
startDate: Jiffy().subtract(years: 3),
lastDate: Jiffy().add(months: 9),
done: (date) {},
),

1

Incorrectly labeled days of month

Describe the bug
November 2020 has two 1st's

To Reproduce
Steps to reproduce the behavior:

  1. Clone master
  2. Flutter pub get
  3. Flutter run (example)
  4. Select any calendar method
  5. Scroll to November 2020
  6. Sunday is correctly labeled as the 1st, Monday the 2nd is incorrectly labeled as the 1st as well shifting the entire month off my 1 day

Expected behavior
Days of the month should never repeat within the same month.

Screenshots
Simulator Screen Shot - iPhone 11 - 2020-07-08 at 08 43 49

Smartphone:

  • Device: iPhone11 Simulator
  • OS: iOS13.5

Additional context
Flutter Channel master, 1.20.0-2.0.pre

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.