ios - 在视差标题上滚动时添加模糊效果(Swift)

Question

好吧，我想要实现的是在这个库中 https://github.com/Vinodh-G/ParallaxTableViewHeader但是在实现这个库时遇到了问题:

问题:

1. 它在 ObjC 上，我的母语是 Swift，所以很难理解幕后发生的事情

2. 我以某种方式实现了这个库，但 headerView 的图像不在中心，我尝试将 ContentMode 设置为 scaletofill，居中，但它对我不起作用

它看起来像这样(在我滚动一次之前不在中心)

所以

滚动后:

所以我创建了自己的并且它工作正常只有一个问题是我还没有任何模糊效果，所以如果有人知道它是如何工作的或者我如何在我的 HeaderView 上添加这种模糊效果那么请告诉我

我的(Swift)HeaderView:

class HeaderView: UIView {

var heightLayoutConstraint = NSLayoutConstraint()
var bottomLayoutConstraint = NSLayoutConstraint()

var containerView = UIView()
var containerLayoutConstraint = NSLayoutConstraint()

override init(frame: CGRect) {
    super.init(frame: frame)
    self.backgroundColor = UIColor.whiteColor()

    // The container view is needed to extend the visible area for the image view
    // to include that below the navigation bar. If this container view isn't present
    // the image view would be clipped at the navigation bar's bottom and the parallax
    // effect would not work correctly

    containerView.translatesAutoresizingMaskIntoConstraints = false
    containerView.backgroundColor = UIColor.redColor()
    self.addSubview(containerView)
    self.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[containerView]|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["containerView" : containerView]))
    self.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:[containerView]|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["containerView" : containerView]))
    containerLayoutConstraint = NSLayoutConstraint(item: containerView, attribute: .Height, relatedBy: .Equal, toItem: self, attribute: .Height, multiplier: 1.0, constant: 0.0)
    self.addConstraint(containerLayoutConstraint)

    let imageView: UIImageView = UIImageView.init()
    imageView.translatesAutoresizingMaskIntoConstraints = false
    imageView.backgroundColor = UIColor.whiteColor()
    imageView.clipsToBounds = true
    imageView.contentMode = .ScaleAspectFill
    imageView.image = UIImage(named: "cover")
    containerView.addSubview(imageView)
    containerView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[imageView]|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["imageView" : imageView]))
    bottomLayoutConstraint = NSLayoutConstraint(item: imageView, attribute: .Bottom, relatedBy: .Equal, toItem: containerView, attribute: .Bottom, multiplier: 1.0, constant: 0.0)
    containerView.addConstraint(bottomLayoutConstraint)
    heightLayoutConstraint = NSLayoutConstraint(item: imageView, attribute: .Height, relatedBy: .Equal, toItem: containerView, attribute: .Height, multiplier: 1.0, constant: 0.0)
    containerView.addConstraint(heightLayoutConstraint)
}

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
}



func scrollViewDidScroll(scrollView: UIScrollView) {

    containerLayoutConstraint.constant = scrollView.contentInset.top;
    let offsetY = -(scrollView.contentOffset.y + scrollView.contentInset.top);
    containerView.clipsToBounds = offsetY <= 0
    bottomLayoutConstraint.constant = offsetY >= 0 ? 0 : -offsetY / 2
    heightLayoutConstraint.constant = max(offsetY + scrollView.contentInset.top, scrollView.contentInset.top)
}

Answer 1

好吧，与其尝试模糊图像，不如在图像上添加一个 overlayView，它当然设置为 clearColor()，然后在向上滚动时将叠加 View 的背景颜色设置为:-

UIColor(white: 1.0, alpha: scrollView.contentOffset.y/180)

请注意，我使用了一个 tableView 设置两种不同类型的单元格(一个包含 imageView 的 parallaxHeaderViewCell 和它上面的 overlayView，另一个是用于 tableView 的 normalCell)。我写的 scrollView 来自:-

func scrollViewDidScroll(scrollView: UIScrollView!)

我也曾使用自己的代码来实现视差，而不是实现第三方。它易于实现，没什么大不了的!!