[iOS] Custom UIView에 UIButton Touch 안될 때

코드베이스로 UI를 만들다가 버튼이 안먹히는 케이스가 있어서 잘 모르던 부분을 공유합니다.

 

화면은 다음과 같습니다.

 

여기서 C버튼이 제대로 안눌리는 문제가 있었는데요.

 

회색뷰 위에 노란 뷰를 만들고

노란뷰 안에 a b c 버튼을 추가했습니다.

 

사실 노란뷰가 색이 없어서 안보이는상태였는데요.

노란뷰에 addSubview를해서 C버튼이 그려진상태인데

C의 아랫부분은 노란뷰에 들어가지 않습니다.

 

아래 코드를 통해서 터치 이벤트를 확인할 수 있는데요.

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    print(#function)
}

C버튼의 아랫부분을 터치하면

touchesBegan(_:with:)

가 출력됩니다.

 

버튼이 아니라 CustomView가 터치를 받는다는거죠.

C의 윗부분을 터치하면

"cButton did tapped"

가 출력됩니다.

 

터치가 안될 때는 부모뷰의 크기를 확인해보시고

touchesBegan(_:with:) 을 이용해서 터치이벤트를 확인해보세요.

 

final class CustomView: UIView {
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        print(#function)
    }
    
    private let imageView: UIImageView = {
        let imageView = UIImageView()
        imageView.image = UIImage(named: "baechu")
        return imageView
    }()
    
    private let buttonStackView: UIStackView = {
       let stackView = UIStackView()
        stackView.axis = .horizontal
        stackView.alignment = .fill
        stackView.distribution = .equalSpacing
        stackView.spacing = 16
        return stackView
    }()
    
    let aButton: UIButton = {
        let button = UIButton(type: .custom)
        button.setTitle("A", for: .normal)
        button.backgroundColor = .systemMint
        button.titleLabel?.font = .systemFont(ofSize: 14)
        return button
    }()
    
    let bButton: UIButton = {
        let button = UIButton(type: .custom)
        button.setTitle("b", for: .normal)
        button.backgroundColor = .systemBrown
        button.titleLabel?.font = .systemFont(ofSize: 14)
        return button
    }()
    
    let cButton: UIButton = {
        let button = UIButton(type: .custom)
        button.setTitle("c", for: .normal)
        button.backgroundColor = .systemPink
        button.titleLabel?.font = .systemFont(ofSize: 14)
        return button
    }()
    
    private let contentView: UIView = {
        let view = UIView()
        view.backgroundColor = .systemYellow
        return view
    }()
 
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupUI()
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
    }
}

extension CustomView {
    private func setupUI() {
        backgroundColor = .systemGray
        addSubview(contentView)
        contentView.snp.makeConstraints { make in
            make.center.equalToSuperview()
            make.width.equalTo(300)
            make.height.equalTo(200)
        }
        
        contentView.addSubview(imageView)
        imageView.snp.makeConstraints { make in
            make.top.equalToSuperview()
            make.centerX.equalToSuperview()
            make.size.equalTo(100)
        }
        
        contentView.addSubview(buttonStackView)
        buttonStackView.snp.makeConstraints { make in
            make.top.equalTo(imageView.snp.bottom)
            make.centerX.equalToSuperview()
        }
        
        buttonStackView.addArrangedSubview(aButton)
        buttonStackView.addArrangedSubview(bButton)
        aButton.snp.makeConstraints { make in
            make.width.equalTo(100)
            make.height.equalTo(50)
        }

        bButton.snp.makeConstraints { make in
            make.width.equalTo(100)
            make.height.equalTo(50)
        }
     
        contentView.addSubview(cButton)
        cButton.snp.makeConstraints { make in
            make.top.equalTo(buttonStackView.snp.bottom)
            make.centerX.equalToSuperview()
            make.size.equalTo(100)
        }
        
        
    }
    
}