最佳途徑動畫雷達的iOS

我試圖動畫海軍風格的雷達在iOS上的標題行（以下紡紗部分），就像這樣：最佳途徑動畫雷達的iOS

我現在的速度慢， laggy和高開銷的解決方案（僞因爲真正的銀行代碼是一個小長條）：

create NSTimer to call animate() every 1/60 sec 
currentAngle = 0 

animate(): 
    create UIBezierPath from center of circle to outside edge at currentAngle 
    add path to new CAShapeLayer, add layer to views layer 
    add fade out CABasicAnimation to layer (reduces opacity over time) 
    increase currentAngle

什麼是做到這一點，而無需使用一個.gif的最佳方式？我已經實現了上面的解決方案，但性能（幀速率和CPU使用）非常糟糕。你會如何解決這個問題？

來源

2016-05-18 mmarkman

您的方法太複雜。不要在動畫過程中重新繪製圖像。

將從淡入和淡出的部分分開旋轉的部分並單獨進行動畫處理。使每個動畫繪製部分透明，以便其他動畫顯示。

要麼創建旋轉部件的靜態圖像，要麼創建一個創建該圖像的圖層。

如果您創建圖像，則可以使用UIView動畫來爲圖像視圖上的旋轉設置動畫。

如果您創建一個圖層，並在其周圍繪製標題線和漸變，則使用動畫顯示圖層變換的z旋轉的CABasicAnimation。

來源

2016-05-18 23:25:24

我避免了在輸入/輸出褪色點，這是一個不同的，簡單的問題。困擾我的漸變的靜態性。一個形象感覺冷酷無情。這可能是唯一合理實施的解決方案。我會嘗試繪製一個本地的靜態漸變，希望它能比一個旋轉的PNG帶來更多的生命。 – mmarkman

兩者的效果是相同的。你發佈的GIF也是一個旋轉的靜態圖像。 –

我知道這是一個靜態圖像，它看起來毫無生氣。盯着圖像的中心 - 很明顯，漸變是一個旋轉的靜態圖像。幻覺失去了。我將學習如何在我的動畫中添加一些隨機濾鏡/疊加/效果，使其更像是模擬雷達屏幕，感謝您的幫助。 – mmarkman

我是來工作斯威夫特3解決方案，這要歸功於Animations in Swift/iOS 8文章：

let scanInProgress = UIImageView() 
    scanInProgress.image = UIImage(named: "scanInProgress.png") 
    scanInProgress.frame = CGRect(x: 150, y: 200, width: 80, height: 200) 
    view.addSubview(scanInProgress) 

    let fullRotation = CGFloat(Double.pi * 2) 
    let duration = 2.0 
    let delay = 0.0 

    UIView.animateKeyframes(withDuration: duration, delay: delay, options: [.repeat, .calculationModeLinear], animations: { 

     UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 1/3, animations: { 
     scanInProgress.transform = CGAffineTransform(rotationAngle: 1/3 * fullRotation) 
     }) 
     UIView.addKeyframe(withRelativeStartTime: 1/3, relativeDuration: 1/3, animations: { 
     scanInProgress.transform = CGAffineTransform(rotationAngle: 2/3 * fullRotation) 
     }) 
     UIView.addKeyframe(withRelativeStartTime: 2/3, relativeDuration: 1/3, animations: { 
     scanInProgress.transform = CGAffineTransform(rotationAngle: 3/3 * fullRotation) 
     }) 

    }, completion: { 

    })

來源

2017-09-27 15:13:53 cdescours

最佳途徑動畫雷達的iOS

回答

相關問題