如何更改UIImage或UIImageView一半的alpha值

Question

我正在尝试创建一个动画效果，其中图像的alpha值在开始时约为0.5，并逐渐变为1，但不像传统效果那样。以下是我想要的效果。

原始图片。

一段时间后

更长时间后

最终结果

因此，如果可以减少图像某部分的alpha值，我就可以展示填充玻璃杯等类似物品的动画。

我不知道是否可以完成这项任务，或者是否可以使用核心图形或核心动画来实现。

附注：它们是在Photoshop中制作的。

有没有人对如何实现这种动画有什么想法？

- Robin

Answer 1

你可以在上方添加视图并更改它的框架。这是最好的方法。

如果您正在使用图片，则可以使用子类UIView并实现。

-(void) drawRect:(CGRect) rect {
//if you want to clip the image, the frame for the view must be smaller then rect 
    [image drawInRect: rect];
}

- Max

---

但是我正在使用图像（例如人、牛、山羊或任何其他不仅仅是简单填充矩形的东西）。 - Robin

Answer 2

我建议如下：

1. Create the UIImageView that shows the image in the view.

2. Create a new UIView with a background color and transparency:

   UIView *transpView = [UIView new];
   tranpsView.alpha = 0.4;
   transpView.frame = self.view.frame;
   [self.view addSubview:transpView];
   

3. Animate the transparent view to slide upwards:

   [UIView animateWithDuration:1.0 animations:^{
       transpView.frame = CGRectOffset(transpView.frame, 0, -tranpsView.frame.size.height);
   }];
   

完成后不要忘记释放tranpsView，可以使用completed块来完成。

要获得“玻璃填充”的动画效果，只需相应地更改tranpsView的frame。 tranpsView可以是任何UIView子类（例如液体纹理等）。

希望这有所帮助！

- BastiBen

---

谢谢@badcat，虽然这不是我想要的，但总比没有好。 - Robin

Answer 3

这里有另一个想法。

将您的UIView *view背景设置为所需的image.png，并将alpha值设置为0.5。让

w = view.bounds.size.width;
h = view.bounds.size.height;

创建另一个UIView *glassView，alpha值为0.5，并将其添加为子视图：

[view addSubview:glassView];
glassView.frame = CGRectMake(0.0, h, w, 0.0); 

创建一个 UIImageView *glassImageView，将其 image 设置为 image.png，并将其作为 glassView 的子视图添加进去：

[glassView addSubview:glassImageView];
glassImageView.frame = CGRectMake(0.0, -h, w, h); 

现在设置动画，增加glassView的高度和透明度，同时保持imageGlassView的大小，就像这样：

[UIView beginAnimations:nil context:NULL]; {
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
        [UIView setAnimationDelegate:self];
        glassView.alpha = 1.0;
        glassView.frame = CGRectMake(0.0, 0.0, w, h); 
        glassImageView.frame = CGRectMake(0.0, 0.0, w, h);
} [UIView commitAnimations];        

公正地说，我还没有测试过这个，但是类似这样的东西似乎可以起作用。不过，也许不行。如果你找到了一个完美的解决方案，请回帖分享。我很想知道如何做到这一点！

- PengOne

Answer 4

看看这个是否有帮助

http://www.iphonedevsdk.com/forum/iphone-sdk-development-advanced-discussion/32481-animating-uiimage-mask-fill.html

- visakh7

Answer 5

我知道这个问题很旧，而且是我提出的，但今天我正在尝试类似的东西，并找到了这个简单的解决方案来回答我的问题，这个问题是10个月前问的。

我正在开发一个项目，需要使图像看起来像是从完全白色（0%进度）到完全红色（100%进度）加载。

我想添加包含图像的2个ImageView，一个位于另一个之上，并将包含红色图像的顶部imageview的内容模式设置为底部，以便在减少imageview的大小时，图像看起来正在加载，并且它起作用了。通过一些动画块，图像看起来正在加载。然后我想到了这个问题，这个问题我很久以前就问过，然后想出了自己的解决方案。

因此，这个问题的解决方案是，如果您在彼此之上添加2个imageView，然后减小其中一个的alpha值，将高度减小为零，然后逐渐增加高度并更改具有alpha值1的图像视图的y坐标，则它将显示为所要求的加载状态。

我已经使用了这两个函数来获得加载图像的假象。

- (void)startAnimation
{
    CGRect rect = loadedImageView.frame;
    rect.origin.y = unloadedImageView.frame.origin.y;
    rect.size.height = unloadedImageView.frame.size.height;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationDuration:2.0f];
    [UIView setAnimationDidStopSelector:@selector(stopAnimation)];
    loadedImageView.frame = rect;
    [UIView commitAnimations];
}

- (void)stopAnimation
{
    CGRect rect = loadedImageView.frame;
    rect.origin.y = unloadedImageView.frame.size.height + unloadedImageView.frame.origin.y;
    rect.size.height = 0;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationDuration:2.0f];
    [UIView setAnimationDidStopSelector:@selector(startAnimation)];
    loadedImageView.frame = rect;
    [UIView commitAnimations];
}

- Robin