Skip to main content
誤り訂正をしました。
ソース リンク
nagonsoftware
  • 1,921
  • 2
  • 10
  • 13
override func draw(_ dirtyRect: NSRect) {
        super.draw(dirtyRect)
        
        guard let context = NSGraphicsContext.current(),
              let image = NSImage(contentsOfFile: path as String) else {
            return
        }

        var imageRect = NSRect(x: 32.0, y: 32.0, width: image.size.width, height: image.size.height)
        if let cgImage = image.cgImage(forProposedRect: &imageRect, context: context, hints: nil) {
            lockFocus()
            context.cgContext.draw(cgImage, in: imageRect)
            unlockFocus()
        }
    }
}

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
ここでは、QuartzCoreフレームワークを使ったケースを紹介します。QuartzCoreでは、CGLayerCALayerクラスが、描画の単位となっていて、addSublayer()によって、レイヤーを多層化し、複雑な構成を実現します。レイヤーごとにCGAffineTransformあるいはCATransform3Dによる座標変換を加えることができます。アナログ時計の時針、分針、秒針を、別々に動かすのに、適しています。

override func draw(_ dirtyRect: NSRect) {
        super.draw(dirtyRect)
        
        guard let context = NSGraphicsContext.current(),
              let image = NSImage(contentsOfFile: path as String) else {
            return
        }

        var imageRect = NSRect(x: 32.0, y: 32.0, width: image.size.width, height: image.size.height)
        if let cgImage = image.cgImage(forProposedRect: &imageRect, context: context, hints: nil) {
            lockFocus()
            context.cgContext.draw(cgImage, in: imageRect)
            unlockFocus()
        }
    }
}

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
ここでは、QuartzCoreフレームワークを使ったケースを紹介します。QuartzCoreでは、CGLayerクラスが、描画の単位となっていて、addSublayer()によって、レイヤーを多層化し、複雑な構成を実現します。レイヤーごとにCGAffineTransformあるいはCATransform3Dによる座標変換を加えることができます。アナログ時計の時針、分針、秒針を、別々に動かすのに、適しています。

override func draw(_ dirtyRect: NSRect) {
        super.draw(dirtyRect)
        
        guard let context = NSGraphicsContext.current(),
              let image = NSImage(contentsOfFile: path as String) else {
            return
        }

        var imageRect = NSRect(x: 32.0, y: 32.0, width: image.size.width, height: image.size.height)
        if let cgImage = image.cgImage(forProposedRect: &imageRect, context: context, hints: nil) {
            context.cgContext.draw(cgImage, in: imageRect)
        }
    }
}

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
ここでは、QuartzCoreフレームワークを使ったケースを紹介します。QuartzCoreでは、CALayerクラスが、描画の単位となっていて、addSublayer()によって、レイヤーを多層化し、複雑な構成を実現します。レイヤーごとにCGAffineTransformあるいはCATransform3Dによる座標変換を加えることができます。アナログ時計の時針、分針、秒針を、別々に動かすのに、適しています。

追加の説明をしました。
ソース リンク
nagonsoftware
  • 1,921
  • 2
  • 10
  • 13

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
(後ほどここではもう少し詳しい説明QuartzCoreフレームワークする予定に使ったケースを紹介ます。QuartzCoreでは、CGLayerクラスが、描画の単位となっていて、addSublayer()によって、レイヤーを多層化し、複雑な構成を実現します。)。レイヤーごとにCGAffineTransformあるいはCATransform3Dによる座標変換を加えることができます。アナログ時計の時針、分針、秒針を、別々に動かすのに、適しています。

import Cocoa

class MyView: NSView {
    
