iOS) TIL # 68 실전프로젝트 - 4

커스텀으로 빼기

 

final class CustomTag: UIButton {
    override var isSelected: Bool {
        didSet { updateAppearance() }
    }
    
    init() {
        super.init(frame: .zero)
        setupUI()
    }
    
    private func setupUI() {
        titleLabel?.font = .systemFont(ofSize: 14)
        contentEdgeInsets = UIEdgeInsets(top: 8, left: 10, bottom: 8, right: 10)
        layer.cornerRadius = 15
        layer.borderWidth = 0.5
    }
    
    func setTagButton(layerColor: UIColor, backgroundColor: UIColor, title: String, titleColor: UIColor, isButton: Bool = true) {
        layer.borderColor = layerColor.cgColor
        self.backgroundColor = backgroundColor
        setTitle(title, for: .normal)
        setTitleColor(titleColor, for: .normal)
        isUserInteractionEnabled = isButton
    }
    
    private func updateAppearance() {
        backgroundColor = isSelected ? .primary : .white
        setTitleColor(isSelected ? .white : .primary, for: .normal)
    }
}

 

 

private func setupTagButtons() {
        for (stackView, titles) in stackViewsWithTitles {
            for title in titles {
                let button = CustomTag()
                button.setTagButton(
                    layerColor: .primary,
                    backgroundColor: .white,
                    title: title,
                    titleColor: .primary,
                    isButton: true
                )
                button.addTarget(self, action: #selector(tagButtonTapped), for: .touchUpInside)
                stackView.addArrangedSubview(button)
            }
        }
    }

 

 

 

경고창

 

UIButtonConfiguration 이란?

UIButton Configuration은 iOS 애플리케이션에서 버튼의 모양과 동작을 구성하는데 사용되는 새로운 구조체

 

 

UIButtonConfiguration 으로 변경

- 

 

 

 

final class CustomTag: UIButton {
   
    override var isSelected: Bool {
        didSet {
            updateAppearance()
        }
    }
  
    init(title: String, titleColor: UIColor, strokeColor: UIColor, backgroundColor: UIColor, isButton: Bool) {
        super.init(frame: .zero)
        setupUI(title: title, titleColor: titleColor, strokeColor: strokeColor, backgroundColor: backgroundColor, isButton: isButton)
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    private func setupUI(title: String, titleColor: UIColor, strokeColor: UIColor, backgroundColor: UIColor, isButton: Bool) {
        var config = UIButton.Configuration.filled()
         config.title = title
         config.cornerStyle = .capsule
         config.baseBackgroundColor = backgroundColor
         config.baseForegroundColor = titleColor
         config.background.strokeColor = strokeColor
         config.background.strokeWidth = 0.5
         self.configuration = config
         isUserInteractionEnabled = isButton
     }

    private func updateAppearance() {
           guard var config = self.configuration else { return }
           config.baseBackgroundColor = isSelected ? .primary : .white
           config.baseForegroundColor = isSelected ? .white : .primary
           self.configuration = config
       }
}

 

게시글 작성 뷰 구현

 

 

 

 

참고

 

https://medium.com/@boseongv/ios-uibutton-configuration-417168e9e782

[iOS] UIButton Configuration

 

• https://developer.apple.com/documentation/uikit/uibutton/configuration-swift.struct

UIButton.Configuration | Apple Developer Documentation

 

• https://developer.apple.com/videos/play/wwdc2021/10064/