Edited at

スクロールに合わせて背景色がじわじわ切り替わるPageViewControllerの実装

GIF image-41F1D5F44551-1.gif

Snapchatっぽく、PageViewControllerに合わせて背景のalphaが変わるやつをやってみました。

ちなみに後ろにCameraのViewControllerを表示してその上にPageViewControllerを置いています。


①PageVCをUIScrollViewDelegateに準拠させる

    override func viewDidLoad() {

super.viewDidLoad()

for subView in self.view.subviews {
if let scrollView = subView as? UIScrollView {
scrollView.delegate = self
}
}
}


②UIScrollViewDelegateでスクロール位置を把握し、alphaを変化させる

extension PageViewController: UIScrollViewDelegate {

func scrollViewDidScroll(_ scrollView: UIScrollView) {
let offset = scrollView.contentOffset.x
let alpha = (offset - screenWidth) / screenWidth

switch currentNumber {
case .first:
self.view.backgroundColor = UIColor.yellow.withAlphaComponent(alpha)
case .second:
let reverseAlpha = 1.0 + alpha
self.view.backgroundColor = UIColor.yellow.withAlphaComponent(reverseAlpha)
}
}
}


全体のコードはこちら

https://gist.github.com/kboy-silvergym/8103785e210486bc4485b72409373561