12

我想为我的UILabel.

如果您查看此屏幕:

http://313e5987718b346aaf83-f5e825270f29a84f7881423410384342.r78.cf1.rackcdn.com/1383617182-2013-11-05_03.05.58_04.png

(右边那个)你会注意到UILabel文本颜色是背景模糊的专辑封面,没有黑色蒙版。

目前我有透明的UILabeltextColor ( 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 上有一个透明的文本颜色,忽略第二个/掩码)。

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

4

3 回答 3

5

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

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

于 2014-06-10T09:14:09.070 回答
2

我不认为你将能够直接用 UILabel 做到这一点。我所做的是将它分解成几部分:

如何仅绘制标签的背景。为此,我从字符串中抄袭了 CGPathRef 中的代码,以将字符串转换为路径。然后子类化 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,设置类,将背景颜色设置为清除,将前景色设置为您建议的填充颜色,背景将显示在文本所在的位置。

为了模糊通过标签显示的身体,我在标签下方放置了一个 FXBlurView ( https://github.com/nicklockwood/FXBlurView ),并带有尺寸约束以保持它们对齐。

您可以在https://github.com/dwb357/TransparentLabel看到这一切。

于 2014-02-19T21:00:40.093 回答
0

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

一种方法是为字形构造一个 CGPath,将图形上下文剪辑到它们,然后清除上下文,使外部区域为黑色,内部区域为半透明。

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

于 2013-11-12T06:25:09.440 回答