在 JPEG 图像上绘制一条简单的线

Question

我又被一个看似简单的问题困住了。

我将 JPEG 文件加载到 CGImage 中。我获得了正确的宽度和高度值（以像素为单位），并且能够在 ImageView 控制器中显示 "myImage"。但我想在此图像上添加一些图形，发现我应该改为将它放入 NSImage 中。所以我做了，但得到了不同的（比例）宽度和高度值：595.08 而不是 1653，841.68 而不是 2338，分别。

我试图从 CGContext 'gc' 创建一个 NSCGContext 用于绘图（一条简单的线和一个矩形），结果 "Value of optional type 'CGContext?' not unwrapped, did you mean to use '!' or '?'?"...我迷路了...

// with NSData
//
let imageAsData = try Data(contentsOf: chosenFiles[0])
let imageProvider = CGDataProvider(data: imageAsData as CFData)
var myImage = CGImage(jpegDataProviderSource: imageProvider!, decode: nil, shouldInterpolate: true, intent: .defaultIntent)
let imageWidth = myImage!.width
let imageHeight = myImage!.height

// with NSImage, now
//
let imageAsNSImage=NSImage(contentsOf: chosenFiles[0])
let imageSize=imageAsNSImage?.size      // ---> 0.36 * pixels 

// creating a CG context and drawing
//
let colorSpace:CGColorSpace = CGColorSpaceCreateDeviceRGB()
let gc = CGContext(data: nil, width: imageWidth, height: imageHeight, bitsPerComponent: 8, bytesPerRow: 0,space: colorSpace, bitmapInfo: CGImageAlphaInfo.noneSkipFirst.rawValue)
let NSGContext = NSGraphicsContext(cgContext: gc, flipped: true)
let currentContext = NSGraphicsContext.current()  // Cocoa GC object appropriate for the current drawing environment
NSGraphicsContext.saveGraphicsState()
NSGraphicsContext.current = NSGContext
NSGContext?.beginPath()
NSGContext?.setStrokeColor(redColor)
NSGContext?.setLineWidth(50.0)
NSGContext?.move(to: targetStart)
NSGContext?.addLine(to: targetEnd)
NSGContext?.setStrokeColor(grayColor)
NSGContext?.setFillColor(grayColor)
NSGContext?.addRect(ROIRect)
NSGContext?.closePath()
NSGContext.restoreGraphicsState()
imageAsNSImage?.draw(at: NSZeroPoint, from: NSZeroRect, operation: NSCompositeSourceOver, fraction: 1.0)
imageAsNSImage?.unlockFocus()
NSGraphicsContext.setcurrent(currentContext)
myImageView.image = imageAsNSImage  // image & drawings should show in View

Answer 1

Drawing a simple line on a JPEG image

// load JPEG from main bundle
guard let path = Bundle.main.pathForImageResource(NSImage.Name("picture.jpg")),
      let image = NSImage(contentsOfFile: path)
else { fatalError() }
let size = image.size

image.lockFocus()  // prepare image for drawing

NSColor.red.setStroke()
NSBezierPath.strokeLine(from: .zero, to: NSPoint(x: size.width, y: size.height))

image.unlockFocus()  // drawing commands done

上面的代码从左下角到右上角绘制了一条红线。如果手边有NSImageView可以直接使用图片：

@IBOutlet weak var imageView: NSImageView!
...
imageView.image = image

Answer 2

感谢 djromero，这是我刚刚得到的解决方案：

// Load the JPEG image from disk into a CGImage
//
let imageAsData = try Data(contentsOf: chosenFiles[0])
let imageProvider = CGDataProvider(data: imageAsData as CFData)
var myImage = CGImage(jpegDataProviderSource: imageProvider!, decode: nil, shouldInterpolate: true, intent: .defaultIntent)

// Create a NSImage from the CGImage (with the same width and height in pixels)
//
let imageAsNSImage=NSImage(cgImage: myImage!, size: NSZeroSize)

// Drawing a simple line
//
imageAsNSImage.lockFocusFlipped(true) // Otherwise, the origin is at the lower left corner
NSColor.red.setStroke()
NSBezierPath.strokeLine(from: targetStart, to: targetEnd)
imageAsNSImage.unlockFocus()

// Show the NSImage in the NSImageView
//
myImageView.image = imageAsNSImage

在 JPEG 图像上绘制一条简单的线

Drawing a simple line on a JPEG image

swift

image

macos

quartz