zoukankan      html  css  js  c++  java
  • CAShaplayer实现一个加载动画

    思路:

    方法 创建一个图层,图层要求圆形,可传参数颜色、大小 

    方法 给图层设置位置和整个加载动画的大小

    之后给其添加动画,并且注意动画的beginTime要有间距

    创建Layer

    func createLayerWith(size:CGSize,color:UIColor) -> CALayer{

            let layer:CAShapeLayer = CAShapeLayer()

            let path:UIBezierPath = UIBezierPath()

            //addArcWithCenter,就是根据中心点画圆

            /**

             center:CGPoint 中心点

             radius:CGFloat 半径

             startAngle:CGFloat 开始的弧度

             endAngle:CGFloat 结束的弧度

             clockwise:Bool 绘图方向 true:顺时针 false:逆时针

             */

            path.addArcWithCenter(CGPointMake(size.width/2, size.height/2), radius: size.width/2, startAngle: 0, endAngle: CGFloat(2*M_PI), clockwise: false)

            layer.lineWidth = 2

            layer.fillColor = color.CGColor

            layer.backgroundColor = nil

            layer.path = path.CGPath

            return layer

        }

    根据传入参数,角度angle也就是每个圆对于圆心的角度,size就是小圆的半径,origin加载动画中心所在的位置,containerSize加载动画的尺寸,和颜色

        func createCircle(angle:CGFloat, size:CGFloat,origin:CGPoint,containerSize:CGSize,color:UIColor)->CALayer{

            let radius = containerSize.width/2

            let circle = createLayerWith(CGSizeMake(size, size), color: color)

            let frame = CGRectMake(origin.x+radius*(cos(angle)+1)-size/2, origin.y+radius*(sin(angle)+1)-size/2, size, size)

            circle.frame = frame

            return circle

        }

    以下是设置动画的过程,创建动画组

    let scaleAnimation = CAKeyframeAnimation.init(keyPath: "transform.scale")

            //该属性用以制定每个子路径的时间

            scaleAnimation.keyTimes = [0,0.5,1]

            //关键帧点

            scaleAnimation.values = [1,0.4,1]

            scaleAnimation.duration = 1

            

            

            let opacityAnimation = CAKeyframeAnimation.init(keyPath: "opacity")

            opacityAnimation.keyTimes = [0,0.5,1]

            opacityAnimation.values = [1,0.3,1]

            opacityAnimation.duration = 1

            

            let animation = CAAnimationGroup()

            

            animation.animations = [scaleAnimation,opacityAnimation]

            animation.duration = 1

            animation.repeatCount = HUGE

            animation.removedOnCompletion = false

            

            for index in 0...7{

                let circle = createCircle(CGFloat(M_PI_4*Double(index)), size: 10, origin: CGPointMake(50, 50), containerSize: CGSizeMake(50, 50), color: UIColor.redColor())

                animation.beginTime = Double(index)*0.125

                circle.addAnimation(animation, forKey: "animation")

                self.view.layer.addSublayer(circle)

            }

    效果图:

     

  • 相关阅读:
    第三章 AOP
    第二章 IoC
    第一章 Spring 概述
    框架整合
    后台管理工程搭建
    技术架构
    淘淘商城简介
    电商行业背景
    前言
    FutureTask的使用
  • 原文地址:https://www.cnblogs.com/fanxinguu/p/6020562.html
Copyright © 2011-2022 走看看