UIBezierPath로 점선을 그려봤어요.

5771 단어 Swift

개시하다


UIView를 점선으로 표현하는 방법 정보
사용용도는...어때?
있을 것 같은데, 그렇게 자주 사용할 기회가 없다는 느낌을 받을 수 있을까.알았으니까 기사를 써봤어요.

코드


플러스@IBDesignable 이유는 스토리보드에서 변경 사항을 확인하려고 덧붙인 것이다.
간은 UIBezier Path인데 이 Class는 Custoomview로 묘사한 선(직선, 곡선)인 것 같다.
DotLineView.swift
import UIKit

@IBDesignable
class DotLineView: UIView {

    // Inspectorで点線の色と幅を設定出来るようにする
    @IBInspectable var dotColor: UIColor = UIColor.gray
    @IBInspectable var lineWidth: CGFloat = 2.0

    override func draw(_ rect: CGRect) {
        let path = UIBezierPath()

        path.lineWidth = self.lineWidth

        // 他にround, squareを設定出来る
        path.lineCapStyle = .butt

        // 起点
        path.move(to: CGPoint(x: 0, y: rect.midY))
        // 帰着点
        path.addLine(to: CGPoint(x: rect.width, y: rect.midY))

        let dashes = [path.lineWidth, path.lineWidth]

        // 第一引数 点線の大きさ, 点線間の間隔
        // 第二引数 第一引数で指定した配列の要素数
        // 第三引数 開始位置
        path.setLineDash(dashes, count: dashes.count, phase: 0)

        // 点線の色設定
        dotColor.setStroke()

        // 点線の描画
        path.stroke()
    }
}

Storyboard


단지 View 구성의 UIView에서 DootLine View를 CustomClass로 지정했을 뿐입니다.

동작 확인


점선!!!

Line Width를 2에서 10으로 변경한 버전
Inspector에서 값을 변경한 결과가 반영되어 확인이 수월합니다!

끝맺다


그럼 Image를 UIImageView로 가져가는 게 더 편하지 않을까요?실상에서 이렇게 생각하지만 허선의 간격, 크기가 바뀌면 우리측의 장점은 바로 유연하게 바로 반영할 수 있다는 것입니다!
UIBezier Path에서 다양한 모양을 그렸지만, 반한 것도 오늘뿐이라고 생각했는데 즐거웠어요.
UIBezierPath 예술이 탄생한 것이 재미있어요...그렇게 지도 모른다, 아마, 아마...웃다 웃다
그림 그리기 이런 거 해도 되나?그래서 이번 달 안에 잘 할 수 있을까 싶어요!
경품: 축구장 같은 녀석

좋은 웹페이지 즐겨찾기