仿京东淘宝商品详情页title滑动隐藏

话不多说直接上图上代码

在这里插入图片描述

1.一些布局代码

// 从这货拿到scorll
<android.support.v4.widget.NestedScrollView
        android:id="@+id/nsv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:overScrollMode="never">
        
        <LinearLayout 
        		xxx...>
        		
				// 根据这货移动的位置显示隐藏title
                <com.youth.banner.Banner
                    android:id="@+id/banner"
                    android:layout_width="match_parent"
                    android:layout_height="400dp"/>

        </LinearLayout>

  </android.support.v4.widget.NestedScrollView>
    

2.一些监听代码


// 这个banner就是布局里的那个
ViewTreeObserver viewTreeObserver = banner.getViewTreeObserver();
viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @TargetApi(Build.VERSION_CODES.M)
            @Override
            public void onGlobalLayout()
            {
            // 这个nsv就是NestedScrollView
                nsv.setOnScrollChangeListener(new View.OnScrollChangeListener() {
                    @Override
                    public void onScrollChange(View v, int scrollX, int scrollY, int oldScrollX, int oldScrollY)
                    {
                    	// 拿到一个height
                        height = banner.getHeight() - Utils.dip2px(44);
                        mScrollY = scrollY;
                        changeTitle(scrollY);
                    }
                });
            }
        });

3.一些重点代码

 private void changeTitle(int scrollY)
    {
        if (scrollY <= 0)
        {
            //设置标题的背景颜色
            llTitle.setBackgroundColor(Color.argb(0, 255, 255, 255));
            tvTitle.setTextColor(Color.argb(0, 1, 24, 28));
            ivLeft.setAlpha(1f);
            ivRight.setAlpha(1f);
            ivLeft.setImageResource(R.mipmap.icon_back_goods);
            ivRight.setImageResource(mIsCollect ? R.mipmap.icon_collect_red1 : R.mipmap.icon_collect1);

        } else if (scrollY > 1 && scrollY <= height)
        {
            // 滑动距离小于图的高度时,设置背景和字体颜色颜色透明度渐变
            float scale = (float) scrollY / height;
            float alpha = (255 * scale);
            llTitle.setBackgroundColor(Color.argb((int) alpha, 255, 255, 255));
            tvTitle.setTextColor(Color.argb((int) alpha, 1, 24, 28));

            if (scrollY <= height / 2)
            {
                float scale2 = (float) scrollY / ((float) height / 2);
                ivLeft.setAlpha(1f - scale2);
                ivRight.setAlpha(1f - scale2);
                if ((scrollY >= height / 2 - 10) && scrollY <= height / 2)
                {
                    // 减少set
                    ivLeft.setImageResource(R.mipmap.icon_back_goods);
                    ivRight.setImageResource(mIsCollect ? R.mipmap.icon_collect_red1 : R.mipmap.icon_collect1);
                }
            } else
            {
                float scale3 = ((float) scrollY - ((float) (height / 2))) / ((float) height / 2);
                ivLeft.setAlpha(scale3);
                ivRight.setAlpha(scale3);
                if ((scrollY >= height / 2 + 10) && scrollY <= height)
                {
                    // 减少set
                    ivLeft.setImageResource(R.mipmap.icon_back_goods_black);
                    ivRight.setImageResource(mIsCollect ? R.mipmap.icon_collect_red2 : R.mipmap.icon_collect2);
                }
            }

        } else
        {
            // 滑动到图下面设置普通颜色
            llTitle.setBackgroundColor(Color.argb(255, 255, 255, 255));
            tvTitle.setTextColor(Color.argb(255, 1, 24, 28));
            ivLeft.setAlpha(1f);
            ivRight.setAlpha(1f);
            ivLeft.setImageResource(R.mipmap.icon_back_goods_black);
            ivRight.setImageResource(mIsCollect ? R.mipmap.icon_collect_red2 : R.mipmap.icon_collect2);
        }
    }




如有问题请指正

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值