Swiftで点線を描く
こんにちは、アプリ開発者の@HituziANDOです。
この記事ではSwiftで点線を描く方法を紹介します。Swiftで点線を描くのは簡単です。
まずはコードから↓。下記のコードはUIImageViewを継承したクラスのdraw(_:)メソッドを抜粋したものです。
public override func draw(_ rect: CGRect) { UIGraphicsBeginImageContext(self.frame.size) guard let context = UIGraphicsGetCurrentContext() else { return } // ブレンドモードの設定 context.setBlendMode(.normal) // 線の色の設定 UIColor.black.setStroke() // 点線の設定 context.setLineDash(phase: 0, lengths: [5.0, 5.0]) // 線幅の設定 context.setLineWidth(1.0) // 始点 context.move(to: CGPoint(x: 10.0, y: 10.0)) // 終点 context.addLine(to: CGPoint(x: 100.0, y: 100.0)) // 線を引く context.strokePath() // UIImageに書き出す let image = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() // UIImageViewのimageにセット self.image = image }
点線を描く上でのポイントは、setLineDash(phase:, lengths:)メソッドです。このメソッドのlengthsに点線のパターンを指定します。指定の仕方は、[実線の長さ, 空白の長さ]で指定します。
例えば、[5.0, 5.0]で指定した場合は下図のように描画され、
[20.0, 10.0]で指定した場合は下図のように描画されます。
なお、phaseは0のままで良いと思います。
その他の設定はコードのコメントの通りです。ブレンドモードについては公式リファレンス(https://developer.apple.com/documentation/coregraphics/cgblendmode)を一度読んでみて、色々設定を変えながら試してみると良いです。
さいごに
僕が個人開発している手書きノートアプリ「Blue Sketch」でも点線を描くことができます（本記事で使った画像もこのアプリで描いたものです）。
Blue Sketchは、手書きで自由に、すばやく書けるシンプルなノートアプリです。青いキャンバスに白線のみ書けるという最小限の機能だからこそ、書くことに集中できます。
Blue SketchはApp Storeで無料で配信中です。気になった方はぜひインストールしてみてください！
Mac版