    var subLayer = CALayer()
    // Storyboard、Interface Builderからインスタンスを生成した時の、初期化処理。
    override func awakeFromNib() {
        super.awakeFromNib()
        
        wantsLayer = true // レイヤー操作を有効にする。
        subLayer.contents = NSImage(named: "a.png") // レイヤーにイメージを貼り付け。
        subLayer.frame = CGRect(x: 50.0, y: 50.0, width: 50.0, height: 50.0)
        layer?.addSublayer(subLayer) // MyViewのviewのサブレイヤーにする。
    }
    // マウスをクリックしたら、
    override func mouseDown(with event: NSEvent) {
        let affinTransform = subLayer.affineTransform()
        subLayer.setAffineTransform(affinTransform.rotated(by: CGFloat.pi / 4.0))
        // レイヤーが45度ずつ回転する。
        
//        subLayer.transform = CATransform3DRotate(subLayer.transform, CGFloat.pi / 4.0, 0.0, 0.0, 1.0)
        // CATransform3Dを利用する場合は、こちら。
    }
}

ここでは、QuartzCoreの、CALayerCATransform3Dを紹介しましたが、CAAnimationクラスと、そのサブクラスについても、勉強してみてください。

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
(後ほどもう少し詳しい説明する予定にしています。)

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
ここではQuartzCoreフレームワーク使ったケースを紹介ます。QuartzCoreでは、CGLayerクラスが、描画の単位となっていて、addSublayer()によって、レイヤーを多層化し、複雑な構成を実現します。レイヤーごとにCGAffineTransformあるいはCATransform3Dによる座標変換を加えることができます。アナログ時計の時針、分針、秒針を、別々に動かすのに、適しています。

import Cocoa

class MyView: NSView {
    
    var subLayer = CALayer()
    // Storyboard、Interface Builderからインスタンスを生成した時の、初期化処理。
    override func awakeFromNib() {
        super.awakeFromNib()
        
        wantsLayer = true // レイヤー操作を有効にする。
        subLayer.contents = NSImage(named: "a.png") // レイヤーにイメージを貼り付け。
        subLayer.frame = CGRect(x: 50.0, y: 50.0, width: 50.0, height: 50.0)
        layer?.addSublayer(subLayer) // MyViewのviewのサブレイヤーにする。
    }
    // マウスをクリックしたら、
    override func mouseDown(with event: NSEvent) {
        let affinTransform = subLayer.affineTransform()
        subLayer.setAffineTransform(affinTransform.rotated(by: CGFloat.pi / 4.0))
        // レイヤーが45度ずつ回転する。
        
//        subLayer.transform = CATransform3DRotate(subLayer.transform, CGFloat.pi / 4.0, 0.0, 0.0, 1.0)
        // CATransform3Dを利用する場合は、こちら。
    }
}

ここでは、QuartzCoreの、CALayerCATransform3Dを紹介しましたが、CAAnimationクラスと、そのサブクラスについても、勉強してみてください。

ソース リンク
nagonsoftware
  • 1,921
  • 2
  • 10
  • 13

読み込んだ image は NSImage ですが、 context.draw() の引数は CGImage でなければならないためエラーになっているように見えます。

これは、NSImageのメソッドcgImage(forProposedRect:context:hints:)を使って、CGImageに変換します。

override func draw(_ dirtyRect: NSRect) {
        super.draw(dirtyRect)
        
        guard let context = NSGraphicsContext.current(),
              let image = NSImage(contentsOfFile: path as String) else {
            return
        }

        var imageRect = NSRect(x: 32.0, y: 32.0, width: image.size.width, height: image.size.height)
        if let cgImage = image.cgImage(forProposedRect: &imageRect, context: context, hints: nil) {
            lockFocus()
            context.cgContext.draw(cgImage, in: imageRect)
            unlockFocus()
        }
    }
}

こういったケースでは通常どのようにすれば良いのでしょうか?

Core Graphicsフレームワークは、正直お勧めできません。アナログ時計といっても、イメージを動かすのは、静的イメージを描画するためのCore Graphicsは、なじまないと思います。QuartzCoreフレームワークか、ゲーム製作フレームワークのSpriteKitなどがお勧めになります。
(後ほど、もう少し詳しい説明をする予定にしています。)