이번에는 MarqueeLabel을 이용하여 할인 쿠폰을 안내하는 효과를 구현해보겠습니다. MarqueeLabel은 UILabel의 하위 클래스로, 텍스트가 일정 시간에 걸쳐 움직이는 효과를 제공합니다.
1. MarqueeLabel 라이브러리 설치하기
먼저, MarqueeLabel 라이브러리를 설치해야 합니다. CocoaPods를 사용하여 설치할 수 있습니다. Podfile에 다음과 같이 MarqueeLabel을 추가합니다.
pod 'MarqueeLabel'
그리고 터미널에서 아래 커맨드를 실행하여 라이브러리를 설치합니다.
pod install
2. MarqueeLabel 사용하기
MarqueeLabel을 사용하기 위해 다음과 같이 import 합니다.
import MarqueeLabel
이제 MarqueeLabel을 생성하고 설정할 준비가 되었습니다. 할인 쿠폰을 표시할 UILabel을 만든 뒤, 이를 MarqueeLabel로 변환해보겠습니다.
let couponLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 30))
couponLabel.text = "50% 할인 쿠폰을 지금 바로 사용하세요!"
couponLabel.textColor = UIColor.white
couponLabel.backgroundColor = UIColor.red
let marqueeLabel = MarqueeLabel(frame: CGRect(x: 0, y: 0, width: 200, height: 30), duration: 8, fadeLength: 10)
marqueeLabel.text = couponLabel.text
marqueeLabel.textColor = couponLabel.textColor
marqueeLabel.backgroundColor = couponLabel.backgroundColor
couponLabel.removeFromSuperview()
view.addSubview(marqueeLabel)
위 코드에서 couponLabel은 일반 UILabel이고, 이를 marqueeLabel로 변환하여 화면에 추가했습니다. MarqueeLabel의 생성자는 텍스트가 한 바퀴를 회전하는데 걸리는 시간과 페이드 인/아웃 효과의 길이를 인자로 받습니다.
3. MarqueeLabel 설정하기
MarqueeLabel을 보다 자세히 설정할 수 있는 속성들이 있습니다. 예를 들어, marqueeLabel의 스크롤 방향을 설정하거나, 폰트를 변경하거나, 텍스트를 중앙 정렬하는 등 다양한 설정이 가능합니다.
marqueeLabel.type = .continuous
marqueeLabel.scrollDirection = .left
marqueeLabel.animationCurve = .easeInOut
marqueeLabel.font = UIFont.systemFont(ofSize: 16)
marqueeLabel.textAlignment = .center
위 코드에서 type은 애니메이션 타입을, scrollDirection은 스크롤 방향을, animationCurve는 애니메이션 커브를 나타냅니다. font는 텍스트의 폰트를, textAlignment은 텍스트의 정렬 방식을 설정합니다.
4. 마무리
이제 MarqueeLabel을 이용하여 할인 쿠폰을 안내하는 효과를 구현할 수 있습니다. MarqueeLabel의 다양한 설정을 활용하여 더욱 다채로운 효과를 만들어보세요!
참고 자료: