[Xcode 实际操作]九、实用进阶-(19)重写父类的绘图方法，使用图形上下文绘制自定义图形

热烈欢迎，请直接点击！！！

进入博主App Store主页，下载使用各个作品！！！

注：博主将坚持每月上线一个新app！！！

目录：[Swift]Xcode实际操作

本文将演示如何使用图形上下文，绘制自定义图形。

使用快捷键【Command】+【N】创建一个新的类文件。

(在项目文件夹【DemoApp】上点击鼠标右键【New File】创建)

->【Cocoa Touch Class】->【Next】->

【Class】:QuartzView。输入类名。

【Subclass of】：UIView,父类名称

【Language】:Swift，类文件的默认语言

->【Next】->保存默认的存储位置点击【Create】

首先重写父类的绘图方法，打开代码文件QuartzView.swift

import UIKit

class QuartzView: UIView {
    // Only override drawRect: if you perform custom drawing.
    // An empty implementation adversely affects performance during animation.
    override func draw(_ rect: CGRect) {
        // Drawing code
        
        //在绘制图形前，一般先要活儿当前绘图环境的图形上下文
        //获得当前视图的图形上下文
        let context = UIGraphicsGetCurrentContext()
        
        //在图形上下文中，创建和设置背景填充颜色为紫色
        context?.setFillColor(red: 1.0, green: 0.0, blue: 1.0, alpha: 1.0)
        //使用紫色填充图形区域，作为图形的背景色
        context?.fill(rect)
        //创建和设置边框颜色为黑色，透明度为1(不透明)
        context?.setStrokeColor(red: 0, green: 0, blue: 0, alpha: 1.0)
        
        //创建一个位置在(40,80)，尺寸为(240,40)的显示区域
        let rect2 = CGRect(x: 40, y: 80, width: 240, height: 40)
        //设置矩形对象的位置及尺寸，并将矩形边框添加至上下文，作为绘制矩形的准备工作
        context?.addRect(rect2)
        //设置对矩形进行描边的宽度值为5
        context?.setLineWidth(5.0)
        //在图形上下文中，绘制矩形边框
        context?.strokePath()
        
        //接着在矩形边框内，绘制一行文字
        //首先创建一个字号为32的粗字体
        let font = UIFont.boldSystemFont(ofSize: 32)
        //设置需要绘制的文字内容
        let text:NSString = "Hello"
        //设置文字的显示位置在(50,80)，尺寸为(80,30)
        let rect3 = CGRect(x: 50, y: 80, width: 80, height: 30)
        //然后将文字以指定的字体样式，绘制在设置的目标区域内
        text.draw(in: rect3, withAttributes: [NSAttributedString.Key.font:font])
        
        //设置绘图描边的宽度为5
        context?.setLineWidth(5.0)

        //继续绘制一个三角形
        //设置线条的挂角样式为圆角样式
        context?.setLineCap(CGLineCap.round)
        //设置线条描边的颜色为白色，透明度为不透明
        context?.setStrokeColor(red: 1, green: 1, blue: 1, alpha: 1)
        
        //创建一个坐标数组，作为线条各个锚点的坐标
        let points = [CGPoint(x: 40, y: 200), CGPoint(x: 40, y: 300),
                      CGPoint(x: 280, y: 300), CGPoint(x: 40, y: 200)]
        //将锚点坐标的连线，置入图形上下文
        context?.addLines(between: points)
        //执行上下文的描边操作
        context?.strokePath()
    }
}

在项目导航区，打开视图控制器的代码文件【ViewController.swift】

在视图控制器内，创建刚刚自定义的视图。

import UIKit

class ViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        //获得当前根视图的显示区域
        let rect = self.view.bounds
        //初始化自定义视图对象
        let view = QuartzView()
        //并将自定义视图的显示区域，设置为与根视图相同
        view.frame = rect
        
        //将自定义视图，添加到当前视图控制器的根视图
        self.view.addSubview(view)
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}