1

我正在制作一个应用程序,我必须在一个屏幕上显示 3 个图像,当用户触摸一个图像时,应该通过动画和调整大小来显示该图像。

因此,对于第一步,我使用 How to Mask an UIImageView中的 3 个不同的透明蒙版图像对 3 个图像进行了蒙版

我的方法如下

- (UIImageView*) maskedImage:(UIImage *)image withMasked:(UIImage *)maskImage {
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
    CALayer *mask1 = [CALayer layer];
    mask1.contents = (id)[maskImage CGImage];
    mask1.frame = CGRectMake(0, 0, 1024, 768);
    imageView.layer.mask = mask1;
    imageView.layer.masksToBounds = YES;
    return imageView;
}

我称之为

    self.image2 = [UIImage imageNamed:@"screen2Full.png"];
    self.mask2 = [UIImage imageNamed:@"maskImage.png"];
    self.imageView2 = [self maskedImage:self.image2 withMasked:self.mask2];
    [self.completeSingleView addSubview:self.imageView2];

这是完美的工作。

现在进行第 2 步。为蒙版设置动画,以便显示完整图像。我对此进行了很多搜索,但没有成功。所以请帮助我。我只是想知道我们如何对蒙版图像进行动画处理和调整大小,以便我可以查看完整的图像。我的概念如下。

在此处输入图像描述

4

1 回答 1

0

所以最后我从多个站点和一些自己的逻辑和辛勤工作得到了解决方案;)。所以这是这个的解决方案

-(void)moveLayer:(CALayer*)layer to:(CGPoint)point
{
    // Prepare the animation from the current position to the new position
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position"];
    animation.fromValue = [layer valueForKey:@"position"];
    animation.toValue = [NSValue valueWithCGPoint:point];
    animation.duration = .3;
    layer.position = point;

    [layer addAnimation:animation forKey:@"position"];
}

-(void)resizeLayer:(CALayer*)layer to:(CGSize)size
{
    CGRect oldBounds = layer.bounds;
    CGRect newBounds = oldBounds;
    newBounds.size = size;
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"bounds"];

    animation.fromValue = [NSValue valueWithCGRect:oldBounds];
    animation.toValue = [NSValue valueWithCGRect:newBounds];
    animation.duration = .3;
    layer.bounds = newBounds;    
    [layer addAnimation:animation forKey:@"bounds"];
}

- (UIImageView*) animateMaskImage:(UIImage *)image withMask:(UIImage *)maskImage width:(int )wd andHeight:(int )ht andSize:(CGSize)size andPosition:(CGPoint)pt {
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
    CALayer *mask = [CALayer layer];
    mask.contents = (id)[maskImage CGImage];
    mask.frame = CGRectMake(0, 0, wd, ht);

    //This needs to be place before masking. I don't knwo why. But its working :)
    [self resizeLayer:mask to:size];
    [self moveLayer:mask to:pt];

    imageView.layer.mask = mask;
    imageView.layer.masksToBounds = YES;
    return imageView;
}

你只需要把它称为

 [self.imageView1 removeFromSuperview];
 self.imageView1 = [self animateMaskedImage:self.image1 withMasked:self.mask1 width:1024 andHeight:768 andSize:CGSizeMake(1024*4, 768*4) andPosition:CGPointMake(1024*2, 768*2)];
 [self.completeSingleView addSubview:self.imageView1];
于 2013-07-31T10:11:54.170 回答