UIView Swift 倾斜动画

Posted

技术标签:

【中文标题】UIView Swift 倾斜动画【英文标题】:UIView Swift Tilting Animation 【发布时间】:2018-04-20 03:43:05 【问题描述】:

我有一个 UIImageView,我想要它,这样当我调用一个函数时,图像会从平坦(正常状态)变为向右旋转倾斜(比如可能旋转 20 度),然后返回这是平坦(正常)状态。

这是我目前拥有的,但我无法得到想要的结果。

extension UIView 

    func rotate(duration: CFTimeInterval = 2) 
        let rotateAnimation = CABasicAnimation(keyPath: "transform.rotation")
        rotateAnimation.fromValue = 0.0
        rotateAnimation.toValue = CGFloat(20)
        rotateAnimation.isRemovedOnCompletion = true
        rotateAnimation.duration = duration
        rotateAnimation.repeatCount=Float.infinity
        self.layer.add(rotateAnimation, forKey: nil)
    



UIImageView.rotate()

【问题讨论】:

显示你尝试过的代码 如果您的所有图像都处于不同的情况,请使用带有动画的计时器定期更改图像... 这一定是有史以来最可爱的示例图片。 @Anbu.karthik 我更新了问题以显示我目前拥有的内容。 绝对没有理由将其标记为“广泛”。这只是一个问“如何在 ios 上旋转图像”的问题——一个很好的问题。请注意出色的答案。 【参考方案1】:

我尝试创建上面的动画,我尝试过的代码在这里

必填声明

///View Outlet - Image or UIView
@IBOutlet weak var baseView: UIImageView!

/// Timer - To make Animation in repititive State
var newNAimationTimer : Timer?    

/// Plus Degree
let degrees : CGFloat = 20.0
/// Minus Degree
let minusDegree : CGFloat = -20.0

定时器功能

//MARK: Start Timer
    func startTimer()
    
        /// Start timer if Timer is Not Initialised Before
        if newNAimationTimer == nil 
            /// Assign Timer
            newNAimationTimer = Timer.scheduledTimer(timeInterval: 1, target: self, selector: #selector(animationVC.animateView), userInfo: nil, repeats: true)
        
    

    //MARK: Stop Timer
    func stopTimer()
    
        ///Check Do timer is Initialised
        if newNAimationTimer != nil 
            /// Yes Stop
            newNAimationTimer?.invalidate()
        
    

定时器处理程序

/// Animate View With Animations
    @objc func animateView()
    
        let plusRadian : CGFloat = degrees * CGFloat((Double.pi/180))
        let minusRadian : CGFloat = minusDegree * CGFloat((Double.pi/180))

        /// First Animation To make View Goes clockwise
        UIView.animate(withDuration: 0.5, animations: 
             self.baseView.transform = CGAffineTransform(rotationAngle: plusRadian)
        )  (success) in
            /// Second Animation to make view go antiClockWise
            UIView.animate(withDuration: 0.5, animations: 
                self.baseView.transform = CGAffineTransform(rotationAngle: minusRadian)
            )
        
    

按钮操作

@IBAction func animationButton(_ sender: Any) 
        /// Start the Animation
        startTimer()
    

屏幕截图

首先:

第二:

运行输出

【讨论】:

很好的答案,动画效果完美,看起来很完美! 谢谢,编码愉快

以上是关于UIView Swift 倾斜动画的主要内容,如果未能解决你的问题,请参考以下文章

Silverlight & Blend动画设计系列四:倾斜动画(SkewTransform)

倾斜时动画开始

CSS3 skew倾斜rotate旋转动画

css 倾斜动画

Css3旋转位移缩放倾斜动画

如何为 css 倾斜过渡添加 jquery 回退?