Question

我想为我的UILabel实现与iOS 7的新iTunes远程更新相同的效果。

如果你看这个屏幕：

（右边的那个）你会发现UILabel文字颜色是没有黑色面具的背景模糊专辑封面。

目前我有透明的UILabel textColor（http://cl.ly/SInK），我的代码类似于https://github.com/robinsenior/RSMaskedLabel

我的第一个假设是拥有像这样的视图层次结构

UIImageView (Light blurred image)
    |
UIImageView/UIView (Dark blurred image or just a dark mask for the superview)
    |
UILabel (And all my other view).

我希望UILabel在第一个UIImageView上有一个透明的文本颜色，忽略第二个/ Mask。

我无法绕过解决方案来实现这种效果。

Answer 1

由于iOS 8 Apple提供了一个新类UIVibrancyEffect，它可以添加到UIVisualEffectView中。这与UIBlurEffect相结合可以获得与上面截图完全相同的结果。

来源：https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UIVibrancyEffect/index.html

Answer 2

我认为你不能用UILabel直接做到这一点。我所做的就是把它分解成几块：

如何仅绘制标签的背景。为此，我将来自CGPathRef from string的代码转换为将字符串转换为路径。然后继承子类UILabel并添加以下drawRect做了相应的事情。

-(void)drawRect:(CGRect)rect {
    CGContextRef        ctx = UIGraphicsGetCurrentContext();
    CGContextSaveGState(ctx);

    // Convert the attributed text to a UIBezierPath
    CGPathRef           path = [self.attributedText createPath];

    // Adjust the path bounds horizontally as requested by the view
    CGRect              bounds = [self textRectForBounds:rect limitedToNumberOfLines:self.numberOfLines];
    CGAffineTransform   xform = CGAffineTransformMakeTranslation(bounds.origin.x, bounds.origin.y);

    // Adjust the path bounds vertically because it doesn't seem to be taken into account yet
    bounds = CGPathGetBoundingBox(path);
    xform = CGAffineTransformTranslate(xform, 0., (self.bounds.size.height - bounds.size.height) / 2.);

    // Apply the transform to the path
    path = CGPathCreateCopyByTransformingPath(path, &xform);

    // Set colors, the fill color should be the background color because we're going
    //  to draw everything BUT the text, the text will be left clear.
    CGContextSetFillColorWithColor(ctx, self.textColor.CGColor);

    // Flip and offset things
    CGContextScaleCTM(ctx, 1., -1.);
    CGContextTranslateCTM(ctx, 0., 0. - self.bounds.size.height);

    // Invert the path
    CGContextAddRect(ctx, self.bounds);
    CGContextAddPath(ctx, path);
    CGContextDrawPath(ctx, kCGPathEOFill);

    // Discard the path
    CFRelease(path);

    // Restore gstate
    CGContextRestoreGState(ctx);
}

如果在界面构建器中创建UILabel，请设置类，将背景颜色设置为clear，将前景颜色设置为建议的填充颜色，背景将显示文本的位置。

为了模糊通过标签显示的正文，我在标签下放了一个FXBlurView（https://github.com/nicklockwood/FXBlurView），并使用大小限制来保持对齐。

您可以在https://github.com/dwb357/TransparentLabel找到所有工作。

Answer 3

颜色不均匀。但它实际上是“剪掉”让模糊和有色背景闪耀。

这样做的一种方法是为字形构造一个CGPath，将图形上下文剪辑到它们，然后清除上下文，将区域留在黑色外面，并使区域内的区域保持半透明。

另一种方法是从这个大型模糊的有色封面艺术中创建一种图案颜色，并在UILabel上使用这种图案颜色。

superview.superview上的透明UILabel textColor（排序）

3 个答案: