UILabelのtextColorプロパティをアニメーション化する方法は?


82

何らかの理由で、textColorをアニメーション化しようとすると、機能しません。textColorが突然AからBに変わります。たとえば赤から黒にアニメーション化することは可能ですか?

回答:


6

この回答は廃止されており、元の質問に対する適切な解決策ではありません。以下の@strangeの回答ははるかに優れており、この回答の代わりに使用する必要があります:https://stackoverflow.com/a/20892927/76559

//以下の古い回答

このtextColorプロパティはドキュメントでアニメーション化可能として指定されていないため、単純なUIViewアニメーションブロックではアニメーション化できないと思います...

これはおそらくNSTimer、色を一方から他方に徐々に設定するたびに、数ミリ秒ごとに発射することでかなり大雑把に行うことができます。

開始色から終了色までのプリセットカラー値の配列またはその他のコンテナが必要になるため、これは大雑把だと思います。コアアニメーションなどを使用してこれを行う方法があると確信しています。それが何であるかわからない。


または:AとBの間のRGB値と指定されたパーセンテージの配列をスローする関数。ただし、カラーアルゴリズムについては何も知りません。
dontWatchMyProfile 2010年

ここに良い回避策がありますここここ にAnna Kareninaのおかげで
ジャッカル

4
アニメーションはディスプレイの更新と同期されるため、手動でアニメーションを駆動するのCADisplayLinkではなく、NSTimerを使用する必要があります。WWDC 2014セッション236:約13:00に中断可能で応答性の高い相互作用構築するを参照してください。
ダグラスヒル

たとえそれがその時に真実であったとしても、これはもはや受け入れられた答えであるべきではありません。以下の奇妙な答えを参照してください
bitwit 2016

Stack Overflowでは、この廃止された回答が受け入れられたため、削除できません。以下の@strangeの回答を確認してください。
Jasarien 2017

194

代わりに、このようにオブジェクト自体にクロスフェードトランジションを使用してみた場合、ある色から別の色への素晴らしいフェードインフェードアウト効果が得られます。

Objective C

[UIView transitionWithView:myLabel duration:0.25 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{
    myLabel.textColor = NEW_COLOR;
} completion:^(BOOL finished) {
}];

迅速

UIView.transitionWithView(creditsLabel, duration: 0.25, options: .TransitionCrossDissolve, animations: {     
    self.creditsLabel.textColor = UIColor.redColor() 
}, 
completion: nil)

これは、さまざまな理由から、NSTimers、CATextLayersなどを使用するよりも優れています。CATextLayerはテキストカーニングまたはNSAttributedTextを適切にサポートしておらず、NSTimersは遅延しています(さらにコードが多すぎます)。上記のトランジションアニメーションはトリックを実行し、チェーンアニメーションでも使用できます。私は同じ問題を抱えており、すでに上記の解決策を試しましたが、この単純なコードは代わりに驚異的に機能します。


7
素晴らしく、エレガントで、実際には最良で最もクリーンなソリューションです。
maksa 2014年

17
すごい。Swiftでも同じように機能します:UIView.transitionWithView(creditsLabel, duration: 0.3, options: .TransitionCrossDissolve, animations: { self.creditsLabel.textColor = UIColor.redColor() }, completion: nil)
SimplGy 2015

8
注:これは、ラベルが静的な場合にのみ機能します。これを行い、ラベルの位置が変更されている場合、フェードアウトアニメーションは醜いアーティファクトを表示します。
Lukas Petr

Xcode10.2.1およびSwift5では機能しません。以下の「shokaveli」メソッドは機能します
Martin

私はSwiftUIでこれを行う方法を探していましたが、現時点ではサポートされていないようです。
フィリップ

58

Swift 4ソリューション:

UIView.transition(with: yourLabel, duration: 0.3, options: .transitionCrossDissolve, animations: {
  self.yourLabel.textColor = .red
}, completion: nil)

これUILabelは、withプロパティのインスタンスがある場合にのみ機能することに注意してください。あなたがそのようなことをしてtransition(with: outerView.label…)それを中に入れようとすると、それは静かに失敗します。
Sam Soffes 2018

なんらかの理由で動作しません。アニメーション中に段階的ではなく、突然変更を加えています。:(
ScottyBlades 2018

1
@ScottyBlades多分あなたはバックグラウンドスレッドでアニメーションをやっていますか?UIView.transitionコードをDispatchQueue.main.async {}ブラケットでラップしてみてください。
budidino 2018

1
参考までに-最初に試したのはうまくいきませんでしたがoptions: .easeInOut、それは私が持っていたためでしたので、に変更して機能.transitionCrossDissolve しました。
LeoGalante

13

textColorがアニメートできない理由は、UILabelがCATextLayerの代わりに通常のCALayerを使用するためです。

textColorをアニメート可能(およびテキスト、フォントなど)にするために、UILabelをサブクラス化してCATextLayerを使用することができます。

これはかなり大変な作業ですが、幸いにも私はすでにそれをしました:-)

この記事では、完全な説明とUILabelのドロップインオープンソースの代替品を見つけることができます


9

UILabelの別のインスタンス、またはtextColorを持つインスタンスを作成してから、これら2つのインスタンス(古いtextColorのインスタンスと新しいtextColorのインスタンス)の間にアニメーションを適用してみてください。


7

これは私のために働いた唯一のものでした:

let changeColor = CATransition()
changeColor.duration = 1

CATransaction.begin()

CATransaction.setCompletionBlock {
    selected.label.layer.addAnimation(changeColor, forKey: nil)
    selected.label.textColor = .blackColor()
}

selected.nameLabel.textColor = .redColor()

CATransaction.commit()

6

これが、ラベルのテキストの色をアニメーション化するための私のコードです。重要な部分は、clearColorへの、textColorを設定することで、アニメーションの前に

label.textColor = [UIColor clearColor];
[UIView transitionWithView:label duration:duration/4 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{
    label.textColor = self.highlightedCellPrimaryTextColor;
} completion:^(BOOL finished) { }];

0

ラベルの下にUIViewを配置し、その不透明度をアニメーション化するのは非常に簡単であることがわかりました。そのビューにラベルを追加する必要があります。リソース消費の観点からは良い解決策ではないかもしれませんが、かなり簡単です。


0

更新されたswift3.0

@budidinoのコメントから変更しました

UIView.transition(with: my.label, duration: 0.3, options: .transitionCrossDissolve, animations: { my.label.textColor = .black }, completion: nil)

0

@ Strangeの回答に感謝します。Swift5、Xcode 11で完全に機能し、構文が少し変更されています。複数のUILabelのテキストの色をアニメーション化していたのですが、これも当てはまる場合は、これを試してください

for label in [label1, label2, ...] as [UILabel] { // loop through a @IBOutlet UILabel array
        UIView.transition(with: label, duration: 0.3, options: .transitionCrossDissolve, animations: {
            label.textColor = .label
        }, completion: nil)
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.