SwiftでLTMorphingLabelを使ってみた

1 はじめに
2 LTMorphingLabelとは
3 準備
4 実装

はじめに

今回はLTMorphingLabelというライブラリが面白そうなので使ってみました。

LTMorphingLabelとは

ラベルのテキスト変更時にエフェクトをつけてくれるライブラリです。
https://github.com/lexrus/LTMorphingLabel
作者のgithubにエフェクトのサンプルがあるのですが、見ているだけで試してみたい欲に駆られますね。

準備

今回はCocoaPodsで追加します。

pod 'LTMorphingLabel', :git => 'https://github.com/lexrus/LTMorphingLabel.git', :branch => 'swift3'

1	pod 'LTMorphingLabel', :git => 'https://github.com/lexrus/LTMorphingLabel.git', :branch => 'swift3'

実装

まずはLTMorphingLabelをimportします。

import LTMorphingLabel

1	import LTMorphingLabel

StoryboardにUILabelを適当に用意し、ClassにLTMorphingLabelを指定してください。
それをIBOutlet接続します。

@IBOutlet weak var morphingLabel: LTMorphingLabel!

1	@IBOutlet weak var morphingLabel: LTMorphingLabel!

エフェクトの定義を行います。

morphingLabel.morphingEffect = .evaporate

1	morphingLabel.morphingEffect = .evaporate

エフェクトの種類、サンプルに関しては作者のgithubを参照してください。

これでmorphingLabelのtextを変更するとエフェクトがかかるようになります。

これだけだとイマイチエフェクトの切り替わりを実感できないので、TimerでmorphingLabelのtextを更新するようにしてみたいと思います。

    @IBOutlet weak var morphingLabel: LTMorphingLabel!
    
    //表示制御用タイマー
    private var timer: Timer?
    //String配列のindex用
    private var index: Int = 0
    //表示するString配列
    private let textList = ["シンプルであることは、", "複雑であることよりも", "難しい"]
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // エフェクトの定義
        morphingLabel.morphingEffect = .evaporate
    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        //タイマーの追加
        timer = Timer.scheduledTimer(timeInterval: 3.0,
                                     target: self,
                                     selector: #selector(update(timer:)), userInfo: nil,
                                     repeats: true)
        timer?.fire()
    }
    
    override func viewDidDisappear(_ animated: Bool) {
        super.viewDidDisappear(animated)
        
        timer?.invalidate()
    }
    
    func update(timer: Timer) {
        //ここでtextの更新
        morphingLabel.text = textList[index]
        
        index += 1
        if index >= textList.count {
            index = 0
        }
    }

@IBOutlet weak var morphingLabel: LTMorphingLabel!

//表示制御用タイマー

private var timer: Timer?

//String配列のindex用

private var index: Int = 0

//表示するString配列

private let textList = ["シンプルであることは、", "複雑であることよりも", "難しい"]

override func viewDidLoad() {

super.viewDidLoad()

// エフェクトの定義

morphingLabel.morphingEffect = .evaporate

}

override func viewDidAppear(_ animated: Bool) {

super.viewDidAppear(animated)

//タイマーの追加

timer = Timer.scheduledTimer(timeInterval: 3.0,

target: self,

selector: #selector(update(timer:)), userInfo: nil,

repeats: true)

timer?.fire()

}

override func viewDidDisappear(_ animated: Bool) {

super.viewDidDisappear(animated)

timer?.invalidate()

}

func update(timer: Timer) {

//ここでtextの更新

morphingLabel.text = textList[index]

index += 1

if index >= textList.count {

index = 0

}

これでLTMorphingLabelのエフェクトを堪能できると思います。

実装も簡単ですし、見た目も素晴らしいので色々使ってみたいですね。

日	月	火	水	木	金	土
				1	2	3
4	5	6	7	8	9	10
11	12	13	14	15	16	17
18	19	20	21	22	23	24
25	26	27	28

SwiftでLTMorphingLabelを使ってみた

はじめに

LTMorphingLabelとは

準備

実装

フォロー

アプリ情報