web-dev-qa-db-ja.com

iOS視差スクロール効果（Yahoo News Digestアプリのように）

Yahoo NewsDigestアプリと同様の視差スクロールの実装方法を教えてください。ユーザーが水平にスクロールすると、ページングが有効になり、背景画像が異なる速度でスクロールします。

彼らは背景ビューのScrollViewでそれをしているのかもしれません。正確にはわかりません。このようなスクロールを実装するためのヒントは素晴らしいでしょう。同様の質問を確認しましたが、探していた答えが見つかりませんでした。

iosyahooparallax
15
Tharindu Madushanka

私は以前に2つのスクロールビューでこれを行いました。

メインの詳細スクロールビューがあり、その後ろに（またはどこにでも）視差スクロールビューがあります。

次に、詳細スクロールビューのデリゲートになります。

メソッドでscrollView:didScroll次に、視差ビューのスクロールを調整できます。

X軸を実行しているだけの場合は、次のようなものが必要です...

CGFloat detailMaxOffset = self.detailScrollView.contentSize.width - CGRectGetWidth(self.scrollView.frame);

CGFloat percentage = self.detailScrollView.contentOffset.x / maxOffset;

CGFloat parallaxMaxOffset = self.parallaxScrollView.contentSize.width - CGRectGetWidth(self.parallaxScrollView.frame);

[self.parallaxScrollView setContentOffset:CGPointMake(percentage * parallaxOffset, 0);

これにより、scrollviewsコンテンツオフセットの「パーセンテージ」がそれぞれ同じになるように設定されます。

視差効果を得るには、各スクロールビューのcontentSizeを変えるだけです。

視差スクロールビューのコンテンツサイズが詳細スクロールビューよりも大きい場合、スクロールが速くなります。コンテンツサイズが小さい場合、スクロールが遅くなります。

21
Fogmeister

これが答えです。データを再利用できるようにuitableviewからサブクラス化し、uiviewでラップします。 https://github.com/michaelhenry/MHYahooParallaxView

ありがとう、ケル

11
Michael Henry

100％機能し、ダムが簡単

画像ビューの正確なサイズの画像ビューを表示します。デフォルトでは、ビューセット0のアルファ。

//MARK: Scroll View Delegate methods
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

  NSLog(@"X: %f Y: %f",scrollView.contentOffset.x,scrollView.contentOffset.y);

CGFloat scrollY = _mainScrollView.contentOffset.y;
CGFloat height = _alphaView.frame.size.height;

CGFloat alphaMonitor = scrollY/height;

_alphaView.alpha = alphaMonitor;
}
0
Mr.Javed Multani

Swift

TvOSアプリの垂直スクロールでSwift 3）で視差効果を機能させる方法は次のとおりです。

ViewDidLoad（）で：

    parallaxScrollView.delegate = self
    detailScrollView.delegate = self

そして以下：

override func viewDidLayoutSubviews() {
        self.detailScrollView!.contentSize = CGSize(width: 1920, height: 2700)
        self.parallaxScrollView?.contentSize = CGSize(width: 1920, height: 3000)
    }


//// THE SCROLL VIEW

func scrollViewDidScroll(_ scrollView: UIScrollView) {

    // Parallax effect
    let detailMaxOffset = self.detailScrollView.contentSize.height - self.detailScrollView.frame.height;
    let percentage = self.detailScrollView.contentOffset.y / detailMaxOffset
    let parallaxMaxOffset = self.parallaxScrollView.contentSize.height - self.parallaxScrollView.frame.height;
    let parallaxOffset = CGPoint(x:0,y:(percentage * parallaxMaxOffset))
    self.parallaxScrollView.setContentOffset((parallaxOffset), animated: false)

}
0
Peter Wiley