Swift 커스텀뷰 만들어서 재사용하기 (UIButton)
세팅
링크 참고하여 만듬 https://medium.com/flawless-app-stories/reusable-uiviews-in-swift-3f9dca63eaf4
NextButton 이라는 View 클래스와 xib 파일 만들고
xib 에서 디자인 하고 , view에서 init 함수만 만들어준다.
그리고 nib을 클래스 이름과 맞춰 로드 해준다.
class NextButton: UIView {
@IBOutlet weak var nextButton: UIButton!
override init(frame: CGRect) {
super.init(frame: frame)
commonInit()
}
required init?(coder: NSCoder) {
super.init(coder: coder)
commonInit()
}
func commonInit(){
guard let view = loadViewFromNib() else {return }
self.addSubview(view)
}
func loadViewFromNib() -> UIView? {
let nib = UINib(nibName: "NextButton", bundle: nil)
return nib.instantiate(withOwner: self, options: nil).first as? UIView
}
}
사용
uiview를 불러온 다음 위치와 크기를 세팅하고
CustomClass -> class 를 아까 만든 NextButton 클래스로 지정해줌
에러1
Fatal error: Unexpectedly found nil while implicitly unwrapping an Optional value: file Code_Sketch/NextButton.swift, line 24
2021-04-21 10:58:05.125149+0900 Code-Sketch[69938:8817026] Fatal error: Unexpectedly found nil while implicitly unwrapping an Optional value: file Code_Sketch/NextButton.swift, line 24
NextButton 클래스에서 IBOutlet에 접근했었는데
이게 addSubview가 되기 전에 nil 인 관계로 접근을 할수 없었다.
addSubview 이후로 접근하여 에러 해결
에러2
Thread 1: EXC_BAD_ACCESS (code=2, address=0x16d737ff8)
해결
Files Owner 에도 class 를 지정해주고
UIView에도 Class를 지정해줬었는데 이것을 지우니까 해결됨
이벤트 설정
버튼에대한 터치 이벤트는 view 클래스에서 간단히 사용할수 있다.
@IBAction func onTouchDown(_ sender: UIButton) {
sender.isHighlighted = false
button.backgroundColor = UIColor(hexString: "45d6df")
button.tintColor = UIColor(hexString: "ffffff")
button.setTitleColor(UIColor(hexString: "ffffff"), for: .normal)
button.borderWidthV = CGFloat(0)
}
@IBAction func onTouchUp(_ sender: UIButton) {
button.backgroundColor = UIColor(hexString: "ffffff")
button.tintColor = UIColor(hexString: "158d95")
button.setTitleColor(UIColor(hexString: "158d95"), for: .normal)
button.borderWidthV = CGFloat(2)
}
그러나 만약 해당 커스텀 view를 사용하는 view 컨트롤러에서
커스텀뷰에 클릭 이벤트를 설정하고 싶다면 rx를 사용해서 쉽게 구현이 가능하다.
뷰 컨트롤러에서 ExitButton(커스텀뷰) 를 불러온 상태이고
커스텀 뷰에서
는 button 이 있다.
뷰 컨트롤러에서 커스텀뷰 안에있는 button에 접근 하면된다.