有附加内容时滚动视图 Top/Bot 处的渐变

Question

我有一个 scrollview>ContentView>TextLabel 设置，其中显示了渐变，但没有按照我想要的方式工作。这是一个清晰的背景 scrollView，所以我要找的只是文本上的清晰渐变蒙版。我 found something 与我在 Objective-C 中寻找的相似，但该线程没有 Swift 解决方案。

我的最终目标似乎是大多数人可能会使用的东西，所以我很惊讶还没有 Swift 版本。我尝试编码的功能是：

有时文本会完全适合 scrollView 的固定大小，因此不应该有渐变。
当文本长于无法容纳且其中一些文本低于 scrollView 的底部截断线时，视图底部应淡入淡出以清除。
一旦用户向下滚动并且顶部应该淡出，表明上面还有更多内容。

我尝试使用此代码来处理项目符号 #2：

        let gradient = CAGradientLayer()
        gradient.frame = self.bio_ScrollView.superview!.bounds ?? CGRectNull
        gradient.colors = [UIColor.whiteColor().CGColor, UIColor.clearColor().CGColor]
        //gradient.locations = [0, 0.15, 0.25, 0.75, 0.85, 1.0]
        gradient.locations = [0.6, 1.0]
        self.bio_ScrollView.superview!.layer.mask = gradient

但是它淡化了所有内容，包括它下面的按钮，它显然不在滚动视图中：

如果我删除 .superview 并将其直接应用于 scrollView，它只会淡化可见初始部分下方的所有文本：

有人知道如何正确实施吗？

Answer 1

想通了。首先，确保您添加了正确的视图层次结构。滚动视图需要嵌入到容器视图中（这是将应用渐变的内容）：

Top/container 视图：根据需要进行设置
滚动视图：将所有边固定到容器（总共 4 个约束）
滚动视图内容视图：固定边缘 + 中心 X（总共 5 个约束）
标签：固定边（总共 4 个约束）

将"scrollViewDelegate"添加到ViewController class:

class ViewController_WithScrollView: UIViewController, UIScrollViewDelegate {
   ....

将上面列出的四个视图与 IBOutlets 连接起来。然后，在 viewDidLoad:

中设置你的 scrollView 委托

override func viewDidLoad() {
    super.viewDidLoad()

    yourScrollView.delegate = self
    //+All your other viewDidLoad stuff
}

然后实现 scrollViewDidScroll 函数，由于您在上面所做的工作，它将自动运行。

func scrollViewDidScroll (scrollView: UIScrollView) {
    if scrollView.isAtTop {
        self.applyGradient_To("Bot")
    } else if scrollView.isAtBottom {
        self.applyGradient_To("Top")
    } else {
        self.applyGradient_To("Both")
    }
}

然后添加这个神奇的渐变代码：

func applyGradient_To (state: String) {
    let gradient = CAGradientLayer()
    gradient.frame = self.yourScrollView.superview!.bounds ?? CGRectNull

    switch state {
    case "Top":
        gradient.colors = [UIColor.clearColor().CGColor,UIColor.whiteColor().CGColor]
        gradient.locations = [0.0,0.2]
    case "Bot":
        gradient.colors = [UIColor.whiteColor().CGColor, UIColor.clearColor().CGColor]
        gradient.locations = [0.8,1.0]
    default:
        gradient.colors = [UIColor.clearColor().CGColor,UIColor.whiteColor().CGColor,UIColor.whiteColor().CGColor, UIColor.clearColor().CGColor]
        gradient.locations = [0.0,0.2,0.8,1.0]
    }
    self.yourScrollView.superview!.layer.mask = nil
    self.yourScrollView.superview!.layer.mask = gradient
}

应该可以了！

有附加内容时滚动视图 Top/Bot 处的渐变

Gradient at Top/Bot of Scrollview When There's Additional Content

gradient

uiscrollview

ios

cagradientlayer

swift