UIScrollView, показывающий, что существует больше данных за счет затухания текста

Question

Есть ли способ затухания текста внизу и вверху, когда в UIScrollView есть больше данных для прокрутки? Должен ли я поместить что-то поверх UILabel, которое есть в UIScrollView, чтобы получить такой эффект?

Answer 1

Вы можете использовать CAGradientLayer как сверху, так и снизу. Вы можете добавить / удалить это в методе делегата scrollViewDidScroll: на основе представления прокрутки contentOffset,

Answer 2

Вы можете добавить ImageView как подпредставление для прокрутки с прозрачным png в нем.

Answer 3

Я попытался реализовать предложение Дипака в Swift.

Я думаю, что это будет так,

class MyViewController: UIViewController, UIScrollViewDelegate {

@IBOutlet weak var textView: UITextView! ///< the scrolling text
let gradientLayer = CAGradientLayer()
var yEnd : CGFloat = 1

override func viewDidLoad() {
    super.viewDidLoad()
}

override func viewDidLayoutSubviews() {
    yEnd = CGFloat(textView.bounds.height) / CGFloat(textView.contentSize.height)
    gradientLayer.frame = CGRect(x: 0, y: 0, width: textView.contentSize.width, height: textView.contentSize.height)
    gradientLayer.locations = [0, 0.2, 0.8, 1]
    gradientLayer.opaque = false
    gradientLayer.opacity = 1
    gradientLayer.startPoint = CGPoint(x: 0, y: 0)
    gradientLayer.endPoint = CGPoint(x: 0, y: yEnd)
    scrollOrigin = textView.bounds.origin.y
    // scroll to the top of the text. It will trigger scrollViewDidScroll
    textView.setContentOffset(CGPoint(x: 0,y: 0), animated: false)
    textView.layer.mask = gradientLayer
}

func scrollViewDidScroll(scrollView: UIScrollView) {
    // move the CALayer as we scroll, otherwise the fade will be scrolled away
    let lineHeight : CGFloat = 20
    let yOffset = CGFloat(scrollView.contentOffset.y) / CGFloat(scrollView.bounds.height)
    let yBottom = lineHeight - (textView.contentSize.height - scrollView.contentOffset.y - scrollView.bounds.height)
    gradientLayer.startPoint = CGPoint(x: 0, y: yOffset * yEnd)
    gradientLayer.endPoint = CGPoint(x: 0, y: (1 + yOffset) * yEnd)
    // change the alpha on top to fully visible on start of text
    let alphaTop = yOffset > 0 ? yOffset < 0.2 ? 5 * (0.2 - yOffset) : 0 : 1
    let alphaBottom = yBottom > 0 ? yBottom / lineHeight : 0
    gradientLayer.colors = [
        UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: alphaTop).CGColor,
        UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 1.0).CGColor,
        UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 1.0).CGColor,
        UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: alphaBottom).CGColor
    ]
}

}

Проблема в том, что я вижу некоторую задержку в обновлениях градиента, поэтому она не совсем гладкая.

Answer 4

Вы можете легко увеличивать и уменьшать изображения, используя Core Animation. Посмотрите раздел Анимации Руководства по программированию View для iOS, чтобы понять, что вы можете легко анимировать. Есть даже пример (Перечисление 4-1) анимации свойства alpha.