A real Flutter enthusiast, but at the same time really keen on frontend development like React, and also on backend like .NET.
-
๐ฌ Ask me about Flutter
-
๐ซ How to reach me [email protected]
-
โก Fun fact Football, Magic tricks, and Trading.
Flutter package to manage online bookings
License: MIT License
๐ฌ Ask me about Flutter
๐ซ How to reach me [email protected]
โก Fun fact Football, Magic tricks, and Trading.
how to add finished slot and its color??
Hello, I had few problem by trying to install the booking calendar to my app. Could someone help me out please..
Thank you :)
I want to have different timeslots for different time of the day. Like for Monday my time can be from 9AM TO 4PM but for tuesday my time could be 2Pm to 5PM. Secondly, Can I give a 10 min gap between eachtime slot.
Hi,
starting from your example code I'm trying to setup a service with a duration of 1h and the slots should be every day like:
00:00, 01:00, 02:00 ... 23:00
(so, 24 slots with a duration of 1 hour every day)
Currently the last time-slot is 22:00 instead of 23:00. I've tried any combination for bookingStart and bookingEnd. What am I doing wrong? I've seen in your gif that it must be possible to have slots like 23:00 or 23:30. Here is my code so far:
...
class _AddRentalState extends State {
final now = DateTime.now();
late BookingService mockBookingService;
@OverRide
void initState() {
super.initState();
mockBookingService = BookingService(
serviceName: 'CarRental',
serviceDuration: 30,
bookingEnd: now.endOfDay,
bookingStart: now.startOfDay);
}
Thanks in advance!
....
i would like to have more control over each day of week
Hey man! I've noticed a bug when trying to make a booking on saturday or sunday. The calendar switches to monday but the booked date stays on saturday or sunday. Example: Today is sunday (11.12.2022.), on the calendar the selected day is monday, but when i submit my booking the booked date is 11.12.2022., it doesn't switch to monday (12.12.2022.). Saturdays and sundays are disabled. Everything else works perfectly. :)
List convertStreamResultFirebase(
{required dynamic streamResult}) {
///here you can parse the streamresult and convert to [List]
///Note that this is dynamic, so you need to know what properties are available on your result, in our case the [SportBooking] has bookingStart and bookingEnd property
List converted = []
for (var i = 0; i < data.size; i++) {
final item = data.docs[i].data();
converted.add(DateTimeRange(start: (item.bookingStart!), end: (item.bookingEnd!)));
}
return converted;
}
In this snippet of code provided in the Firebase example, I want to know where data.size comes from.
I am having issues finding a way to apply this function in my code
I am a beginner.
I'm trying to make a library reservation app, so I have to support multiple selections, but I don't know how to do it no matter how hard I look
Hey man, i really like your package! Is there a way to disable weekends (saturday and sunday) so the user can't pick those days? If i use pause slots for every weeknd that's a bit tedious lol :)
When we select week, it displays calendar for 2 week. On selecting 2 week it displays calendar for month. On selecting month, it displays 1 week.
Please correct this.
Regards,
Ankur
loadingWidget param does not override my custom loading widget, it keeps showing me the fancy loading.
Hi! I'm trying to implement your work to my project, and I've followed the example you give of Google Firebase with SportBooking. But there is something that I can't make sense of right now (maybe sleeping too little lol).
In the factory method factory SportBooking.fromJson(Map<String, dynamic> json) => _$SportBookingFromJson(json);
What does _$SportBookingFromJson
mean? I can't find it declared in your example or anywhere else, and I would like to know how to declare it so that everything works.
Also, I can't find a way to instance ApiRepository
, and I can't find it to be a dependency. I would like to know what it refers to, if it is necessary or if I should implement it myself.
Thanks for your patience!
While installing this library am getting null safety issue
Because google_maps_place_picker >=2.0.0-nullsafety.0 depends on provider ^5.0.0 and every version of booking_calendar depends on provider ^6.0.2, google_maps_place_picker >=2.0.0-nullsafety.0 is incompatible with booking_calendar.
So, because home_services depends on both google_maps_place_picker ^2.1.0-nullsafety.3 and booking_calendar any, version solving failed.
Can you please update the customize success screen data?
Translate calendar.
The custom widget you guys have done is great, but unfortunately I'm not very good with flutter and had trouble connecting the widget with my firebase database and displaying its data + creating documents for new bookings.
I was wondering if you could share the flutterflow project from the firebase example so we can exactly replicate the widget and action you made in the firebase example.
It would be really helpful as I've been trying to put together the widget code for days and just haven't hit the nail.
Thanks in advance.
Hi,
for the "model we store in the Firebase" I need to put it in the SportBooking.dart , right?
Hi I am new to flutter and would like to know how you would get data from a DB such that it would update the booking slots if they are already booked? Would I have to create an initial get request and update the BookingService data in the initState function?
lot of new people here trying to use booking calendar. is there someone show example of connect to firebase
I am a beginner to flutter and I am trying to polish my skills through building a slot booking app.
Almost everything is going good so far and have implemented everything successfully, but after clicking on Book button my successful screen closing very quickly. Not sure how to stay on that screen until user tap on Go To Home Button.
Current issue is that the card does not support dark theme mode
Thanks for this awesome package.
I need to adjust the Button Text for above TextButton to change from default values to custom values.
Thank you very much if you could add this feature in any further versions.
Currently i adjust the package which is bad practise.
i would like to have a max date in the calander where the user cant visit mor than one more month for example
Because flutter_bloc >=7.2.0 depends on provider ^6.0.0 and booking_calendar >=1.0.1 depends on provider ^5.0.0, flutter_bloc >=7.2.0 is incompatible with booking_calendar >=1.0.1.
So, because my_app depends on both booking_calendar ^1.1.1 and flutter_bloc ^8.0.0, version solving failed.
Hi! I checked your awesom package that i was searching for a while, its good but i am having some issues with the start time and end. Your help would mean alot. Thanks in Advance.
Here is the code:
mockBookingService = BookingService(
serviceName: 'Mock Service',
serviceDuration: 30,
bookingEnd: DateTime(now.year, now.month, now.day, 18, 0),
bookingStart: DateTime(now.year, now.month, now.day, 8, 0));
It show slots from 00:00 to 23:30 and i want from 08:00 to 18:00.
I enter pubdev and copy the example in the example section of the package but every time I run it I get this 2 error : Error the method "read" isn't defined for the class buildcontext Function() , buildcontext Is from framework.dart, controller= context.read.();
The second: Error The argument type 'Buildcontext Function ()' can't be assigned to the parametr type 'Buildcontext', buildcontext Is from framework.dart,
?.call(context,day,event)??
I updated flutter, and I need to use intl latest version.
Because project depends on booking_calendar 1.1.9 which depends on intl ^0.17.0, intl ^0.17.0 is required.
So, because project depends on intl ^0.18.0, version solving failed.
/C:/src/flutter/.pub-cache/hosted/pub.dartlang.org/booking_calendar-1.1.4/lib/src/components/booking_calendar_main.dart:174:29: Error: A value of type 'Set' can't be assigned to a variable of type 'Widget'.
The app only runs if the if-statement from line 174 is removed, but then I cant hide the break
i really desperate to implement my firebase in this project. ill pay you if i could ahhahaha
This package is amazing.
Unfortunately, it's not well compatible with flutter 3 and it's throwing this warning:
Referring to this comment it's mentioned that they are warnings but in my case, my app doesn't build at all.
/opt/homebrew/Caskroom/flutter/3.0.1/flutter/.pub-cache/hosted/pub.dartlang.org/provider-5.0.0/lib/src/inherited_provider.dart:391:26: Warning: Operand of null-aware operation '!' has type 'SchedulerBinding' which excludes null.
- 'SchedulerBinding' is from 'package:flutter/src/scheduler/binding.dart' ('/opt/homebrew/Caskroom/flutter/3.0.1/flutter/packages/flutter/lib/src/scheduler/binding.dart').
package:flutter/โฆ/scheduler/binding.dart:1
SchedulerBinding.instance!.addPostFrameCallback((_) {
^
I am unable to find a way to change the start and end hours for each day for example on a Monday an employee may start at 9am and finish at 4pm but on a Tuesday they may start at 11am and finish at 6am is there a way to dynamically change the hours depending on when an employee works? At the minute it seems to be statically set when loading the view
If all the open slots for a day are booked, I dont want the day to be disabled. Is this possible?
Let the programmer handle the loading state.
It is preferable if the programmer click the book button we just have to pass the value that customer choose.
Hi!
I would like to implement a calendar, which allows to book only entire days. Right now, I just set the time slot to be long enough, but I still have a slot that says, e.g., 8am.
Would it be possible to omit the slots (since only entire days are booked) or to at least change the title of the slot?
Would be nice to include further documentation on firebase compatibility
: Error: Required named parameter 'vsync' must be provided. ../โฆ/src/table_calendar_base.dart:192 return AnimatedSize( ^ : Context: Found this candidate, but the arguments don't match. ../โฆ/widgets/animated_size.dart:56 const AnimatedSize({ ^^^^^^^^^^^^
Whats the best way to call the date/time that is picked so I can save it?
This method doesnt seem to be working:
@OverRide
Widget build(BuildContext context) {
return BookingCalendar(
convertStreamResultToDateTimeRanges: convertStreamResultMock,
getBookingStream: getBookingStreamMock,
uploadBooking: uploadBookingMock,
bookingService: mockBookingService,
pauseSlots: pauseSlots,
disabledDays: [4, 7], // 4 represents Thursday, 0 represents Sunday
bookingButtonColor: Color(0xFF4B39EF),
dayPicker: (dayPickerController) {
return BookingCalendar.dayPicker(
controller: dayPickerController,
onSelected: (date) {
setState(() {
_selectedDate = date;
});
uploadBookingMock(newBooking: mockBookingService);
},
);
},
);
}
Future uploadBookingMock({required BookingService newBooking}) async {
if (_selectedDate != null) {
widget.datePicked = _selectedDate;
// Add a new document to the "appointments" collection with the timestamp of the day/time selected
await FirebaseFirestore.instance.collection('appointments').add({
'appointmentTime': Timestamp.fromDate(widget.datePicked),
});
}
}
}
Hello,
Could you help me to use this to connect to a database (not firebase), to get and stream bookings please. I tried but without success
Thank you !!
Hi! This is not a issue but it would be nice to have ability to disable time, lets say between 12-13 for lunchbreak and show some icon or disable all slota between that time.
Using the website example: https://pub.dev/packages/booking_calendar/example
Generates the error:
โโโก EXCEPTION CAUGHT BY WIDGETS LIBRARY โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
The following LocaleDataException was thrown building CalendarHeader(dirty):
Locale data has not been initialized, call initializeDateFormatting().
The relevant error-causing widget was:
CalendarHeader
CalendarHeader:file:///home/kratos/.pub-cache/hosted/pub.dev/table_calendar-3.0.9/lib/src/table_calendar.dart:456:22
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.