drawRect:我如何做一个“倒置剪辑” [英] drawRect: How do I do an "inverted clip"

查看:86
本文介绍了drawRect:我如何做一个“倒置剪辑”的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在创建一个iOS用户界面,允许用户在现有图像中选择一个矩形,将该矩形的角拖动到所需的大小。我现在有四个自定义UIButtons(30%alpha)和一个自定义视图(也有30%alpha),它在四个角按钮之间绘制虚线。

I am creating an iOS user interface to allow a user to pick a rectangle within an existing image, dragging the corners of that rectangle to the desired size. I now have four custom UIButtons (30% alpha) and a custom view (also with 30% alpha) that draws the dashed lines between the four corner buttons.

To改进界面,我希望我的drawRect代码使图像的裁剪部分显得正常,而裁剪区域外的所有部分都被淘汰(填充白色,这将给我正确的效果,因为UIView设置到30%alpha)。

To "improve" the interface, I would like my drawRect code to make the cropped portion of the image appear "normal" while everything outside the cropped region is washed out (filled with white color, which will give me the correct effect since the UIView is set to 30% alpha).

显而易见的算法是:


  1. 填充使用[UIColor whiteColor]填充整个图像

  2. 使用[UIColor clearColor]填充绘制四条虚线

当我这样做时,清除填充没有显示出来。我相信这是因为步骤#2中的清晰颜色的填充没有被看到,因为在步骤#1中像素已经被设置为白色。也许有一种混合模式可以让我看到第二个矩形的透明度?我不确定各种混合模式。

When I do this, the clear fill isn't showing up. I believe this is because the "fill" of the clear color in step #2 isn't being seen because the pixels were already set to white in step #1. Perhaps there's a blend mode that will allow me to see the transparency of the second rectangle? I'm not sure about the various blend modes.

我的第二次尝试,有效,执行以下操作:

My second attempt, which works, does the following:


  1. 用[UIColor clearColor] fill绘制四条虚线

  2. 用[UIColor whiteColor]填充绘制另外四个矩形,每个矩形代表左边的部分,在裁剪区域的正上方,上方和下方。

正如我所提到的,这种方法有效,但在我看来应该有一个更简单的方法而不是我每次都必须计算这四个额外的矩形。

As I mention, this method works, but seems to me there should be a simpler way instead of me having to calculate these four additional rectangles each and every time.

SO上有类似的问题使用自定义形状的孔创建使用CALayer和蒙版的图层蒙版,但这对于我需要的内容来说似乎有些过分。

There is a similar question on SO Create layer mask with custom-shaped hole that uses CALayer and masks, but this seems to be overkill for what I need.

有没有人对如何改善这个有什么建议?

Does anybody have any suggestions on how to improve this?

推荐答案

您可以将混合模式设置为 kCGBlendModeCopy 并使用 clearColor 将像素的alpha重置为零。你可能也可以使用 kCGBlendModeClear 但我还没有测试过。

You can set the blend mode to kCGBlendModeCopy and use clearColor to reset a pixel's alpha to zero. You can presumably also use kCGBlendModeClear but I haven't tested that.

你也可以设置剪切路径到只包含你想要清除的像素并调用 CGContextClearRect(gc,CGRectInfinite)

You can also set the clipping path to just contain the pixels you want cleared and call CGContextClearRect(gc, CGRectInfinite).

如果你想使用一个带有孔的剪贴蒙版,你可以不使用 CALayer 这样做,你可以通过使用均匀的方式构建它比你链接的答案更简单一点-odd规则和 CGRectInfinite

If you want to use a clipping mask with a hole in it, you can do so without using a CALayer, and you can build it a little more simply than in the answer you linked, by using the even-odd rule and CGRectInfinite:

CGContextSaveGState(GC); {
    CGContextBeginPath(gc);
    CGContextAddRect(gc, myRect); // or whatever simple path you want here
    CGContextAddRect(gc, CGRectInfinite);
    CGContextEOClip(gc);

    // drawing code here is clipped to the exterior of myRect

} CGContextRestoreGState(gc);

这篇关于drawRect:我如何做一个“倒置剪辑”的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