flutter

flutter table calendar

햎피 2022. 5. 31. 10:44
반응형

플러터에서 달력을 사용하기 위한 대표적인 패키지가 두가지 있다. table calendar와 table carousel이다.

나는 table calendar를 사용했다. 원하는대로 ui를 바꾸기 위해서 깃헙에 들어가서 소스코드를 다 뜯어보는데 하루가 걸렸다..

코딩실력 더 늘려야지..ㅠ

 

아래는 table calendar 깃헙주소다.

https://github.com/aleksanderwozniak/table_calendar

 

GitHub - aleksanderwozniak/table_calendar: Highly customizable, feature-packed calendar widget for Flutter

Highly customizable, feature-packed calendar widget for Flutter - GitHub - aleksanderwozniak/table_calendar: Highly customizable, feature-packed calendar widget for Flutter

github.com

 

나는 이렇게 이벤트가 있는 곳에 하늘색으로 색칠하고 싶었다. 대부분의 예제들이 이벤트 있는곳에 띠를 두르는 그런 것들이라 소스코드를 뜯어봐야만 했다..

calendarBuilders:
                CalendarBuilders(markerBuilder: (context, date, dynamic event) {
              if (event.isNotEmpty) {
                return Container(
                  width: 35,
                  decoration: BoxDecoration(
                      color: Colors.blue.withOpacity(0.2),
                      shape: BoxShape.circle),
                );
              }
            }),

 

TableCalendar 안에 calendarbuilder를 넣어주면 된다.

그리고 calendarbuilder 안에서 singlemarkerbuilder를 사용하니까 아무런 표시가 없어서 markerBuilder를 사용해야했다.

if 문으로 event가 존재하는지 안하는지 체크를하고, event가 존재하면 container를 리턴해주면 된다.

반응형

'flutter' 카테고리의 다른 글

flutter int to bool  (0) 2022.06.01
flutter error - Error launching application on sdk gphone64 arm64  (0) 2022.06.01
Flutter Quill text editor  (0) 2022.05.27
flutter type 확인하기  (0) 2022.05.04
Get 과 Post의 차이  (0) 2022.05.04