[swift] PMAlertController 알림창 스크롤 기능 추가하기

17 Nov 2023

swift

PMAlertController

PMAlertController는 iOS 앱에서 사용자에게 알림창을 보여주는데 도움을 주는 오픈 소스 라이브러리입니다. 이 라이브러리를 사용하면 간단하게 깔끔한 디자인의 알림창을 생성할 수 있습니다.

그러나 기본적으로 PMAlertController에는 알림창이 너무 길어질 경우 스크롤 기능이 없습니다. 따라서, 알림창의 내용이 길어질 경우 스크롤 기능을 추가해보겠습니다.

단계 1: PMAlertController 가져오기

먼저, 프로젝트에 PMAlertController를 추가해야 합니다. 이를 위해 Podfile에 다음과 같이 추가해주세요:

pod 'PMAlertController'

그리고 터미널에서 다음 명령어를 실행하여 CocoaPods를 설치해주세요:

$ pod install

단계 2: 알림창 스크롤 뷰 추가

PMAlertController를 사용하여 알림창을 생성하는 코드를 작성합니다. 그러나 스크롤 뷰가 추가된 알림창을 생성하기 위해 먼저 AlertView.swift 파일을 열고 loadSubviews 메서드를 찾습니다.

private func loadSubviews() {
    // 기존 코드
    // ...

    // 스크롤 뷰 추가
    let scrollView = UIScrollView(frame: .zero)
    scrollView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.isScrollEnabled = true
    scrollView.showsVerticalScrollIndicator = true
    containerView.addSubview(scrollView)

    // 스크롤 뷰의 제약 조건 설정
    scrollView.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 20).isActive = true
    scrollView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -20).isActive = true
    scrollView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 20).isActive = true
    scrollView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -20).isActive = true

    // 컨텐츠 뷰 추가
    let contentView = UIView(frame: .zero)
    contentView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.addSubview(contentView)

    // 컨텐츠 뷰의 제약 조건 설정
    contentView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
    contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
    contentView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor).isActive = true
    contentView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor).isActive = true
    contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true

    // 기존 코드
    // ...
}

위의 코드에서, scrollView와 contentView를 알림창에 추가하여 스크롤 기능을 구현합니다.

단계 3: 알림창 내용 추가

이제 알림창에 내용을 추가해야 합니다. AlertView.swift 파일을 다시 열고 loadTitleLabel, loadMessageLabel 또는 loadTextField와 같은 메서드를 찾아 스크롤 뷰를 위한 제약 조건을 설정합니다.

private func loadTitleLabel() {
    // 기존 코드
    // ...
    
    // 스크롤 뷰 제약 조건 설정
    titleLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16).isActive = true
    titleLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16).isActive = true
}

private func loadMessageLabel() {
    // 기존 코드
    // ...
    
    // 스크롤 뷰 제약 조건 설정
    messageLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16).isActive = true
    messageLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16).isActive = true
}

private func loadTextField() {
    // 기존 코드
    // ...
    
    // 스크롤 뷰 제약 조건 설정
    textField.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16).isActive = true
    textField.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16).isActive = true
}

이러한 방식으로 다른 알림창 컴포넌트에도 스크롤 뷰 제약 조건을 추가할 수 있습니다.

마무리

위의 단계를 따라하면 PMAlertController 라이브러리로 알림창을 만들 때 스크롤 기능을 추가할 수 있습니다. 알림창의 내용이 길어지더라도 사용자가 내용을 스크롤하여 확인할 수 있게 됩니다.

더 많은 기능을 추가하거나 PMAlertController 라이브러리의 사용 방법을 배우고 싶다면 GitHub 레포지토리를 참조해주세요.

참고: 이 글은 Swift 5.0과 CocoaPods 1.9.0 버전을 기준으로 작성되었습니다.