1

我正在尝试翻转并给透视旋转 uiimageview,以获得类似反射的效果。首先我使用 CATransform3D 给出透视图,然后使用 CGAffineTransformMake 翻转。但是,我在第二次转换后失去了透视效果。而且我不知道如何使用 CATransform3D 透视和翻转两者。img 是第一个图像,而 img2 将是它的反射。

CALayer *layer = img.layer;
CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
rotationAndPerspectiveTransform.m34 = 1.0 / -600;
rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, 30.0f * M_PI / 180.0f, 0.0f, 1.0f, 0.0f);
layer.transform = rotationAndPerspectiveTransform;
img2.transform = CGAffineTransformMake(
                                            1, 0, 0, -1, 0, img2.bounds.size.height
                                            );
4

1 回答 1

2

我能够通过 4 个(可选 5 个)步骤完成此效果:

  1. 在您的 nib 中创建两个 UIImageViews。为您的主图像创建一个 UIImageView,然后为您的反射图像创建另一个。确保他们的视图内容模式都设置为 Aspect Fit。此外,将反射图像的帧大小设置为主图像的 2 倍(因为透视反射会增加图像的宽度)。
  2. 正常加载主图像。现在将反射加载为上下颠倒,如下所示:

    reflectionView.image = [UIImage
                       imageWithCGImage:mainImageView.image.CGImage
                       scale:1.0f
                       orientation: UIImageOrientationDownMirrored];
    
  3. 现在像这样创建透视变换:

    CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
    rotationAndPerspectiveTransform.m24 = 1.0f/-mainImageView.frame.size.width;
    [[reflectionView layer] setTransform:rotationAndPerspectiveTransform];
    
  4. 最后,将反射移动到位:

    reflectionView.center = CGPointMake(self.view.frame.size.width/2, mainImageView.frame.size.height*1.5);
    
  5. (可选)添加渐变以使反射淡入背景:

    reflectionView.layer.masksToBounds = YES;
    
    // define gradient
    CAGradientLayer *theGradient = [CAGradientLayer layer];
    theGradient.frame = reflectionView;
    theGradient.colors = [NSArray arrayWithObjects:
                          (id)[[UIColor clearColor] CGColor],
                          (id)[[UIColor blackColor] CGColor], nil];
    
    // add gradient to reflection image
    [reflectionView insertSublayer:theGradient atIndex:0];
    reflectionView = 0.25f;
    

它看起来像这样: 在此处输入图像描述

于 2012-01-05T05:08:02.430 回答