0

我已经尝试过环顾四周,但似乎找不到任何关于我正在寻找的主题的信息。

如果您熟悉 Unity3D uGUI,我正在尝试使用 Objective-C 在 XCode 内部实现相同的“填充”类型图像效果。

如果我有一个“角色”的褪色图像,然后随着时间的推移,我想在同一位置用一个“填充的角色”图像填充那个“角色”图像。我该如何解决这个问题?

我曾尝试使用 MGImageResizingUtilities 但这似乎改变了图像的大小,因为裁剪后的图像不再与正在使​​用的原始图像的大小相同,并且比例设置为纵横比。

很难找到一个好的例子,但这里有一些东西可以理解。 http://s22.postimg.org/9qghxosox/Screen_Shot_2016_01_30_at_17_08_06.png

这是我尝试使用的一些代码:

CALayer *maskLayer = [CALayer layer];
UIImage *maskImage = [UIImage imageNamed:@"turtle_posing"];
maskLayer.contents = (id)maskImage.CGImage;
maskLayer.bounds = self.filledTurtlePic.bounds;

CGRect turtleRect = self.filledTurtlePic.frame;

maskLayer.frame = CGRectMake(0, turtleRect.size.height, turtleRect.size.width, -turtleRect.size.height);
self.filledTurtlePic.layer.mask = maskLayer;

这是尝试使用上面的代码完全填充图像的两个屏幕截图,以及一个尝试部分填充图像的屏幕截图(遮罩层框架高度设置为 -40) 在此处输入图像描述

在此处输入图像描述

先谢谢了

4

1 回答 1

0

我这样做的方法是创建两个图像。填充和未填充。

然后创建两个图像视图。固定大小,使它们的大小相同。并且处于相同的位置。下面是未填充的,顶部是填充的。当你运行它时,它看起来应该只有填充的那个在屏幕上。

现在创建一个CALayer并将其设置maskfilledImageView.layer.

当您更改此图层的框架时,它只会显示该框架内的内容。所以它会隐藏一部分,filledImageView你会看到unfilledImageView下面。

因此,如果您的 imageView 的帧为 (100, 100, 100, 100),原点为 100, 100,尺寸为 100, 100。对于完整图像,遮罩层帧应为 (0, 0, 100, 100)。这是因为原点是相对于图像视图的。

对于空图像,它应该是 (0, 100, 100, 0)。

对于 x%,遮罩层的帧应该是 (0, x-100, 100, 100-x)

编辑

你应该有两个图像视图......

filledImageView unFilledImageView

这些设置正确。不要改变这些框架。也不是这些层。

您应该创建一个图层并将其添加为filledImageView.

self.maskLayer = [CALayer layer];
self.filledImageView.layer.mask = self.maskLayer;

现在有一个更新面具的功能......

- (void)changeFilledImage:(CGFloat)percentage {
    // percentage is from 0.0 to 1.0

    CGFloat fullHeight = CGRectGetHeight(self.filledImageView.frame);
    CGFloat width = CGRectGetWidth(self.filledImageView.frame);
    CGFloat percentageHeight = fullHeight * percentage;

    self.maskLayer.frame = CGRectMake(0, fullHeight - percentageHeight, width, percentageHeight);
}

这样的事情应该做。

于 2016-03-14T16:51:35.600 回答