ios弹窗抖动效果

作者: 叶熙雯 | 来源:发表于2018-12-27 10:21 被阅读87次
你的小可爱已上线

效果弹窗不想弹出那么单调,我们可以进行一些小的动画效果,让页面更加鲜活

效果.gif

动画效果中我选择用的是UIView动画,弹性动画方法animateWithDuration: delay: usingSpringWithDamping: initialSpringVelocity: options: animations实现页面抖动效果,设定view初始位置和动画过程位置完成出场动画和结束动画效果,当usingSpringWithDamping的范围为0.0f到1.0f,数值越小「弹簧」的振动效果越明显,initialSpringVelocity则表示初始的速度,数值越大一开始移动越快,就是形变的速度,从视觉上看可以理解弹簧的形变速度,到动画结束,该速度减为0。

我把他们写成一个demo的类可以在需要时候调用

enum AnimationType {
    case animationZoom
    case topToCenterSpring
    case downToCenterSpring
    case leftToCenterSpring
    case rightToCenterSpring
}

class AnimationModel: NSObject {
    
    private var screenSize = UIScreen.main.bounds.size
    
    //view:底层的 changeView:需要动画的view type:动画样式
    func show(view:UIView,changeView:UIView,type:AnimationType){
        switch type {
        case .animationZoom:
            changeView.layer.setValue(0, forKey: "transform.scale")
            UIView.animate(withDuration: 0.75, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 1, options: .curveEaseIn, animations: {
                changeView.layer.position = view.center
                changeView.layer.setValue(1.0, forKey: "transform.scale")
            }, completion: nil)
            break
        case .topToCenterSpring:
            changeView.layer.position = CGPoint.init(x: view.center.x, y: -changeView.frame.size.height)
            UIView.animate(withDuration: 0.9, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 1, options: .curveEaseIn, animations: {
                changeView.layer.position = view.center
            }, completion: nil)
            break
        case .downToCenterSpring:
            changeView.layer.position = CGPoint.init(x: view.center.x, y: screenSize.height)
            UIView.animate(withDuration: 0.9, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 1, options: .curveEaseIn, animations: {
                changeView.layer.position = view.center
            }, completion: nil)
            break
        case .leftToCenterSpring:
            changeView.layer.position = CGPoint.init(x: -250, y: view.center.y)
            UIView.animate(withDuration: 0.9, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 1, options: .curveEaseIn, animations: {
                changeView.layer.position = view.center
            }, completion: nil)
            break
        case .rightToCenterSpring:
            changeView.layer.position = CGPoint.init(x: screenSize.width+250, y: view.center.y)
            UIView.animate(withDuration: 0.9, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 1, options: .curveEaseIn, animations: {
                changeView.layer.position = view.center
            }, completion: nil)
            break
        default:
            break
        }
    }
    
}

需要的人可以直接copy走吧!记得帮我点点❤ 爱你哟!
外加git地址:https://github.com/sunrose11/AnimationView

相关文章

  • ios弹窗抖动效果

    效果弹窗不想弹出那么单调,我们可以进行一些小的动画效果,让页面更加鲜活 动画效果中我选择用的是UIView动画,弹...

  • 实现 iOS 前台时的推送弹窗效果

    实现 iOS 前台时的推送弹窗效果 实现 iOS 前台时的推送弹窗效果

  • 实现 iOS 前台时的推送弹窗效果

    实现 iOS 前台时的推送弹窗效果 实现 iOS 前台时的推送弹窗效果

  • iOS 左右抖动效果

  • iOS - 视图抖动效果

    实现视图抖动效果的思路 一、首先,如何让视图发生位移 UIView中定义了transform属性,其类型为CGAf...

  • iOS View 抖动效果

    在最近的项目中使用到View抖动的效果,就从StackOverflow搬运了一个在此记录一下。

  • iOS图标抖动效果

    开始抖动 停止抖动 UIViewAnimationOptions解释 有评论的朋友说解释一下UIViewAnima...

  • iOS图标抖动效果

    开始抖动 停止抖动 以上是左右抖动效果,另有放大缩小效果见Demo:https://github.com/fate...

  • iOS控件抖动效果

    方案一: 方案二 两个方案设置了同样的数据最后的显示结果也不太一样,目前还不清楚原因。 对应.m文件

  • iOS 半透明弹窗

    移动弹窗基础知识浅析——IOS 弹窗体系主流 APP 上的半透明弹窗效果: GitHub 第三方框架 类似样式的第...

网友评论

    本文标题:ios弹窗抖动效果

    本文链接:https://www.haomeiwen.com/subject/zfzllqtx.html