Flutter 체크박스 구현 하기

 

 

오늘은 저 체크박스를 구현하여 자동로그인에 관련한 것을 구현해보고자 한다. 

아래는 StatelessWidget 으로 구현 되는 Checkbox class 예시이다. Onchanged 콜백함수를 통해 값을 다시 지정해준다. 

Checkbox class - material library - Dart API

 

 

하지만 나는 StatelessWidget 으로 구현 할 것이다. 기본 로직은 똑같음! 

 Container(
                                  width: deviceWidth,
                                  height: deviceHeight * 0.05,
                                  child: Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.center,
                                      crossAxisAlignment:
                                          CrossAxisAlignment.center,
                                      children: [
                                        Obx(() {
                                          return Checkbox(
                                            materialTapTargetSize:
                                                MaterialTapTargetSize
                                                    .shrinkWrap,
                                            activeColor: isDarkMode
                                                ? dBtnColor
                                                : mBaseColor,
                                            checkColor: Colors.white,
                                            side:
                                                BorderSide(color: mMediumGray),
                                            value:
                                                _controller.isAutoLogin.value,
                                            onChanged: (bool? value) {
                                              _controller.isAutoLogin.value =
                                                  value!;
                                            },
                                          );
                                        }),
                                        Text(
                                          '자동 로그인',
                                          style: TextStyle(
                                            color: mMediumGray,
                                            fontWeight: FontWeight.bold,
                                            fontSize: textSizeSmall2,
                                          ),
                                        ),
                                      ])),