How To Create A Flutter Table Calendar In Just 5 Minutes!

Рет қаралды 55,611

Жыл бұрын

This tutorial shows you how to create a highly customisable table calendar in your flutter application. For more information about the table calendar flutter package, please visit pub.dev.com for details.
Buy me a coffee 🧑‍💻 : www.buymeacoffee.com/ngjunya8
If you enjoyed this video be sure to give it a like and subscribe for more!
ChatGPT: Here's how to get a job at Google, Meta, Tesla ...
• 5 Tips to get a job at...
ChatGPT generates NFTs ! New Passive Income With ChatGPT !
• How to generate images...
I Lost $XXX after OpenAI's Secret Key LEAKED !!
• I Lost $XXX after Open...
Web Scraping using ChatGPT | Coded by ChatGPT
• How to create a Web Sc...
Flutter ChatGPT using OpenAI's GPT-3 | Flutter Chatbot
• Flutter ChatGPT using ...
How to Manage State Using Flutter GetX | Flutter State Management • GetX State Management ...
How to Manage State Using Flutter Provider | Flutter State Management • Flutter Provider State...
How to Solve Vertical viewport was given unbounded height | Flutter Common Error
• How to Solve Vertical ...
Installation & Configuration | Flutter Firebase Tutorial #1
• Installation & Configu...
Firebase RealTime Database (CRUD) | Flutter Firebase Tutorial #3
• Firebase RealTime Data...
How To Create A Flutter Table Calendar In Just 5 Minutes!
• How To Create A Flutte...
Dropdown in Flutter for creating flexible, reusable user interfaces
• Dropdown in Flutter fo...
Object-oriented Programming in Dart
• OOP Tutorials
Flutter Project Ideas
• Flutter Project Ideas
Flutter Package Tutorials
• Flutter Package Tutorials

Пікірлер: 54

@AIWithFlutter Жыл бұрын

Subscribe to our channel -----> tinyurl.com/ujuv8hmm

@ceyrpaxceyrpax6260 11 ай бұрын

I don't speak much English and I understand you perfectly, you explain the code and the configurations very well, thanks👍👍👍

@AIWithFlutter 11 ай бұрын

Welcome ! Appreciate that 🙏

@soyACHEE Жыл бұрын

Thanks for sharing, I see that now you talk more, great!

@shinystick241 11 ай бұрын

Best tutorial man, thanks brother!

@AIWithFlutter 11 ай бұрын

Welcome 🙏

@mrs.dj0019 10 ай бұрын

Thank you so much for sharing , So useful 🙏🏻

@AIWithFlutter 10 ай бұрын

Appreciate that 🙏

@mao3043 Жыл бұрын

Thank u for sharing. Helpful!

@AIWithFlutter Жыл бұрын

Welcome 🙏

@sakhildevan Жыл бұрын

can you do a video of firebase of the calender app

@unclebob5644 Жыл бұрын

Superb !!

@chaimamazouz5250 Жыл бұрын

So useful thanks 😊❤

@AIWithFlutter Жыл бұрын

Much appreciate ! 🙏

@JirolBikes Ай бұрын

how to disable selection of previous dates?

@rishabhsahu9163 9 ай бұрын

How to change the color of highlighted selected date?

@alifaditya1547 10 ай бұрын

thankyou sir, this vid really helpful

@AIWithFlutter 10 ай бұрын

Welcome ! Appreciate that 🙏

@udomdechkrub1921 Жыл бұрын

Great explanation.

@AIWithFlutter Жыл бұрын

Thanks 🙏

@soloplayerid Жыл бұрын

NOICE 🔥🔥

@plosk20 Жыл бұрын

Thank you very much

@AIWithFlutter Жыл бұрын

Welcome 🙏

@lilylim5031 6 ай бұрын

Hi, may I know how to I add a text below the header < November 2022>

@amal22555 9 ай бұрын

Hi Thanks for this tutorial, it is really helpfull. 😍 Please let me know how we can change the color for focused day and current day.

@AIWithFlutter 9 ай бұрын

Hi, thanks for your reply ! To change the color for focused day and current day, you have to modify it in calendarStyle parameter. Something like this. calendarStyle: CalendarStyle( todayDecoration: BoxDecoration( color: ColorSets.accent.withOpacity(0.5), shape: BoxShape.circle), selectedDecoration: BoxDecoration(color: ColorSets.accent, shape: BoxShape.circle), )

