背景をぼかすためのUIViewPropertyAnimatorのfractionCompleteをアニメ化する

Question

ホーム画面をスクロールして背景をぼかすと、Spotlight検索と同じことを達成するために新しいUIViewPropertyAnimatorとUIVisualEffectViewを使用しています。

私はfractionCompleteプロパティを使用して、UIViewをパンするときのぶれの程度を設定します。

animator = UIViewPropertyAnimator(duration: 1, curve: .linear) { 
     self.blurEffectView.effect = nil 
    } 

そして、ぼかし量は、0.0~1.0の間の値で変更されます。

 animator?.fractionComplete = blurValue 

しかし、私はぼかしが戻って、それはノーボケですからアニメーション化するパンジェスチャーをキャンセルする場合（例えば〜 - > 1.0）0.4ミリ秒のようなものの期間と。

パンのジェスチャがキャンセルされたら、fractionCompleteを1.0に設定しました。代わりに私はそれをアニメートしたい。
は私がUIView.animate（withDurationを試してみました..しかし、それはUIViewPropertyAnimators fractionCompleteには影響しない、とUIVisualEffectViewをぼかすための唯一の方法のthats。

任意のアイデア？

Answer 1

fractionCompleteが持っているようですバグ（StackOverflowの上の私の質問：UIViewPropertyAnimator does not update the view when expectedが）。、rdar://30856746プロパティはinactiveからactiveの状態を設定しますが、（私は仮定）をトリガしていない別の内部状態があるので、ビューを更新しない

へ。あなたがすることができる問題を回避する次のとおりです。ここでは

animator.startAnimation() // This will change the `state` from inactive to active 
animator.pauseAnimation() // This will change `isRunning` back to false, but the `state` will remain as active 

// Now any call of `fractionComplete` should update your view correctly! 
animator.fractionComplete = /* your value here */ 

は遊ぶための遊び場スニペットです：

let liveView = UIView(frame: CGRect(x: 0, y: 0, width: 400, height: 50)) 
liveView.backgroundColor = .white 

PlaygroundPage.current.needsIndefiniteExecution = true 
PlaygroundPage.current.liveView = liveView 

let square = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50)) 
square.backgroundColor = .red 

liveView.addSubview(square) 

let animator = UIViewPropertyAnimator.init(duration: 5, curve: .linear) 

animator.addAnimations { 

    square.frame.origin.x = 350 
} 

let blurView = UIVisualEffectView(effect: UIBlurEffect(style: .dark)) 
blurView.frame = liveView.bounds 

liveView.addSubview(blurView) 

animator.addAnimations { 

    blurView.effect = nil 
} 

// If you want to restore the blur after it was animated, you have to 
// safe a reference to the effect which is manipulated 
let effect = blurView.effect 

animator.addCompletion { 
    // In case you want to restore the blur effect 
    if $0 == .start { blurView.effect = effect } 
} 

animator.startAnimation() 
animator.pauseAnimation() 

DispatchQueue.main.asyncAfter(deadline: .now() + 2) { 

    animator.fractionComplete = 0.5 
} 

DispatchQueue.main.asyncAfter(deadline: .now() + 4) { 

    // decide the direction you want your animation to go. 
    // animator.isReversed = true 
    animator.startAnimation() 
} 

Answer 2

あなたはまだ実際にスライダーやジェスチャーを使用せずにfractionCompleteをアニメーション化する方法を探しているなら、私がされましたCADisplayLinkを使用して私の結果に非常に満足しています。私の結果はここにあります：https://gist.github.com/vegather/07993d15c83ffcd5182c8c27f1aa600b