[플러터로 달력만들기] #4. 오늘일 경우에만 스타일 주기

2022. 10. 5. 22:17Flutter

반응형

이번에는 오늘 날짜에만 스타일을 다르게 줘보려고 한다.

 

먼저 컨트롤러에 오늘 날짜인지를 확인하기 위한 함수를 만들어보자

  // 오늘인가?
  isToday(int year, int month, int day) {
    if (year == DateTime.now().year && month == DateTime.now().month && day == DateTime.now().day) {
      return true;
    }
    return false;
  }

오늘일 경우에만 true를 리턴하는 isToday함수를 작성했다.

 

이를 calender.dart에서 사용해보겠다.

  SizedBox(
                width: 350,
                child: Wrap(
                  children: [
                    for (var i = 0; i < controller.days.length; i++)
                      Container(
                        padding: EdgeInsets.symmetric(vertical: 10),
                        width: 30,
                        margin: EdgeInsets.symmetric(horizontal: 10, vertical: 2),
                        decoration: BoxDecoration(
                          color: controller.isToday(controller.days[i]["year"], controller.days[i]["month"], controller.days[i]["day"]) ? Colors.blueGrey : null,
                        ),
                        child: Center(
                          child: Text(
                            controller.days[i]["day"].toString(),
                            style: TextStyle(
                              color: controller.isToday(controller.days[i]["year"], controller.days[i]["month"], controller.days[i]["day"])
                                  ? Colors.white
                                  : controller.days[i]["inMonth"]
                                      ? Colors.black
                                      : Colors.grey,
                            ),
                          ),
                        ),
                      ),
                  ],
                ),
              )

isToday가 true일 경우 바탕색과 글자색을 따로 지정해주었다.

 

오늘 날짜만 스타일이 다르게 적용된 걸 확인할 수 있다

반응형