iOSプログラミング with Swift 2


2016.06.01: created by

SwiftでCoreGraphicsを使う

2Dグラフィックスを手軽に使うための方法が CoreGraphics です。 下の例では、画面上に UIViewのオブジェクトを1個配置し、 その中の表示を制御するために新しいクラス MyCGView を作成しています。 MyCGViewクラスの drawRect: メソッドに記述した通りに UIView オブジェクトの中が描画されます。 描画する図形や表示に関するメソッドについては、他の資料を検索して下さい。
  1. Xcode を起動して "Create a new Xcode project" で "Single View Application" として新しいプロジェクトを開きます。 ここではプロジェクト名を SwiftGraphics としています。



  2. Main.storyboard上の ViewController の上に、ウィンドウ右下の "Object library" から "View" をドラッグして配置します。



  3. ウィンドウ左の "Show the project navigator" でプロジェクト名のフォルダを右クリックして"New File"を選択する。



  4. "Choose a template for your new file" では、 iOS -> Source -> "Cocoa Touch Class"を選択して"Next"をクリックする。



  5. Subclss of: に対しては "UIView" を、言語には "Swift" 選択し Class: には適当な名前をつける。ここでは MyCGView とした。



  6. MyCGView.swift が生成されるフォルダは、他のファイルと同じく SwiftGraphics のままで構わない。



  7. ウィンドウ左の project navigator から Main.storyboardを選ぶ。 新しくできた View を1回クリックして選択してから ウィンドウ右の "Show the identity inspector" を選んで、Custom Class の Class を先ほど作成した MyCGView を選択する。



  8. MyCGView.swift を変更します。
  9. MyCGView.swiftに追加するコード(赤字部分)
    import UIKit
    
    class MyCGView: UIView {
        override func drawRect(rect: CGRect) {
            let context: CGContextRef = UIGraphicsGetCurrentContext()!
            CGContextSetRGBFillColor(context,0.0, 1.0, 0.0, 1.0)
            CGContextSetLineWidth(context, 5.0)
            var r1: CGRect = CGRectMake(20,20,50,50)
            CGContextAddRect(context,r1)
            CGContextFillPath(context)
         
            CGContextSetRGBStrokeColor(context, 1.0, 0.0, 0.5, 1.0)
            r1 = CGRectMake(30,30,70,70)
            CGContextAddRect(context,r1)
            CGContextStrokePath(context)
         
            CGContextSetLineWidth(context, 2)
            CGContextSetRGBStrokeColor(context, 0, 0, 1, 1)
            CGContextMoveToPoint(context, 15, 70)
            CGContextAddLineToPoint(context, 280, 200)
            CGContextStrokePath(context)
         
            let attrString = NSAttributedString(
                string: "漢字abc",
                attributes:[NSForegroundColorAttributeName: UIColor.greenColor(),
                    NSFontAttributeName: UIFont.boldSystemFontOfSize(20.0)])
            attrString.drawAtPoint(CGPointMake(40, 70))
        }
    }
    
  10. Xcodeを起動中にiOSデバイスを Mac に接続すると、 Xcode のstatusに "Processing symbol files" と表示されて、しばらく待つと 左上の実行デバイスに 接続したiOSデバイスの名前が表示される。 これを選択して実行する。



  11. サンプルのプロジェクトはこちら。(Xcode 7.3.1版)


http://nw.tsuda.ac.jp/