Login Validation (simple..) RxSwift 구현

 

오늘 구현해본 기능은 RxSwift 를 사용해서 기본적인 로그인 Validation.

위 아래 textField 는 각각 email, password 를 의미한다고 했을 때,

 

두 텍스트가 일정 조건을 맞춰주면 Login Button 이 빨간색으로 바뀌는 식으로 만들어주었다. 

 

구현 방식은 BehaviorRelay 를 이용해서 각 TextField 의 값을 emailRelay,

passwordRelay 에 넣어주고, 

 

combineLatest 를 이용해서 두 relay 값을 받은 후 특정조건을 넣는 식으로 구현하였다.

	// -------------- inside ViewController ---------------- //     
    private let emailRelay = BehaviorRelay<String>(value: "")
    private let passwordRelay = BehaviorRelay<String>(value: "")
    
    
    // -------------- inside func setupBindings() ------------ // 
        emailTF.rx.text.orEmpty
            .subscribe(onNext: { [weak self] text in
                guard let self = self else { return }
                let newText = self.emailRelay.value + text
                self.emailRelay.accept(newText)
            })
            .disposed(by: bag)
        
        // better way
        passwordTF.rx.text.orEmpty
            .bind(to: passwordRelay)
            .disposed(by: bag)
            
            
            
            
        Observable.combineLatest(emailRelay, passwordRelay)
            .map { (email, password) -> Bool in
                if email != "" && password.count >= 8 {
                    return true
                }
                return false
            }
            
            .observe(on: MainScheduler.instance)
            .subscribe(onNext: { [weak self] isvalid in
                guard let self = self else { return }
                if isvalid {
                    self.loginBtn.backgroundColor = .red
                } else {
                    self.loginBtn.backgroundColor = .gray
                }
            })
            
            // better way..
//            .asDriver(onErrorJustReturn: false)
//            .drive(onNext: { [weak self] isvalid in
//                guard let self = self else { return }
//                if isvalid {
//                    self.loginBtn.backgroundColor = .red
//                } else {
//                    self.loginBtn.backgroundColor = .gray
//                }
//            })

            
            .disposed(by: bag)

emailTF.rx.text.orEmpty 에서, 

rx.text 까지는 ControlProperty<String?> 이지만, .orEmpty 를 더해주면 ControlProperty<String> 으로 형변환이 되어 이때가 되어서야 이미 만들어놓은 BehaviorRelay<String> 값에 넣어질 수 있다. 

BehaviorRelay Type 을 String? 으로 만들면 넣을 수 있기야 하겠지만 형변환을 나중에 계속 해줘야 하므로 .orEmpty 를 추가해주는게 이 경우에는 맞다.

 

 

onNext 등에서 thread 를 main 으로 바꾸어 일정 기능을 수행해야 하는 경우 (UI 바꿀 때) .observe(one: MainScheduler.instace) 를 이용하거나, driver 로 바꿔준 후에 .drive(onNext ... ) 를 쓰면 편리하다. 

Driver 의 특징은 아래 세가지가 있다. (RxCocoa -> Driver 에서 따옴) 

 

it never fails (에러가 안난다)

it delivers events on MainScheduler.instance (Main Thread 에서 실행한다.) 

share(replay: 1, scope: .whileConnected) sharing strategy ( share 를 제공한다. 따라서 여러 곳에서 해당 Driver 를 사용 가능 )

 

 

 

 

이번 구현에서 느낀 점은, Rx가 꽤 편리하다는 것. 

Data Binding 으로서도 구현할 수 있는 내용들이지만, 워낙 손이 많이 가기도 하고, Binding 을 사용하지 않으면 두 TextField 에 하나하나 delegate 을 설정하고, 각 delegate func 에서 조건을 맞춰주어야 하기때문에 이 경우에도 손이 많이 간다.

 

변수를 두개정도만 쓰는 경우라면 일일이 구현할수도 있겠지만 그 이상이라면 RxSwift 를 쓰지 않을 이유가 없을 것 같다.