如何旋转CGContextDrawImage()
在其中心绘制的图像?
在drawRect:
CGContextSaveGState(c);
rect = CGRectOffset(rect, -rect.size.width / 2, -rect.size.height / 2);
CGContextRotateCTM(c, angle);
CGContextDrawImage(c, rect, doodad.CGImage);
CGContextRotateCTM(c, -angle);
CGContextTranslateCTM(c, pt.x, pt.y);
prevRect = rect;
CGContextRestoreGState(c);
我在原点绘制图像,然后在中心旋转图像,然后转换到应该绘制的位置。不工作。
答案 0 :(得分:39)
要记住的关于坐标转换的事情 - 好吧,要记住的事情的一个 - 你不是在操纵对象,比如图形编辑器中的Transform命令;你正在操纵空间本身。
想象一下,该装置通过鹅颈臂悬挂在桌子上,并固定在适当的位置。坐标转换可以移动桌面(平移),并以一种方式或另一种方式(旋转)转动,甚至压缩和拉伸(缩放)。
关于坐标变换需要记住的另一件事是变换总是相对于原点。想象一下,您的桌子的一个角落 - 对应于您视角的一角 - 直接位于您的视图最终在屏幕上的角落下方。翻译移动桌子的角落,桌子的其余部分随之滑动,在屏幕下方以某种方式滑动。旋转使桌子绕着那个角落转动。
还有一件事:转型影响未来,而不是过去。绘制一些东西然后尝试变换它将无法工作,因为你没有变换你绘制的东西,你将变换你要绘制的空间。因此,我们需要移动桌面才能将图像放在正确的位置。
(我提到最后一部分是因为你有几个转换命令会被你的CGContextRestoreGState
电话立即还原。它们之间没有任何关系可以影响它们。)
所以,让我们从未旋转的图像矩形开始。
CGRect imageRect = { pointWhereYouWantTheImageCentered, doodad.size };
现在,CGContextDrawImage
采用矩形,但是,如您所知,它将从该矩形的左下角绘制图像,而不是中心。 (因此整个练习。)
所以,这就是你要做的事情。在这结束时,你将不是在上面显示的那一点绘制图像,而是在零点处绘制 - 即在桌子的角落。 (不是在角落的中心,而是桌面角落的图像角落。)
这将如何运作?这需要一些设置。你将不得不移动你的桌子。
首先,您需要将办公桌向上移动并向右移动,直到办公桌的原点位于所需的中心点:
CGContextTranslateCTM(context, imageRect.origin.x, imageRect.origin.y);
然后你进行旋转(将桌子转到原点角落):
CGContextRotateCTM(context, angleInRadians);
然后将桌面向后移动向下移动,将向左移动移动图像宽度和高度的一半:
CGContextTranslateCTM(context, imageRect.size.width * -0.5, imageRect.size.height * -0.5);
然后,最后,将图像放在桌子的角落。
CGContextDrawImage(context, (CGRect){ CGPointZero, imageRect.size }, [doodad CGImage]);
当您的桌子移动时,该矩形的中心位于屏幕上您希望图像居中的点的正下方,因此图像居中。
答案 1 :(得分:1)
此功能可以在旋转角度为弧度的现有图像上绘制图像。
斯威夫特3:
extension UIImage {
func putImage(image: UIImage, on rect: CGRect, angle: CGFloat = 0.0) -> UIImage{
let drawRect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
UIGraphicsBeginImageContextWithOptions(drawRect.size, false, 1.0)
// Start drawing self
self.draw(in: drawRect)
// Drawing new image on top
let context = UIGraphicsGetCurrentContext()!
// Get the center of new image
let center = CGPoint(x: rect.midX, y: rect.midY)
// Set center of image as context action point, so rotation works right
context.translateBy(x: center.x, y: center.y)
context.saveGState()
// Rotate the context
context.rotate(by: angle)
// Context origin is image's center. So should draw image on point on origin
image.draw(in: CGRect(origin: CGPoint(x: -rect.size.width/2, y: -rect.size.height/2), size: rect.size), blendMode: .normal, alpha:
1.0)
// Go back to context original state.
context.restoreGState()
// Get new image
let newImage = UIGraphicsGetImageFromCurrentImageContext()!
UIGraphicsEndImageContext()
return newImage
}
}
如果您需要创建并清空大小和颜色的图像,请使用:
extension UIImage {
convenience init?(size: CGSize, color: UIColor) {
let rect = CGRect(origin: .zero, size: size)
UIGraphicsBeginImageContextWithOptions(rect.size, true, 1.0)
color.setFill()
UIRectFill(rect)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
guard let cgImage = image?.cgImage else { return nil }
self.init(cgImage: cgImage)
}
}
答案 2 :(得分:0)
您可以使用以下方法旋转图像。
-(UIImage*)rotateImage:(UIImage*)img forAngle:(CGFloat)radian {
UIView *rotatedViewBox = [[UIView alloc]initWithFrame:CGRectMake(0, 0, img.size.width, img.size.height)];
CGAffineTransform t = CGAffineTransformMakeRotation(radian);
rotatedViewBox.transform = t;
CGSize rotatedSize = rotatedViewBox.frame.size;
UIGraphicsBeginImageContext(rotatedSize);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextTranslateCTM(context, rotatedSize.width, rotatedSize.height);
CGContextRotateCTM(context, radian);
CGContextScaleCTM(context, 1.0, -1.0);
CGContextDrawImage(context, CGRectMake(-img.size.width, -img.size.height, img.size.width, img.size.height), img.CGImage);
UIImage *returnImg = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return returnImg;
}
如果你使用角度,那么这里是将度数转换为弧度的宏
#define DEGREES_TO_RADIANS(angle) ((angle) / 180.0 * M_PI)
答案 3 :(得分:0)
如果您最终绘制到屏幕上(而不是生成要保存到文件的图像),您可能会考虑根本不使用CGContext,而是将图像放入CALayer并围绕其旋转图层锚点:
[layer setValue:@(rotationInRadians) forKeyPath:@"transform.rotation.z"];
如果图像是自己生成的(而不是来自您的包中的静态资源或用户提供的内容),您可以考虑将其从图层中分离出来并设置其父/共同祖先图层的sublayerTransform
:
[layerContainingTheConstituentLayers setValue:@(rotationInRadians) forKeyPath:@"sublayerTransform.rotation.z"];
(可能有办法用视图代替图层;我是Mac人,所以我不太了解UIView。)