iOS 개발: Swift로 Custom View와 Protocol 활용하기

iOS 앱 개발에서 사용자 정의 뷰(Custom View)는 중요한 역할을 합니다. 사용자에게 보다 일관된 UI를 제공하고, 코드의 재사용성을 높이며, 유지보수를 용이하게 합니다. 또한, Protocol을 활용하면 코드의 유연성을 극대화할 수 있습니다. 이번 글에서는 Swift를 사용하여 Custom View를 만들고, Protocol을 활용하여 효과적으로 연동하는 방법을 다루겠습니다.

Custom View란 무엇인가?

Custom View는 UIKit의 기본 컴포넌트가 아닌, 개발자가 직접 정의한 뷰를 의미합니다. 기본 제공되는 컴포넌트만으로는 구현할 수 없는 독특한 UI나 기능을 필요로 할 때 Custom View를 제작합니다. 이러한 Custom View는 여러 용도로 사용될 수 있습니다.

1. 일관된 UI 구성: 동일한 스타일의 UI를 여러 곳에서 사용할 수 있습니다.
2. 코드 재사용성 증가: 반복되는 코드를 줄이고, 유지보수를 용이하게 합니다.
3. 복잡한 UI 구성: 기본 컴포넌트로 표현할 수 없는 복잡한 UI를 설계합니다.

Custom View 만들기

Custom View를 만들기 위해선 UIView를 상속받아 새로운 클래스를 작성합니다. 이때 init(frame:)나 init(coder:)와 같은 Initializer를 오버라이드합니다.

예를 들어, 원형 프로그래스바를 만들었다고 가정해 봅시다.

swift
import UIKit

class CircularProgressBarView: UIView {

    private var progressLayer = CAShapeLayer()
    private var trackLayer = CAShapeLayer()
    
    var progressColor: UIColor = .blue {
        didSet {
            progressLayer.strokeColor = progressColor.cgColor
        }
    }
    var trackColor: UIColor = .lightGray {
        didSet {
            trackLayer.strokeColor = trackColor.cgColor
        }
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        setupLayers()
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        setupLayers()
    }
    
    private func setupLayers() {
        let circularPath = UIBezierPath(arcCenter: center, radius: 100, startAngle: -CGFloat.pi / 2, endAngle: 3 * CGFloat.pi / 2, clockwise: true)
        
        trackLayer.path = circularPath.cgPath
        trackLayer.fillColor = UIColor.clear.cgColor
        trackLayer.strokeColor = trackColor.cgColor
        trackLayer.lineWidth = 10
        layer.addSublayer(trackLayer)
        
        progressLayer.path = circularPath.cgPath
        progressLayer.fillColor = UIColor.clear.cgColor
        progressLayer.strokeColor = progressColor.cgColor
        progressLayer.lineWidth = 10
        progressLayer.strokeEnd = 0
        layer.addSublayer(progressLayer)
    }

    func setProgress(to progress: CGFloat) {
        progressLayer.strokeEnd = progress
    }
}

이렇게 하면, CircularProgressBarView를 프로젝트 어디서든 사용하여 원형 프로그래스바를 쉽게 구현할 수 있습니다.

Protocol의 활용

Protocol은 Swift의 강력한 기능 중 하나로, 특정 기능을 수행하기 위한 메소드나 프로퍼티를 정의하는데 사용됩니다. 이를 통해 클래스나 구조체가 프로토콜을 채택함으로써 특정 기능을 반드시 구현하게 강제할 수 있습니다.

Custom View와 Protocol을 결합하면 매우 유연한 디자인이 가능합니다. 예를 들어, 여러개의 Custom View가 동일한 이벤트를 처리해야 하는 상황에서 Protocol을 사용할 수 있습니다.

먼저, 프로토콜을 정의해 봅시다.

swift
protocol ProgressBarDelegate: AnyObject {
    func progressDidChange(to progress: CGFloat)
}

그리고 Custom View 클래스에 이 프로토콜을 반영합니다.

swift
class CircularProgressBarView: UIView {

    weak var delegate: ProgressBarDelegate?

    // 이전 코드 동일

    func setProgress(to progress: CGFloat) {
        progressLayer.strokeEnd = progress
        delegate?.progressDidChange(to: progress)
    }
}

이제 이 Custom View를 사용하는 클래스에서 ProgressBarDelegate 프로토콜을 채택하고, 해당 메소드를 구현해야 합니다.

swift
class ViewController: UIViewController, ProgressBarDelegate {

    var progressBarView: CircularProgressBarView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // 초기화 및 레이아웃 설정 생략
        progressBarView.delegate = self
    }

    func progressDidChange(to progress: CGFloat) {
        print("Progress: \(progress)")
    }
}

이를 통해, 각 Custom View 객체가 동일한 방식으로 이벤트를 통보할 수 있습니다. 이 방법은 코드의 유연성을 극대화할 뿐만 아니라, 유지보수성을 높이는 데도 매우 유용합니다.

결론

Swift를 사용하여 Custom View를 제작하고 Protocol을 활용하면, iOS 앱 개발의 효율성을 크게 높일 수 있습니다. 다양한 UI 구성 요소를 쉽게 재사용할 수 있을 뿐만 아니라, 코드의 일관성과 유연성을 높여 유지보수를 용이하게 할 수 있습니다. 이 글에서 다룬 기본 개념과 예제를 바탕으로 여러분의 프로젝트에서도 Custom View와 Protocol을 적극 활용해 보시기 바랍니다.