[swift] 57.MarqueeLabel을 이용한 비디오 소개 텍스트 스크롤 구현하기

15 Nov 2023

swift

안녕하세요! Swift 개발자 여러분, 오늘은 MarqueeLabel을 이용하여 비디오 소개 텍스트를 스크롤하는 방법을 알려드리려고 합니다. MarqueeLabel은 UILabel의 서브클래스로, 긴 텍스트를 스크롤하는 애니메이션 효과를 제공합니다. 이를 사용하여 비디오 소개 텍스트를 멋지게 스크롤시켜보겠습니다.

1. MarqueeLabel 라이브러리 추가하기

첫 번째로, MarqueeLabel 라이브러리를 추가해야 합니다. Cocoapods를 사용한다면, Podfile에 다음과 같은 내용을 추가하고 pod install 명령을 실행하세요.

pod 'MarqueeLabel/Swift'

Cocoapods를 사용하지 않는다면, MarqueeLabel의 GitHub 저장소에서 라이브러리를 다운로드하고 프로젝트에 직접 추가하세요.

2. MarqueeLabel 사용하기

MarqueeLabel을 사용하기 위해 다음과 같은 단계를 따르세요.

UIView에서 UILabel을 하나 추가합니다.
UILabel의 클래스를 MarqueeLabel로 변경합니다.
UILabel의 IBOutlet 연결을 설정합니다.
스토리보드 또는 코드에서 UILabel에 텍스트를 설정합니다.

@IBOutlet weak var videoDescriptionLabel: MarqueeLabel!

override func viewDidLoad() {
    super.viewDidLoad()
    
    videoDescriptionLabel.text = "이 비디오는 스위프트로 만들어진 MarqueeLabel을 이용한 텍스트 스크롤 구현 예제입니다."
    videoDescriptionLabel.textAlignment = .left
    videoDescriptionLabel.type = .continuous
    videoDescriptionLabel.speed = .duration(15)
    videoDescriptionLabel.fadeLength = 20
    videoDescriptionLabel.leadingBuffer = 30
}

위의 코드에서 설정한 속성들은 다음과 같습니다.

textAlignment은 텍스트의 정렬 방식을 설정합니다. .left로 설정하여 왼쪽 정렬로 텍스트가 스크롤됩니다.
type은 스크롤 타입을 설정합니다. .continuous로 설정하여 연속적인 스크롤을 사용합니다.
speed는 스크롤 속도를 설정합니다. .duration(15)로 설정하여 15초가 걸려 텍스트가 완전히 스크롤되도록 합니다.
fadeLength는 텍스트의 양쪽 끝 부분에 페이드 아웃 효과를 추가합니다. 값이 클수록 서서히 사라집니다.
leadingBuffer는 텍스트의 전체 길이보다 얼마나 앞서서 스크롤을 시작할지를 설정합니다. 값이 클수록 텍스트 스크롤이 길어집니다.

3. 실행하기

위의 코드를 작성하고 실행해보면, UILabel에 설정한 텍스트가 왼쪽으로 스크롤되는 애니메이션을 볼 수 있을 것입니다. MarqueeLabel을 통해 텍스트 스크롤을 구현함으로써, 비디오 소개 텍스트를 더욱 동적이고 유저들의 시선을 끄는 방식으로 나타낼 수 있습니다.

이번 포스트에서는 MarqueeLabel을 이용하여 비디오 소개 텍스트를 스크롤하는 방법을 알아보았습니다. MarqueeLabel의 다양한 설정 속성들을 통해 텍스트 스크롤의 속도와 효과를 자유롭게 조정할 수 있습니다. 자세한 내용은 MarqueeLabel의 공식 문서를 참고해보세요.

바쁜 일상에서 조금 더 흥미로운 UI를 구현하여 유저들과 함께하는 비디오 앱을 만들어보세요!