首页 > 解决方案 > 在滚动上添加视差效果

问题描述

我有一个在顶部有一个滚动视图和一个常规视图的视图,现在它只是改变了图层高度,因此当滚动视图被向下拖动时,它会使其位于最顶层。

我想做一个更好的并添加一个很好的褪色效果,但目前我无法让它平滑褪色。

这是我目前正在做的事情:

private void MainScrollViewOnScrolled(object sender, EventArgs e)
{
    if (!(sender is UIScrollView scrollView))
    {
        return;
    }

    var topViewHeight = vTopPanel.Bounds.Height;
    var scrollOffsetY = scrollView.ContentOffset.Y;

    var scrollIndicatorInsets = scrollView.ScrollIndicatorInsets;

    nfloat scrollIndicatorTop = 0;
    var scrollOffsetDelta = topViewHeight - scrollOffsetY;

    if (scrollOffsetDelta > 0)
    {
        scrollIndicatorTop = scrollOffsetDelta;
    }

    scrollIndicatorInsets.Top = scrollIndicatorTop;
    scrollView.ScrollIndicatorInsets = scrollIndicatorInsets;

    var generalInfoEnabled = scrollOffsetY == 0;

    if (generalInfoEnabled)
    {
        vTopPanel.Alpha = 0;
        vTopPanel.Transform = CGAffineTransform.MakeIdentity();
        UIView.Animate(0.3f, 0, UIViewAnimationOptions.CurveEaseInOut,
            () => {
                vTopPanel.Alpha = 1;
            },
            null
        );
    }
    else
    {
        vTopPanel.Alpha = 1;
        vTopPanel.Transform = CGAffineTransform.MakeIdentity();
        UIView.Animate(0.3f, 0, UIViewAnimationOptions.CurveEaseInOut,
            () => {
                vTopPanel.Alpha = 0;
            },
            null
        );
    }
}

它可以工作,但不是很好,当我向下拖动它时它会消失,但是当我滚动回顶部时,顶视图重新出现时会出现明显的延迟。Android 有一种非常好的方法来实现视差效果,希望有人能引导我以正确的方式为 iOS 做这件事。

标签: xamarin.iosuiscrollviewparallax

解决方案


您可以将 与vTopPanel.Alpha一起更改scrollOffsetY。并通过 的值实现visable与否。visablescrollOffsetY

例如:

    private void MainScrollViewOnScrolled(object sender, EventArgs e)
    {
        if (!(sender is UIScrollView scrollView))
        {
            return;
        }

        var topViewHeight = vTopPanel.Bounds.Height;
        var scrollOffsetY = scrollView.ContentOffset.Y;

        var scrollIndicatorInsets = scrollView.ScrollIndicatorInsets;

        nfloat scrollIndicatorTop = 0;
        var scrollOffsetDelta = topViewHeight - scrollOffsetY;

        if (scrollOffsetDelta > 0)
        {
            scrollIndicatorTop = scrollOffsetDelta;
        }

        scrollIndicatorInsets.Top = scrollIndicatorTop;
        scrollView.ScrollIndicatorInsets = scrollIndicatorInsets;

        //you can custom the topViewAlpha  here 
        //nfloat topViewAlpha = scrollOffsetY / (this.View.Frame.Height -vTopPanel.Frame.Size.Height);

        nfloat topViewAlpha = scrollOffsetY / (vTopPanel.Frame.Size.Height);

        if (topViewAlpha >=1)
        {
            topViewAlpha = 1;
        }

        //To get the opposite effect
        topViewAlpha = 1 - topViewAlpha;


        vTopPanel.Alpha = topViewAlpha;
    }
}

推荐阅读