Swift 利用CGContext绘出仿微信的弹框

效果图:

Swift 利用CGContext绘出仿微信的弹框_第1张图片
弹框.gif

自定义outputView,代码贴上:

import UIKit

class OutputView: UIView,UITableViewDelegate,UITableViewDataSource {

    fileprivate var titleArr : [String] = []
    fileprivate var origin : CGPoint!
    fileprivate var tableview : UITableView!
    fileprivate var height : CGFloat = 40
    override init(frame: CGRect) {
        super.init(frame: frame)
        backgroundColor = UIColor.white
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    func setupTableview(_ titleArr:[String], origin:CGPoint){
        self.titleArr = titleArr
        self.origin = origin
        
        tableview = UITableView.init(frame: CGRect.init(x: origin.x, y: origin.y+10, width: 100, height: height*CGFloat(titleArr.count)), style: .plain)
        tableview.delegate = self
        tableview.dataSource = self
        tableview.separatorStyle = .singleLine
        tableview.separatorColor = UIColor.white
        tableview.separatorInset = .zero
        tableview.backgroundColor = UIColor.gray
        tableview.register(UITableViewCell.classForCoder(), forCellReuseIdentifier: "cell")
        tableview.isScrollEnabled = false
        addSubview(tableview)
        
    }
    
    func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return titleArr.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableview.dequeueReusableCell(withIdentifier: "cell")
        cell?.textLabel?.text = titleArr[indexPath.row]
        cell?.backgroundColor = UIColor.gray
        return cell!
    }
    
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return height
    }
    
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        dimiss()
        print(titleArr[indexPath.row])
    }
    
    
    override func draw(_ rect: CGRect) {
        //拿到当前视图准备好的画板
        let context = UIGraphicsGetCurrentContext()
        //填充颜色
        context?.setFillColor(UIColor.gray.cgColor)
        //画笔颜色
        context?.setStrokeColor(UIColor.gray.cgColor)
        //开始绘图
        context?.beginPath()
        context?.move(to: CGPoint.init(x: origin.x+20, y: origin.y))
        context?.addLine(to: CGPoint.init(x: origin.x+30, y: origin.y+10))
        context?.addLine(to: CGPoint.init(x: origin.x+10, y: origin.y+10))
        context?.closePath()
        context?.drawPath(using: .fillStroke)
    }
    
    func pop(){
        UIApplication.shared.keyWindow?.addSubview(self)
        self.alpha = 0
        let frame = self.tableview.frame
        self.tableview.frame = CGRect.init(x: self.origin.x, y: self.origin.y, width: 0, height: 0)
        UIView.animate(withDuration: 0.2) { 
            self.alpha = 1
            self.tableview.frame = frame
        }
    }
    
    func dimiss(){
        UIView.animate(withDuration: 0.2, animations: { 
            self.alpha = 0
            self.tableview.frame = CGRect.init(x: self.origin.x, y: self.origin.y, width: 0, height: 0)
        }) { (ret) in
            self.removeFromSuperview()
        }
    }
    
    override func touchesBegan(_ touches: Set, with event: UIEvent?) {
        if !(touches.first?.view?.isEqual(self.tableview))!{
            dimiss()
        }
    }
    
}

需要使用的时候:

        let x = btn.frame.origin.x
        let y = btn.frame.origin.y
        let origin = CGPoint.init(x: x, y: y)
        let titleArr : [String] = ["扫一扫","看一看","搜一搜"]
        outputView = OutputView.init(frame: self.view.bounds)
        outputView.setupTableview(titleArr, origin: origin)
        outputView.pop()

以上

你可能感兴趣的:(Swift 利用CGContext绘出仿微信的弹框)