ios - 我的 CATextLayer 在进行垂直翻转后变得模糊，CATransform3D

Question

我的目标是：在初始化时，你可以看到“FRONT TEXT”，如果你点击图层，它会垂直翻转，你会看到“BACK TEXT”。

这是我的方法：

    /*CREATE CUSTOMLAYER*/
    customLayer                                 =   [[CALayer alloc] init];

    customLayer.backgroundColor                 =   [[UIColor colorWithRed:0.0/255 green:139.0/255 blue:149.0/255 alpha:1] CGColor];
    customLayer.opacity                         =   1;
    [customLayer setFrame:orangFrame];
    customLayer.anchorPoint                     =   CGPointMake(0.5, 0.5);
    [customLayer setMasksToBounds:YES];
    [customLayer setCornerRadius:3];

    // Draw a custom gradient
    gradients                                   =   [CAGradientLayer layer];
    gradients.frame                             =   customLayer.bounds;
    gradients.colors                            =   [NSArray arrayWithObjects:
                                                     (id)[UIColor colorWithWhite:1.0f alpha:0.1f].CGColor,
                                                     (id)[UIColor colorWithWhite:1.0f alpha:0.2f].CGColor,
                                                     (id)[UIColor colorWithWhite:0.75f alpha:0.2f].CGColor,
                                                     (id)[UIColor colorWithWhite:0.4f alpha:0.2f].CGColor,
                                                     (id)[UIColor colorWithWhite:1.0f alpha:0.4f].CGColor,
                                                     nil];


    /* CREATE A FRONTTEXTLAYER */
    frontTextLayer                              =   [[CATextLayer alloc] init];        
    CGRect labelFrame                           =   CGRectInset(customLayer.bounds, 5.0, 10.0);
    frontTextLayer.anchorPoint                  =   CGPointMake(0.5, 0.5);    
    [frontTextLayer setFrame:labelFrame];
    frontTextLayer.doubleSided                  =   YES;
    frontTextLayer.backgroundColor              =   [UIColor clearColor].CGColor;
    [frontTextLayer setFont:@"Montserrat-Regular"];
    [frontTextLayer setFontSize:16];    
    [frontTextLayer setString:@"FRONT TEXT"];
    [frontTextLayer setAlignmentMode:kCAAlignmentCenter];
    [frontTextLayer setForegroundColor:[[UIColor whiteColor] CGColor]];
    frontTextLayer.contentsScale                =   [[UIScreen mainScreen] scale];

    /* CREATE A BACKTEXTLAYER */
    backTextLayer                               =   [[CATextLayer alloc] init];        
    backTextLayer.anchorPoint                   =   CGPointMake(0.5, 0.5);        
    [backTextLayer setFrame:labelFrame];
    backTextLayer.doubleSided                   =   YES;
    backTextLayer.backgroundColor               =   [UIColor clearColor].CGColor;
    [backTextLayer setFont:@"Montserrat-Regular"];
    [backTextLayer setFontSize:16];        
    [backTextLayer setString:@"BACK TEXT"];
    [backTextLayer setAlignmentMode:kCAAlignmentCenter];
    [backTextLayer setForegroundColor:[[UIColor whiteColor] CGColor]];
    backTextLayer.contentsScale                 =   [[UIScreen mainScreen] scale];

    /* APPLY TRANSFORMATION FOR BACKTEXTLAYER */
    CATransform3D transfrom                     =   CATransform3DIdentity;
    transfrom.m34                               =   -1.0/ 500;
    transfrom                                   =   CATransform3DRotate(transfrom, degToRad(180.0), 1, 0, 0);
    backTextLayer.transform                     =   transfrom;


    [self.viewHolder.layer addSublayer:customLayer];
    [customLayer insertSublayer:gradients atIndex:0];    
    [customLayer addSublayer:frontTextLayer];

为了处理点击，我使用：

- (void)touchesEnded:(NSSet*)touches withEvent:(UIEvent*)event {
    UITouch *touch                      =   [[event allTouches] anyObject];
    CGPoint touchLocation               =   [touch locationInView:self.viewHolder];
    BOOL isLocatedIncustomLayer         =   CGRectContainsPoint(customLayer.frame, touchLocation);

    [self transformation:isLocatedIncustomLayer];
}

-(void)transformation:(BOOL)value {
    if ( value) {
        if ( !isClicked ) {
            CATransform3D transfrom     =   CATransform3DIdentity;
            transfrom.m34               =   -1.0/ 500;
            transfrom                   =   CATransform3DRotate(transfrom, degToRad(180.0), 1, 0, 0);                    

            /* REMOVE FRONTTEXTLAYER */
            [frontTextLayer removeFromSuperlayer];
            [CATransaction setCompletionBlock:^{
                [CATransaction begin];
                [CATransaction setAnimationDuration:3];
                customLayer.transform   =   transfrom;

                /* ADD BACKTEXTLAYER */
                [customLayer addSublayer:backTextLayer];
                [CATransaction commit];

            }];

            isClicked       =   TRUE;

        }
        else {
            /* REMOVE BACKTEXTLAYER */
            [backTextLayer removeFromSuperlayer];

            [CATransaction setCompletionBlock:^{
                [CATransaction begin];
                [CATransaction setAnimationDuration:.5];
                customLayer.transform   =   CATransform3DIdentity;

                /* ADD FRONTTEXTLAYER */
                [customLayer addSublayer:frontTextLayer];
                frontTextLayer.transform         =   CATransform3DIdentity;
                [CATransaction commit];

            }];

            isClicked       =   FALSE;
        }
    }
}

BACKTEXT除了改造之后，一切都是我所期待的。看起来不是很清楚。图片如下。

正文：

回文：

欢迎所有评论！