如何创建具有透明渐变背景的UIView子类？

Question

我想创建一个具有透明渐变背景的自定义UIView，以便在此自定义视图后面的视图上显示文字。

以下是一个示例图片：

在我的透明渐变视图下，橙色框是UIView。然后我将文本放在透明渐变视图的顶部，因为它的颜色更深，文本会更明显，但你仍然可以从后面看到一些橙色框。

我无法通过UIView找出如何实现这一目标。

在我的自定义UIView drawRect我有：

- (void)drawRect:(CGRect)rect
{
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef context = UIGraphicsGetCurrentContext();

    NSArray *gradientColors = @[(id)[UIColor colorWithWhite:0.0 alpha:0.0].CGColor,
                                (id)[UIColor colorWithWhite:0.0 alpha:0.55].CGColor,
                                (id)[UIColor colorWithWhite:0.0 alpha:0.7]];

    CGFloat gradientLocations[] = {0, 0.77, 1};
    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) gradientColors, gradientLocations);

    CGPoint startPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMinY(rect));
    CGPoint endPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMaxY(rect));

    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
    CGGradientRelease(gradient);
}

但它似乎不支持透明度，因为当我将UIView添加到self.view时，它是完全不透明的黑色。

这就是我在CSS中的方式：

background-image: linear-gradient(-180deg, rgba(0,0,0,0.00) 0%, rgba(0,0,0,0.55) 23%, rgba(0,0,0,0.70) 100%);

但是，我再也不知道如何为自定义UIView子类做到这一点。

Answer 1

我不打算使用CoreGraphics，所以我会使用CAGradientLayer。

1. 覆盖子类中的+layerClass。

   + (Class)layerClass {
       return [CAGradientLayer class];
   }
   

2. 在界面中重新定义layer属性以使用此类。

   @property(nonatomic, readonly, retain) CAGradientLayer *layer;
   

3. 设置颜色和其他属性。

   self.layer.colors = gradientColors;
   self.layer.locations = gradientLocations; // But this time as `NSArray`
   self.layer.startPoint = startPoint; // From 0 to 1
   self.layer.endPoint = endPoint; // From 0 to 1
   

Answer 2

您可以在照片商店中创建半透明图像，例如＆amp;把它放在你的OrangeView上。 由于此图像太暗，您可以通过更改其Alpha值来控制其透明度。这样的安排将使您的textView＆amp; transImage将是你的orangeView的子视图。文本视图将放在transImage的顶部。

无需编写任何代码。

如果需要更多信息，请告诉我.. :)