꾸준히 가야돼! "Rx를 기깔나게 쓰는 신입개발자 도전" 🚀

---

결과물

이번에 api통신을 통해 결과 데이터가 없을때, 테이블뷰 backgroundview에 label을 띄어주는 기능을 추가하였다.

설계 요구사항

1. view에는 label이 있고, 중앙에 위치한다.
2. api통신 결과, 데이터가 empty 일때 1번의 view가 보여지게 한다.

tableview 의 backgroundview

• backgroundview 속성을 이용해 구현해보았다.

코드

- ViewModel : backgroundView

ViewModel에 다음과 같은 코드를 추가하였다.

struct BoxOfficeBackGroundViewModel {
    //list에 데이터가 없으면 보여지고 있으면 숨겨지고
    //viewModel -> view
    let isNoticeEmptyLabelHidden : Signal<Bool>
    
    // 외부에서 전달받을 값
    let shouldHideNoticeEmptyLabel = PublishSubject<Bool>()
    
    init() {
        isNoticeEmptyLabelHidden = shouldHideNoticeEmptyLabel
            .asSignal(onErrorJustReturn: true)
    }
}

• api 통신을 통해 받아온값의 empty 여부에 따라, isHidden 속성을 변경할 것이기에, Bool 타입으로 선언하였다.
• shouldHideNoticeEmptyLabel: api 통신후 데이터가 비어있는지 아닌지의 bool 값을 bind할 역할
• isNoticeEmptyLabelHidden : viewModel -> view 로 전달하는 역할

- ViewModel : boxOfficeViewModel

//apiData 없으면 background view label hidden 제거
apiData.map { !$0.isEmpty }
.bind(to: backGroundViewModel.shouldHideNoticeEmptyLabel )
.disposed(by: disposeBag)

boxOfficeViewModel에서 PublishSubject<[BoxOfficeList]>인 apiData 를 map 연산자를 통해 empty 여부로 변환하였다.
그리고 backGroundViewModel의 PublishSubject인 shouldHideNoticeEmptyLabel와 bind하였다.

그결과, 데이터가 비어있다면 shouldHideNoticeEmptyLabel에게로 false가 전달이 될것이다.

- view

view의 bind함수 내에서, 다음과 같이 구현할 수 있다.

    func bind(_ viewModel : BoxOfficeBackGroundViewModel) {
        //뷰모델에서 가져온 isStatusLabelHidden값을 rx.isHidden과 연결
        viewModel.isNoticeEmptyLabelHidden
            .emit(to: noticeEmptyLabel.rx.isHidden)
            .disposed(by: disposeBag)
    }

viewModel의 isNoticeEmptyLabelHidden의 값과 noticeEmptyLabel.rx.isHidden을 연결하였다.

viewModel에서 shouldHideNoticeEmptyLabel에게 false가 전달이 되었다면, isNoticeEmptyLabelHidden의 값은 Signal 가 된다.
그리고 이를 view의 bind함수 내에서 noticeEmptyLabel.rx.isHidden 속성과 연결해주면, 데이터가 없을때 noticeEmptyLabel.rx.isHidden에게 false가 전달이 되고, backgroundview의 label이 보여질 것이다.

그리고, 데이터가 empty가 아니라면, 이와 반대로 label이 hide될것이다.