[swift] 67.MarqueeLabel을 이용한 핫딜 이벤트 애니메이션 효과 구현하기

marquee-animation

많은 앱에서 핫딜 이벤트나 공지사항을 애니메이션 효과로 보여주는 경우가 있습니다. 이번 포스트에서는 MarqueeLabel이라는 라이브러리를 활용하여, 스크롤되는 애니메이션을 주는 핫딜 이벤트를 구현하는 방법에 대해 알아보겠습니다.

MarqueeLabel 라이브러리 설치하기

먼저, MarqueeLabel 라이브러리를 설치해야 합니다. Podfile에 아래와 같은 코드를 추가해주세요.

pod 'MarqueeLabel'

그리고 터미널에서 pod install 명령을 실행하여 라이브러리를 설치해줍니다.

MarqueeLabel 사용하기

이제 MarqueeLabel을 사용하여 핫딜 이벤트 애니메이션 효과를 구현해보겠습니다. 먼저, MarqueeLabel을 import 해줍니다.

import MarqueeLabel

그리고 아래와 같이 MarqueeLabel 인스턴스를 생성합니다.

let marqueeLabel = MarqueeLabel(frame: CGRect(x: 0, y: 0, width: 200, height: 20), duration: 8, fadeLength: 10)

frameMarqueeLabel의 프레임을 설정합니다. duration은 텍스트가 스크롤되는데 걸리는 시간을 설정합니다. fadeLength는 텍스트의 양 끝에 페이드 아웃(흐리게)하는 길이를 설정합니다.

다음으로, 애니메이션 효과를 주고 싶은 텍스트를 설정해줍니다.

marqueeLabel.text = "핫딜 이벤트 진행 중!"

마지막으로, MarqueeLabel을 화면에 추가해줍니다.

view.addSubview(marqueeLabel)

애니메이션 시작하기

마지막으로, MarqueeLabel 애니메이션을 시작해야 합니다. viewDidAppear 메소드에서 애니메이션을 시작하는 코드를 추가해보겠습니다.

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)
    
    marqueeLabel.restartLabel()
}

restartLabel 메소드를 호출하여 애니메이션을 시작할 수 있습니다.

이제 애플리케이션을 실행시켜보면 MarqueeLabel을 이용한 핫딜 이벤트 애니메이션 효과를 확인할 수 있습니다.

마무리

MarqueeLabel을 이용하면 간편하게 핫딜 이벤트나 공지사항을 스크롤되는 애니메이션으로 표시할 수 있습니다. 이번 포스트를 통해 MarqueeLabel을 사용하는 방법을 익히고, 원하는 애플리케이션에 적용해보세요.

참고 자료