ios - 图像拼接成带有动画的瓦片 - iOS

Question

我正在尝试拼接图像，然后像这样过渡到下一个图像？关于从哪里开始的任何建议？是否可以将图像拼接成小块并使用 UIView 动画对其进行动画处理？这是一个 sample .

编辑:

 '#define DESIRED_WIDTH 40

 '#define DESIRED_HEIGHT 60


 - (void)viewDidLoad
{
[super viewDidLoad];

  UIImage *bigImage = [UIImage imageNamed:@"background_for_Manager_App.png"];
  CGRect frame = CGRectMake(0.0, 0.0, DESIRED_WIDTH, DESIRED_HEIGHT);
  int widthCount = (bigImage.size.width / DESIRED_WIDTH);
  int heightCount = (bigImage.size.height / DESIRED_HEIGHT);
  NSLog(@"height width %i %i",heightCount,widthCount);
  for (int i = 0; i <heightCount; i++) {
    for (int j = 0; j < widthCount; j++) {
        UIImage *piece = [self imageCroppedWithRect:frame];
        UIImageView *view = [[UIImageView alloc] initWithImage:piece];
        view.frame = frame;
        [self.view addSubview:view];

        frame.origin.x += frame.size.width;
        NSLog(@"x value %f",frame.origin.x);

       }
    frame.origin.x = 0.0;

    frame.origin.y += frame.size.height;
     NSLog(@"y value %f",frame.origin.y);
   }

//[UIView beginAnimations:nil context:12    // Do any additional setup after loading the view, typically from a nib.

}

- (UIImage *)imageCroppedWithRect:(CGRect)rect
  {
    CGFloat scale = [UIImage imageNamed:@"background_for_Manager_App.png"].scale;
    NSLog(@"scale value%f",scale);
    if (scale > 1.0f) 
    {    // this is for Retina display capability
         rect = CGRectMake(rect.origin.x * scale,
                      rect.origin.y * scale,
                      rect.size.width * scale,
                      rect.size.height * scale);

    }

    CGImageRef imageRef = CGImageCreateWithImageInRect([UIImage imageNamed:@"background_for_Manager_App.png"].CGImage, rect);
    UIImage *result = [UIImage imageWithCGImage:imageRef scale:scale orientation:self.splicedImageView.image.imageOrientation];
    CGImageRelease(imageRef);
    return result;
}

Answer 1

使用此代码进行裁剪(最好将其添加为 UIImage 类别):

- (UIImage *)imageCroppedWithRect:(CGRect)rect
{
    if (self.scale > 1.0f) {    // this is for Retina display capability
        rect = CGRectMake(rect.origin.x * self.scale,
                          rect.origin.y * self.scale,
                          rect.size.width * self.scale,
                          rect.size.height * self.scale);
    }

    CGImageRef imageRef = CGImageCreateWithImageInRect(self.CGImage, rect);
    UIImage *result = [UIImage imageWithCGImage:imageRef scale:self.scale orientation:self.imageOrientation];
    CGImageRelease(imageRef);
    return result;
}

使用方法:您应该使用此代码为 UIImage 创建一个类别。然后加载图像并将其切成小块:

UIImage *bigImage = [UIImage imageNamed:@"big_image"];
CGRect frame = CGRectMake(0.0, 0.0, DESIRED_WIDTH, DESIRED_HEIGHT);
for (int i = 0; i < bigImage.size.height / DESIRED_HEIGHT; i++) {
    for (int j = 0; i < bigImage.size.width / DESIRED_WIDTH; j++) {
        UIImage *piece = [bigImage imageCroppedWithRect:frame];
        UIImageView *view = [[UIImageView alloc] initWithImage:piece];
        view.frame = frame;
        [self.view addSubview:view];
        [view release];
        frame.origin.x += frame.size.width;
    }
    frame.origin.x = 0.0;
    frame.origin.y += frame.size.height;
}

只需将您的图像切成小块，然后创建适当数量的 UIImageView 对象，并将它们按正确的顺序放置在您的 View 中。现在您可以根据需要为它们制作动画。

另请注意，DESIRED_WIDTH 和 DESIRED_HEIGHT 必须无余地分割图像的边。

对于视频中的动画，您应该使用 UIViewAnimationOptionTransitionFlipFromLeft 选项:

[UIView animateWithDuration:0.2 delay:0.0 options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{
    // hide your image here
} completion:nil];