[iOS] RxSwift - 응용해보기

🙉 RxSwift

❌ Rx가 없이 UI 설계

텍스트 필드 델리게이트를 잡음

텍스트 체인지 이벤트를 받고

패스워드나 아이디 분기를 잡고

valid 체크하고 true false를 통해 hidden 을 on off 함

둘다 valid 맞으면 버튼을 hidden off

⭕️ Rx를 사용해 UI 설계

데이터가 필요한데 나중에 데이터를 줄 때 비동기 사용

아이디랑 비밀번호를 눌렀을 때 값을 나중에 주니까 비동기로 처리가능

스트림에 클릭이벤트, 텍스트 체인지 이벤트를 넣고 서브스크라입에 전달됨

UI 이벤트가 처리되는 것도 비동기로 처리

⭐️ 응용

첫 코딩

private func bindUI() {

	idField.rx.text
	//	.filter{ $0 != nil }
	//	.map{ $0! }
		.orEmpty
		.map(checkEmailValid)
		.subscribe(onNext: { b in 
			self.idValidView.isHidden = b
		})
		.disposed(by: disposeBag)

	pwField.rx.text
	//	.filter{ $0 != nil }   
	//	.map{ $0! }            
		.orEmpty
		.map(checkPasswordValid)
		.subscribe(onNext: { b in 
			self.pwValidView.isHidden = b
		})
		.disposed(by: disposeBag)
		

	Observable.combineLatest( // 다양한 메소드가 있다. merge, zip 등등 , 이것들중 여기에 제일 어울리는 것은 combineLatest
		idField.rx.text.orEmpty.map(checkEmailValid),
		pwField.rx.text.orEmpty.map(checkPasswordVaild),
		resultSelector: { s1, s2 in s1 && s2 } // 먼저 내려온 선착순으로 s1, s2 결정
	)  
		.subscribe(onNext : { b in 
			self.loginButton.isEnabled = b
		})
		.disposed(by : disposeBag)
		
}

리팩토링 (중복 제거)

private func bindUI() {

	let idInputOb = idField.rx.text.orEmpty.asObservable() // 명확하게 하기 위한 asObservable()
	let pwInputOb  = pwField.rx.text.orEmpty.asObservable()

	let emailValidOb = idInputOb.map(checkEmailValid)
	let pwValidOb = pwInputOb.map(checkPasswordValid)

	idValidOb
		.subscribe(onNext : {b in self.idValidView.isHidden = b})
		.disposed(by: disposeBag)
	
	pwValidOb
		.subscribe(onNext : {b in self.idValidView.isHidden = b})
		.disposed(by: disposeBag)

	Observable.combineLatest(idValidOb, pwValidOb, resultSelector : {$0 && $1})
		.subscribe(onNext : {b in self.loginButton.isEnable = b})
		.disposed(by: disposeBag)

}

⭐️ Subject

• AsyncSubject
  • 끝이나면 마지막에 있는 데이터만 넘겨준다.
• BehaviorSubject
  • 디폴트 값이 있음, 이 값을 넣고 시작함
  • Subscribe하던 도중 에러가 발생하면 다른 subscribe에도 에러를 발생시킴
• PublishSubject
  • 디폴트 값이 없음
• ReplaySubject
  • 중간에 subscribe을 하면 전에 했던 데이터를 다 넘겨주고 그다음 넘겨준다.

subject 는 데이터를 넣어줄 수도 있고 Subscribe 해줄 수도 있는 친구다.

// 함수 밖에 Subject 를 생성함

let idValid : BehaviorSubject<Bool> = BehaviorSubject(value: false)
let idInputText : BehaviorSubject<String> = BehaviorSubject(value: "")
let pwValid : BehaviorSubject<Bool> = BehaviorSubject(value: false)
let pwInputText : BehaviorSubject<String> = BehaviorSubject(value: "")

private func bindInput() {
/* ---------id---------- */

	// let idInputOb = idField.rx.text.orEmpty.asObservable() // 명확하게 하기 위한 asObservable()
	// let idValidOb = idInputOb.map(checkEmailValid)
	
	// Subject에 값 넣어주는 법 1
	// idValidOb.subscribe(onNext : { b in 
	//	 self.idValid.onNext(b)
	// })

	// Subject에 값 넣어주는 법 2
	// idValidOb.bind(to : idValid)

	// Subject 적용시 - idText 내보내기 
	idField.rx.text.orEmpty
			.bind(to : idInputText)
			.disposed(by: disposeBag)

	// Subject 적용시 - idValid 내보내기 
	idField.rx.text.orEmpty        // <- 여기다가 위에서 idText를 내보낸 subject 를 넣어줄 수 있다. (idInputText)
			.map(checkEmailValid)      // 이메일 체크한 결과를
			.bind(to: idValid)         // 밖에 외부에 idValid라고 하는 데이터 스트림에 담은것임.
			.disposed(by: disposeBag)

/* ---------pw---------- */

	// let pwInputOb  = pwField.rx.text.orEmpty.asObservable()
	// let pwValidOb = pwInputOb.map(checkPasswordValid)

	// Subject에 값 넣어주는 법 1
	// pwValidOb.subscribe(onNext : { b in 
	//	 self.pwValid.onNext(b)
	// })

	// Subject에 값 넣어주는 법 2
	// pwValidOb.bind(to : pwValid)

	// Subject 적용시 - pwText 내보내기 
	pwField.rx.text.orEmpty
			.bind(to : idInputText)
			.disposed(by: disposeBag)

	// Subject 적용시 - idValid 내보내기 
	pwField.rx.text.orEmpty        // <- 여기다가 위에서 pwText를 내보낸 subject 를 넣어줄 수 있다. (pwInputText)
			.map(checkPasswordValid)      // 이메일 체크한 결과를
			.bind(to: pwValid)         // 밖에 외부에 idValid라고 하는 데이터 스트림에 담은것임.
			.disposed(by: disposeBag)

}

private func bindOutput() {
	idValid
		.subscribe(onNext : {b in self.idValidView.isHidden = b})
		.disposed(by: disposeBag)
	
	pwValid
		.subscribe(onNext : {b in self.idValidView.isHidden = b})
		.disposed(by: disposeBag)

	Observable.combineLatest(idValid, pwValid, resultSelector : {$0 && $1})
		.subscribe(onNext : {b in self.loginButton.isEnable = b})
		.disposed(by: disposeBag)
}

input 과 output가 분리될 수 있었던 이유는 subject를 통해서 바깥으로 끄집어 낼 수 있었기 떄문이다.

bind 를 보니 SwiftUI 에 Binding이랑 조금 비슷한거 같기도…

Ref

https://www.youtube.com/watch?v=w5Qmie-GbiA&list=PL03rJBlpwTaAh5zfc8KWALc3ADgugJwjq&index=1

https://reactivex.io/documentation/ko/observable.html