1)UIBezierPath - 직선 연결(그리기 전)

UIBezierPath란?

배지어 곡선 설명

직선 및 곡선 선분으로 구성된 경로 그리고 커스텀 뷰에 그릴 수 있는 것 이라고 합니다

OverView를 살펴봅시다

1)경로의 현재 점을 조작하여 경로의 형상을 설정합니다. 새 빈 경로 개체를 만들 때 현재 지점은 정의되지 않으며 명시적으로 설정해야 합니다. 세그먼트를 그리지 않고 현재 점을 이동하려면 이 move(to:)방법 을 사용합니다 라고 적혀있습니다

첫번째로 UIBezierPath객체를 만들어줍시다
두번째로 경로에 시작 위치를 뜻하는 move(to:)를 이용해 시작점을 찍도록 합시다

//첫번째
let path = UIBezierPath()
//두번째
path.move(to: CGPoint(x: 0, y:0))

위와 같이 객체를 만들고 시작하는 곳에 점을 찍습니다

(CGPoint로 x,y좌표를 설정)

2)시작점을 찍어었다면 이제 추가로 점을 하나 더 찍어 둘을 이어주면 간단한 직선을 보여줄 준비가 거의 다 끝나갑니다

이때 쓰는 메소드는 addLine(to: CGPoint) 입니다
이 메소드는 경로에 직선을 추가합니다. 즉 새로운 점을 찍고 처음에 찍은 점과 연결할 수 있습니다

path.addLine(to: CGPoint(x: 100, y: 100)

3)단일 베지어 경로 개체에는 열려 있거나 닫힌 하위 경로가 여러 개 포함될 수 있으며, 여기서 각 하위 경로는 연결된 일련의 경로 세그먼트를 나타냅니다. close()메서드를 호출하면 현재 지점에서 하위 경로의 첫 번째 지점까지 직선 세그먼트를 추가하여 하위 경로를 닫습니다

let path = UIBezierPath()
path.move(to: CGPoint(x: 0, y:0))
path.addLine(to: CGPoint(x: 100, y: 100)
path.close()

close() 메소드는 처음 찍은 점과 addLine(to:)로 찍은 점을 이어주는 역할을 한다고 생각하면 편합니다
(close(): 현재 지점에서 하위 경로의 첫 번째 지점까지 직선 선분을 추가하여 하위 경로를 닫는다 -> 번역시)

4)베지어 경로의 형상 및 속성을 구성한 후 stroke()및 fill()메서드를 사용하여 현재 그래픽 컨텍스트에서 경로를 그립니다
마지막으로 stroke(), fill()메소드를 이용하여 경로를 그리면 끝입니다!!
stroke()는 획 색상과 육관을 추적
fill()은 채우기 색상을 사용하여 점들을 연결해 둘러싸인 영역에 색을 채웁니다(UIColor이용)

//우리는 첫번째 점과 두번째 점을 이어주기 때문에 stroke()를 사용해봅시다
let path = UIBezierPath()
path.move(to: CGPoint(x: 0, y:0))
path.addLine(to: CGPoint(x: 100, y: 100)
path.close()
path.stroke()

이렇게 하면 끝!!일줄 알았지만 맨위를 보면.. 그리고 커스텀 뷰에 그릴 수 있는 것 이라고 합니다
다음에는 커스텀 뷰에 그리는 것까지 진행하도록 하겠습니다~

+
다음편 ㄲ~~