Unity ScrollView图片滑动翻页效果

类似中间这个广告滑动窗效果

这个效果就类似安卓手机翻相册里面图片时左右翻的效果,做出这个效果有很多种方式,比如移动端的话你可以直接判断手势,然后去让图片往相应
方向滑动,我这里的方法是直接根据ScrollBar(用的NGUI,UGUI应该也是可以的)的值来判定,适用各种平台,方法如下:
(第一次发表文章,萌新,不到之处,多多见谅!)
    public UIScrollBar scrollBar; //滑动条
    public UIScrollView scrollView; //滑动窗
    private float lastValue = 0f; //保存上次滑动条的位置
    private float xOffsetRate = 0.25f; //图片是否需要翻到下一张的一个判定偏移值
    private float scrollRate;//滑动一次的比例(即一张图片占ScrollBar里面的值得比例)
    private int viewItems = 3; //滑动窗内图片的个数(这里为了方便直接赋值了,应该是动态获取)
    void Start()
    {
        scrollRate = viewItems > 1 ? 1f / (count - 1) : -1f;
        scrollView.onDragFinished += DragFinished;
    }
    //拖动图片结束后,适配图片的偏移
    void DragFinished()
    {
        //如果图片张数少于2张,则没有滑动动效果
        if (scrollRate == -1f) return;
        //图片右滚动操作
        if (scrollBar.value - lastValue >= xOffsetRate * scrollRate)
        {
            lastValue += scrollRate;
        }
        //图片左滚动操作
        else if (lastValue - scrollBar.value >= xOffsetRate * scrollRate)
        {
            lastValue -= scrollRate;
        }
        //过渡动画效果
        DOTween.To(() => scrollBar.value, x => scrollBar.value = x, lastValue, 0.3f);
    }
我这边是一次只能滑动一个图片,当然你可以在DragFinished()里面计算出(scrollBar.value - lastValue)/(xOffsetRate * scrollRate)
的一个比例值value,然后lastValue += scrollRate * value,做出滑动多张的效果。
另外,已知一个优化方向就是:当手或鼠标滑出ScrollView时,就判定滑动结束,调用DragFinished(),这样体验更好。
大家有什么更好的方法,欢迎补充,互相学习交流,共同进步!(这个博客排版为什么发出来显示有问题,文本不能自动换行。。。)
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值