2017-02-28 3 views
2

キーフレームを使用してラベルに対して単純な左から右のアニメーションを作成しますが、アニメーションが繰り返されると遅延は無視されます。animateKeyframes repeatとdelayが期待どおりに動作しない

最初に実行すると3秒の遅延が効きますが、アニメーションが繰り返されると遅延は無視されます。これにより、アニメーションが終了した直後にアニメーションが再開します。遅延はアニメーションの残りの部分と一緒に繰り返されることはありません場合は

UIView.animateKeyframes(withDuration: 10, delay: 3, options: [.calculationModePaced, .repeat], animations: { 
    let xDist = self.Label_ArtistAlbum2.frame.origin.x 

    UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.1, animations: { 
     self.Label_ArtistAlbum2.frame.origin.x = self.Label_ArtistAlbum2.frame.origin.x - (xDist * 0.1) 
    }) 

    UIView.addKeyframe(withRelativeStartTime: 0.1, relativeDuration: 0.7, animations: { 
     self.Label_ArtistAlbum2.frame.origin.x = 0 
    }) 

    //attempted pause - does not appear to work perhaps since the position is unchanged? 
    UIView.addKeyframe(withRelativeStartTime: 0.8, relativeDuration: 0.2, animations: { 
     self.Label_ArtistAlbum2.frame.origin.x = 0 
    }) 
}, completion: nil) 

:私は、しかし、これも変更された回でも効果はありません最後に余分なキーフレームを追加しようとしました

UIView.animateKeyframes(withDuration: 10, delay: 3, options: [.calculationModePaced, .repeat], animations: { 
    let xDist = self.Label_ArtistAlbum2.frame.origin.x 

    UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.1, animations: { 
     self.Label_ArtistAlbum2.frame.origin.x = self.Label_ArtistAlbum2.frame.origin.x - (xDist * 0.1) 
    }) 

    UIView.addKeyframe(withRelativeStartTime: 0.9, relativeDuration: 0.1, animations: { 
     self.Label_ArtistAlbum2.frame.origin.x = 0 
    }) 
}, completion: nil) 

アニメーション全体が繰り返される前に一時停止を作成するにはどうすればよいですか?

答えて

1

ようなアニメーションを作成する方法のコードであるためのスイッチを持っています私が問題と信じているものが見つかりました。

カーブのアニメーションオプションが私の問題だと思います。

calculationModePaced

を選ぶ私の場合は は私のキーフレームパラメータを再計算し、最初と最後を除いて、それらのいずれかをヒットする保証はないという効果を有します。すべての中間キーフレームは「提案」になります。 再計算時にキーフレームが「消費」され、それ自体の上に立っていないため、最後に一時停止を作成することはできません。

私はcalculateModeLinearに変更し、私が期待していたキーフレームと一時停止も得ました。 はしかし、それは私が、私はいじり維持する必要がありますたいほど滑らかで...

Appleのドキュメントはここにある - 彼らは、記述しているが、実際にいくつかのグラフィックスおよび/または例を使用することができます。 https://developer.apple.com/reference/uikit/uiview?language=swift

カーブの良いグラフはここにあります:https://www.shinobicontrols.com/blog/ios7-day-by-day-day-11-uiview-key-frame-animations

0

ローディングビューをアニメートするときも同様の問題がありました。私は、このようにそれを解決:

私はアニメーションで

private enum TriangleToAnimate { 
    case one 
    case two 
    case three 
    case pause 
} 

の手順については、列挙型を作成し、私は私の変数

private var triangleViewToFireCount = TriangleToAnimate.one 
var triangle1View : TriangleView 
var triangle2View : TriangleView 
var triangle3View : TriangleView 

を持っている私は、各アニメーション

override init(frame: CGRect) { 
    Timer.scheduledTimer(timeInterval: 0.33, target: self, selector: #selector(LoadingView.timerFire), userInfo: nil, repeats: true) 
} 
を実行するためにタイマーを開始します

セレクタには私は火の方法があります。この方法では、私は、列挙型の例各

func timerFire(){ 
    let anim = createAnimation() 
    switch triangleViewToFireCount { 
    case .one: 
     triangle1View.layer.add(anim, forKey: "transform") 
     triangleViewToFireCount = .two 
    case .two: 
     triangle2View.layer.add(anim, forKey: "transform") 
     triangleViewToFireCount = .three 
    case .three: 
     triangle3View.layer.add(anim, forKey: "transform") 
     triangleViewToFireCount = .pause 
    default: 
     triangleViewToFireCount = .one 
    } 
} 

これは私がこの問題に多くのテストを行ってきたキーフレーム

func createAnimation() -> CAKeyframeAnimation{ 
    let tr = CATransform3DIdentity 
    let orignalScale = CATransform3DScale(tr, 1, 1, 1) 
    let doubleScale = CATransform3DScale(tr, 2, 2, 1) 
    let keyAn = CAKeyframeAnimation(keyPath: "transform") 
    keyAn.keyTimes = [0, 0.1, 0.6] 
    keyAn.duration = 1 
    keyAn.values = [orignalScale,doubleScale,orignalScale] 
    keyAn.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut) 
    return keyAn 
} 
関連する問題