Post

UIKit - 점선(Dash border) 적용하기

Posted
By
1 min read
UIKit - 점선(Dash border) 적용하기

UIKit에서는 점선을 그려면 CAShapeLayer 클래스를 사용해서 직접 점선을 그려줘야함.

CreateBookViewController.swift

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

import UIKit

final class CreateBookViewController: UIViewController {

  private let createBookView = CreateBookView()

  override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    // 레이어가 중첩되지 않도록 제거
    createBookView.chooseBookImageContainer.layer.sublayers?.removeAll(where: { $0 is CAShapeLayer})

    // 패턴 정의
    let lineDashPattern: [NSNumber]? = [15, 3]

    let shapeLayer = CAShapeLayer()

    // 색상 지정
    shapeLayer.strokeColor = UIColor.border.cgColor

    // 두께 지정
    shapeLayer.lineWidth = 4

    // 패턴 지정
    shapeLayer.lineDashPattern = lineDashPattern

    // 선 그리기
    let path = UIBezierPath(rect: createBookView.chooseBookImageContainer.bounds)

    shapeLayer.path = path.cgPath
    shapeLayer.fillColor = .none

    createBookView.chooseBookImageContainer.layer.addSublayer(shapeLayer)
  }
}

view의 정확한 width, height를 사용하기 위해서 viewDidLayoutSubviews 내부에서 처리함.

결과

image

Reference

Mobile, iOS
ios uikit cashapelayer cgmutablepath
This post is licensed under CC BY 4.0 by the author.