UIView之全屏幕可拖放——Swfit

本文介绍如何在Swift中创建自定义UIView,并实现拖动和平滑移动到屏幕边缘的功能。通过简单的两步实现,使得UIView可以在屏幕上自由移动并最终平滑停靠在边缘。

本次主要描述的是在Swfit移动APP开发中,如何在界面上添加一个自定义的View并且可以屏幕上随处放置位于左/右侧,类似苹果手机的圆圈点击进行操作。

如下操作:(两步实现)

  1. 定义UIView
  2. UIView添加点击事件(一个判断到移动,一个判断到点击)
  3. 代理传递到控制层
  4. 获取到屏幕的高度/宽度,逻辑处理

一:cell层

		var drapBtnView:UIView?

        drapBtnView = UIView()
        drapBtnView!.layer.cornerRadius = 30.0
        drapBtnView!.backgroundColor = UIColor.gray
        self.addSubview(drapBtnView!)
        
        drapBtnView!.snp.makeConstraints{(make)->Void in
            make.top.equalTo(self).offset(90)
            make.right.equalTo(self).offset(0)
            make.height.equalTo(60)
            make.width.equalTo(60)
        }
        
        //点击事件			
        drapBtnView!.addGestureRecognizer(UIPanGestureRecognizer(target: self, action: #selector(dragMoving(pan:))))
        
        drapBtnView!.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(tap(tap:))))

cell代理的实现

	protocol CookEditViewProtocol:NSObjectProtocol {
	  
	  func dragMoving(pan: UIPanGestureRecognizer)
	  
	  func tap(tap:UITapGestureRecognizer)
	  
	}
	
	class CookEditView: BaseView {
		weak var delegate:CookEditViewProtocol?
	
	  @objc func dragMoving(pan: UIPanGestureRecognizer){
	      if delegate != nil {
	          delegate!.dragMoving(pan:pan)
	      }
	  }
	  
	  @objc func tap(tap: UITapGestureRecognizer){
	      if delegate != nil {
	          delegate!.tap(tap:tap)
	      }
	  }
	  }

二:Controller控制层

1.继承到cell的代理CookEditViewProtocol
2.定义private var cookEditView = CookEditView
3.初始化cookEditView.delegate = self
class CookEditViewController: BaseViewController,UITableViewDelegate,UITableViewDataSource,UITextFieldDelegate,UITextViewDelegate,UIGestureRecognizerDelegate,CookEditViewProtocol{

    let HEIGHT = UIScreen.main.bounds.size.height
    let WIDTH = UIScreen.main.bounds.size.width

	//这就是cell传递过来的移动监听事件
    func dragMoving(pan: UIPanGestureRecognizer) {
        
        let point = pan.translation(in: view)
        
        if pan.state == .began {
            
            pan.view?.alpha = 0.8   
        }
        
        pan.view?.center = CGPoint(x: pan.view!.center.x + point.x, y: pan.view!.center.y + point.y)
        
        pan.setTranslation(.zero, in: view)
        
        if pan.state == .ended {
            
            if let v = pan.view{
                
                // 计算 当前view 距离屏幕上下左右的距离
                
                let top = v.frame.minY - 120;
                let left = v.frame.minX ; v.alpha = 1

                let bottom = view.frame.height - v.frame.maxY
                let right = WIDTH - v.frame.maxX

                // 计算出 view 距离屏幕边缘距离的最小值
                let temp = [top,left,bottom,right].sorted().first
                
                // 平移动画
                UIView.animate(withDuration: 0.3, delay: 0.3, usingSpringWithDamping: 1, initialSpringVelocity: 1, options: .curveEaseInOut, animations: {
                    
                    if temp == top{
                        
                        v.transform = v.transform.translatedBy(x: 0, y: -top)
                        
                    }else if temp == left{
                        
                        v.transform = v.transform.translatedBy(x: -left, y: 0)
                        
                    }else if temp == bottom{
                        
                        v.transform = v.transform.translatedBy(x: 0, y: bottom)
                        
                    }else{
                        
                        v.transform = v.transform.translatedBy(x: right, y: 0)
                        
                    }
                    
                }, completion: { (finish) in
                    
                })
            }
        }
    }

    func tap(tap: UITapGestureRecognizer) {
		print("这就是uiview的点击")
    }
}

三:结束:以上两个方法直接挪用就可以,很直观很炫酷。
在这里插入图片描述

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值