1

好的，在我的应用程序中，我有一个图像，我想慢慢地向用户展示。所以我不想调整图像的大小，我想在背景中有完整的图像，然后慢慢地从上到下显示更多的图像。我正在使用我使用动画完成的动画创建一个垂直进度条，并且工作正常。

进度条本身的 alpha 为 0.5，因此您可以看到它后面的图像。我使用动画并在制作动画时拉伸进度条，这只是一个根据进度条设置颜色的视图。我不介意拉伸它，因为它看起来不错。但是我不希望栏后面的图像拉伸，我希望它只显示与进度条动画一样多的图像。所以说进度条完成了80%，那么我应该看到它后面的图像高度的80%，宽度永远不会改变，并且它后面的图像没有调整大小，只是显示了更多。

我尝试使用与图像上的进度条相同的代码，但它看起来不一致，因为进度条将处于不同的级别并且拉伸的图像看起来很奇怪。

我一直在研究动态裁剪代码的不同方法，但我似乎无法在动画中找到任何方法。是否有执行此类任务的内置方法？我发现的很多裁剪代码似乎都在调整图像大小。

我一直在用这个来动画我的进度条

 [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:3.0];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    transform = CGAffineTransformMakeScale(1,transformValue);
    image.transform = transform;
    image.center = CGPointMake(xValue, yValue);

[UIView commitAnimations];

我希望你可以使用类似的东西来制作图像的动画。

任何帮助将非常感激！！

经过大量的测试，我设法达到了这一点：

    [UIView animateWithDuration:3.0 delay:0.0 options:UIViewAnimationOptionCurveEaseInOut
                 animations:^{


                         UIImage *image = [UIImage imageNamed:@"button_connectMe.png"];
                     CGImageRef tmpImgRef = image.CGImage;
                     CGImageRef topImgRef = CGImageCreateWithImageInRect(tmpImgRef, CGRectMake(0, 30, image.size.width, image.size.height));

                     UIImage *topImage = [UIImage imageWithCGImage:topImgRef];
                    imgView.image = topImage;
                     imgView.frame = CGRectMake(0, 180, topImage.size.width, topImage.size.height);

                 } 
                 completion:^(BOOL finished) {
                     NSLog(@"Final method");


                 }
 ];

这会将图像裁剪成两半，并保持原始图像大小，但问题是，新裁剪的图像会立即应用在这行代码中

 UIImage *topImage = [UIImage imageWithCGImage:topImgRef];
                        imgView.image = topImage;

它不是动画的，而这部分

imgView.frame = CGRectMake(0, 180, topImage.size.width, topImage.size.height);

是动画的。我需要以某种方式对 CGI 图像的帧变化进行动画处理，以便将图像慢慢裁剪为所需的任何大小。

4

1 回答 1

2

最后！！

折腾了两天，终于找到了答案。当我发现这个线程时，正在做更多的测试和搜索

为 UIImage 或 UIImageView 设置动画？

我更改了代码以满足我的需要并最终得到了这个

-(void)cropAnimateBottom
{
    UIImage *image = [UIImage imageNamed:@"bar.png"];
    UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(150, 150, image.size.width, 0)];
    imageView.image = image;
    [imageView setClipsToBounds:YES];
    [imageView setContentMode:UIViewContentModeBottom];

    [self.view addSubview:imageView];


    [UIView animateWithDuration:3.0f
                          delay:0.0f
                        options:UIViewAnimationOptionCurveEaseIn
                     animations:^(void) {
                         imageView.frame = CGRectMake(150, 150, image.size.width, -image.size.height);
                     }
                     completion:NULL];

}

我将 contentMode 设置为底部，如您所见，将动画块中的图像高度设置为减去图像高度。如果您想从上到下制作动画，那么只需反过来将内容模式更改为顶部，即

-(void)cropAnimateTop
{
    UIImage *image = [UIImage imageNamed:@"bar.png"];
    UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 100, image.size.width, 0)];
    imageView.image = image;
    [imageView setClipsToBounds:YES];
    [imageView setContentMode:UIViewContentModeTop];

    [self.view addSubview:imageView];


    [UIView animateWithDuration:3.0f
                          delay:0.0f
                        options:UIViewAnimationOptionCurveEaseIn
                     animations:^(void) {
                         imageView.frame = CGRectMake(0, 100, image.size.width, image.size.height);
                     }
                     completion:NULL];

}

希望能帮助其他试图实现同样目标的人！！

于 2012-09-26T11:50:44.170 回答