@xXxXxMrGamexXxXx Жыл бұрын

Nice video just i got a issue, when i get the day in console print the extactly day but when I try to save any event in my firebase collection if I pick the 1 Jan 2023, in firebase the day save is 31 dec 2022 someone know how to fix this?

@AIWithFlutter Жыл бұрын

Hi, I would suggest you to debug this issue by commenting out event from calendar and create a mock event data to save into your firebase collection on 1 Jan 2023. If it still saved on the wrong date, it means it's the firebase collection issue. Maybe you have to recreate the collection instance. If it saved correctly , it means the data passed to firebase collection was manipulated. Maybe you can print the data before pass into firebase collection. Thanks.

@rajattyagi6164 Жыл бұрын

hey, how can I change the background color of the table calendar as here initially showing white color in background i want green.

@techfauz Ай бұрын

Create a container with the color of your choice then use TableCalendar as your container child.

@TrikNgonlen Жыл бұрын

A W E S O M E !

@user-xe8vl9eh9l Жыл бұрын

Hi How can i format the date like i want only sep 6,2022 how can i get this kind of format , can anyone please help

@AIWithFlutter Жыл бұрын

DateFormat.yMMMd().format(DateTime.now()) This is the formatter to get the format that you stated. Just replace the DateTime.now() with the calendar date selected.

@mohammedabduraboal-haig9179 Ай бұрын

i got an error in line 49 , which _onDaySelected need to parameters what should i write

@shokhjahon_dev 27 күн бұрын

check documentation, maybe parameters changed

@eduardomassud7160 Жыл бұрын

Is there a quick way to jump between years? If I want a date 2 years from now, how can I go there without sliding a thousand times?

@AIWithFlutter Жыл бұрын

Hi 👋, for this table calendar package , currently it’s not possible yet to achieve your needs to jump between years. Probably you checkout native date picker to solve your problem.

@tanvirakon9104 Жыл бұрын

when i select a day at different month , it works but suddenly it slides and current month comes. it doesn't stay at random month after selecting, but it selects. please help

@AIWithFlutter Жыл бұрын

Hi, usually this happens because you set focusedDay to a static value (for example, DateTime.now()), so whenever the table calendar rebuilds (for example, selecting different month), it will reset the calendar back the the static value set. To prevent this from happening, you should store and update focusedDay whenever any callback exposes it. For example, you can store a var initialDate = DateTime.now(). Then set focusedDay to initialDate var. Most importantly, update the initialDate value in onPageChanged parameter. Something like this var initialDate = Datetime.now(); TableCalendar( focusedDate : initialDate; onPageChanged: (focusedDay) { initialDate = focusedDay; }, );

@istiakahmed3033 Ай бұрын

@@AIWithFlutter Thanks man. I was facing same issue. Now its solves seeing your solution

@user-xe8vl9eh9l Жыл бұрын

how can i display this calendar on click of button

@AIWithFlutter Жыл бұрын

Hi, you can checkout to the tutorial below about hiding flutter widget. kzfaq.info/get/bejne/fLllfbSh1ZjLm6c.html

@sallus449 Жыл бұрын

what about the range of dates if we want to select like first date and end date

@AIWithFlutter Жыл бұрын

Hi, unfortunately the table calendar package used in this tutorial is not able to select a range of dates. But we found another package that could do it ---> scrollable_clean_calendar. The team will try to create a tutorial for it. Thanks for your comment

@aouadicharaf1038 5 ай бұрын

❤❤❤

@AIWithFlutter 5 ай бұрын

🙏🙏🙏

@henryc3067 Жыл бұрын

Can you make a video on how to add events?

@AIWithFlutter Жыл бұрын

Hi 👋, yes of course. We will publish the tutorial as soon as possible.

@henryc3067 11 ай бұрын

@@AIWithFlutter Thank you, I''m honestly waiting everyday for this tutorial because the other tutorials and internet tutorials I've seen have been confusing. I'm new to coding and this is an important for the project i'm working on.

@AIWithFlutter 11 ай бұрын

@@henryc3067 Hi, we have uploaded add event to table calendar tutorial. Please let us know if you have any questions. We are more than willing to help. kzfaq.info/get/bejne/d7lzpsKYnbiuaac.html