【Swift】水波纹 加 镂空

在这里插入图片描述

//
//  HollowViewController.swift
//  eee
//
//  Created by admin on 2022/7/28.
//

import UIKit

class HollowViewController: MainViewController {

    
    lazy var waveView: UIView = {
        let view = UIView.init(frame: CGRect(x: 0, y: 100, width: UIScreen.main.bounds.width, height: 200))
        view.backgroundColor = UIColor.gray
        return view
    }()
    
    lazy var firstWaveLayer: CAShapeLayer = {
        let layer = CAShapeLayer()
        
        return layer
    }()
    
    lazy var secondWaveLayer: CAShapeLayer = {
        let layer = CAShapeLayer()
        
        return layer
    }()
    /// 基础描述 正弦函数
    ///  y=Asin(ωx+φ)+ b
    ///  A : wavaA 振幅 (最大值 - 最小值)/ 2
    ///  w : 1/waveW w = 2π / T(T是最小正周期,一般是view的宽度)
    ///  φ : offsetφ 移动 左右移动
    ///  b : b 在原有振幅基础上向上或线下平移
    
    private var waveA: CGFloat = 8
    private var waveW: CGFloat = 0
    private var offsetX: CGFloat = 0
    private var b : CGFloat = 0
    //水纹的移动的速度
    var waveSpeed : CGFloat = 0.05
    
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.title = "镂空图层动画"
        
        // w = 2π / T(T是最小正周期,一般是view的宽度)
        
        // 设置周期 :( 2* M_PI)/waveW = bounds.size.width 。因为涉及的是layer,所以只谈bounds,不说frame
        waveW = Double.pi * 2 / UIScreen.main.bounds.width
        
        b = self.waveView.bounds.size.height / 2
        
        self.view.addSubview(self.waveView)
        hollowLayer()
        waveLayer()
        
        
    }
    
    func waveLayer(){

        self.firstWaveLayer.fillColor =  UIColor(red:  69/255.0, green:  255/255.0, blue: 255/255.0, alpha: 0.5).cgColor
        self.secondWaveLayer.fillColor =  UIColor(red:  69/255.0, green:  255/255.0, blue: 255/255.0, alpha: 0.5).cgColor
        self.waveView.layer.addSublayer(firstWaveLayer)
        self.waveView.layer.addSublayer(secondWaveLayer)
        
        let link = CADisplayLink(target: self, selector: #selector(getCurrentWave))
        link.add(to: RunLoop.main, forMode: RunLoop.Mode.common)
    }
    
    
    @objc func getCurrentWave(){
        offsetX += waveSpeed
        
        let path = UIBezierPath()
        path.move(to: CGPoint(x: 0, y: b))
        let width = self.waveView.bounds.width
        let height = self.waveView.bounds.height
        let d = Int.init(width)
        var y = 0.0;
        
        for x in 0 ... d {
             y = waveA * sin(waveW * CGFloat(x) + offsetX) + b
            path.addLine(to: CGPoint.init(x: CGFloat(x), y: y))
        }
        
        path.addLine(to: CGPoint(x: width, y:height ))
        
        path.addLine(to: CGPoint(x: 0, y: height))
        path.addLine(to: CGPoint(x: 0, y: b))
        
        path.close()
        
        self.firstWaveLayer.path = path.cgPath
        
        
        let path1 = UIBezierPath()
        path1.move(to: CGPoint(x: 0, y: b))

        var y1 = 0.0;
        
        for x in 0 ... d {
             y1 = waveA * sin(waveW * CGFloat(x) + offsetX - 100) + b
            path1.addLine(to: CGPoint.init(x: CGFloat(x), y: y1))
        }
        
        path1.addLine(to: CGPoint(x: width, y:height ))
        
        path1.addLine(to: CGPoint(x: 0, y: height))
        path1.addLine(to: CGPoint(x: 0, y: b))
        
        path1.close()
        
        self.secondWaveLayer.path = path1.cgPath
        
        
        
        
    }
    
    
    
    func hollowLayer(){
        let hollowLayer = CAShapeLayer()
        hollowLayer.bounds = CGRect(x: 0, y: 0, width: 100, height: 100)
//        hollowLayer.backgroundColor = UIColor.red.cgColor
        self.view.layer.addSublayer(hollowLayer)
        hollowLayer.position = self.view.center
        
        
        let squarePath = UIBezierPath.init(roundedRect: CGRect(x: 0, y: 0, width: 100, height: 100), cornerRadius: 15)
        let hollowPath = UIBezierPath.init(ovalIn: CGRect(x: 10, y: 10, width: 80, height: 80))

        squarePath.append(hollowPath)

        hollowLayer.path = squarePath.cgPath
        hollowLayer.fillColor = UIColor.lightGray.cgColor
        hollowLayer.fillRule = .evenOdd
        
        
        let processSectorLayer = CAShapeLayer()
        self.view.layer.addSublayer(processSectorLayer)
        processSectorLayer.bounds = CGRect(x: 0, y: 0, width: 70, height: 70)
        processSectorLayer.position = self.view.center

        let processSectorPath = UIBezierPath.init(arcCenter: CGPoint.init(x: 35, y: 35), radius: 17.5, startAngle: 0, endAngle: CGFloat.pi * 2, clockwise: true)
        processSectorLayer.path = processSectorPath.cgPath
        processSectorLayer.lineWidth = 35
        
        processSectorLayer.strokeStart = 0.5
        processSectorLayer.strokeEnd = 0.75
        
        processSectorLayer.fillColor = UIColor.clear.cgColor
        processSectorLayer.strokeColor = UIColor.lightGray.cgColor
    }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值