将CAGradient蒙版图层应用于UITextView [英] Applying CAGradient mask layer to UITextView

问题描述

我有一个带有可滚动文本的UITextView. 我正在尝试在其上应用渐变层，因此可见文本的底部始终会逐渐淡出.

I've got a UITextView, with scrollable text. I'm trying to apply a gradient layer to it, so the bottom of the visible text is always slightly faded out.

这是我的代码:

CAGradientLayer *maskLayer = [CAGradientLayer layer];

maskLayer.colors = [NSArray arrayWithObjects:(id)[[UIColor clearColor] CGColor], (id)[[UIColor yellowColor] CGColor], nil];
maskLayer.locations = [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.0],
                       [NSNumber numberWithFloat:0.2],
                       [NSNumber numberWithFloat:0.8],
                       [NSNumber numberWithFloat:1.0], nil];
maskLayer.bounds = clueTextView.bounds;
myUITextView.layer.mask = maskLayer;

现在，这导致UITextViewLayer完全透明-我看到UITextViewLayer作为其子视图的UIView的背景色.尽管可以选择并复制文本以粘贴到Notes程序中，但是看不到其中包含的任何文本.

Right now, this is causing the UITextViewLayer to be completely transparant - I see the background color of the UIView that the UITextViewLayer is as subview of. I can't see any of the text contained within, although I can select and copy the text to paste in to the notes program.

有什么想法我想念的吗?

Any ideas what I'm missing?

推荐答案

您遇到了一些问题.

渐变层的colors属性需要与其locations属性具有相同的计数.您提供的是4个位置，但只有2种颜色.

The gradient layer's colors property needs to have the same count as its locations property. You are providing 4 locations but only 2 colors.

您正在基于clueTextView设置渐变层的边界，但是将其设置为myUITextView的蒙版.

You are setting the gradient layer's bounds based on clueTextView but you are setting it as the mask of myUITextView.

您正在设置渐变层的bounds，但未设置其position.默认值position为0,0，这意味着渐变层的中心位于myUITextView的左上角.只需将渐变图层的frame设置为文本视图的bounds即可.

You are setting the bounds of the gradient layer, but not its position. The default position is 0,0, meaning that the center of the gradient layer is at the upper-left corner of myUITextView. It is simpler to just set the frame of the gradient layer to the bounds of the text view.

如果解决所有这些问题，可能会得到想要的效果.

If you fix all of these problems, you might get the effect you're looking for.

- (void)initTextViewMask {
    CAGradientLayer *maskLayer = [CAGradientLayer layer];
    maskLayer.colors = @[
        (id)[UIColor whiteColor].CGColor,
        (id)[UIColor whiteColor].CGColor,
        (id)[UIColor clearColor].CGColor];
    maskLayer.locations = @[ @0.0f, @0.8f, @1.0f ];
    maskLayer.frame = textView_.bounds;
    textView_.layer.mask = maskLayer;
}

但是，您可能会发现新的问题.

However, you may discover new problems.

如果用户可以滚动文本视图，则将发现渐变随文本视图一起移动，这可能不是您想要的.解决此问题的最简单方法是将文本视图嵌入容器UIView内，然后在容器视图上设置遮罩.

If the user can scroll the text view, you will discover that the gradient moves with the text view, which is probably not what you want. The easiest way to fix this is to embed the text view inside a container UIView, and set the mask on the container view.

如果文本视图可以更改大小(可能是由于设备旋转所致)，则遮罩将不会随之自动更改大小.您需要在layoutSubviews或viewDidLayoutSubviews中更新蒙版的frame.

If the text view can change size (perhaps due to device rotation), the mask will not automatically change size with it. You need to update the mask's frame, in layoutSubviews or viewDidLayoutSubviews.

这篇关于将CAGradient蒙版图层应用于UITextView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！