标题栏渐变

翻淘宝的时候注意到物品详情页面,页面上推的时候,标题栏会随着上推进行颜色渐变,网上搜了一下,发现了这篇博客,于是就仿照着写了一个。

参考博客地址:http://blog.csdn.net/lyhhj/article/details/52107851

我自己写的时候只是简单的敲了上推渐变。

自定义的ScrollView文件如下:

public class MyScrollerView extends ScrollView {

    public interface ScrollViewListener {

        void onScrollChanged(MyScrollerView scrollView, int x, int y,
                             int oldx, int oldy);
    }

    private ScrollViewListener scrollViewListener = null;

    public MyScrollerView(Context context) {
        super(context);
    }

    public MyScrollerView(Context context, AttributeSet attrs,
                          int defStyle) {
        super(context, attrs, defStyle);
    }

    public MyScrollerView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public void setScrollViewListener(ScrollViewListener scrollViewListener) {
        this.scrollViewListener = scrollViewListener;
    }

    @Override
    protected void onScrollChanged(int x, int y, int oldx, int oldy) {
        super.onScrollChanged(x, y, oldx, oldy);
        if (scrollViewListener != null) {
            scrollViewListener.onScrollChanged(this, x, y, oldx, oldy);
        }
    }
}

xml文件如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.pistol.viewtest.MainActivity">


    <com.pistol.viewtest.MyScrollerView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/tv_banner"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="@color/colorAccent"/>

            <View
                android:layout_width="match_parent"
                android:layout_height="1000dp">
            </View>
        </LinearLayout>
    </com.pistol.viewtest.MyScrollerView>

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:background="#00000000"
        android:gravity="center"
        android:padding="10dp"
        android:text="title"
        android:textColor="#00000000"/>

</RelativeLayout>

Activity文件如下:

public class MainActivity extends AppCompatActivity implements MyScrollerView.ScrollViewListener {

    private TextView       tvBanner; //默认展示的banner
    private TextView       tvTitle; //上推到最后要展示的title
    private MyScrollerView scrollView; //自定义的控件,覆写了onScrollChanged
    private int            height; //需要计算的banner的高度

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getWindow().requestFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        scrollView = (MyScrollerView) findViewById(R.id.scrollView);
        tvBanner = (TextView) findViewById(R.id.tv_banner);
        tvTitle = (TextView) findViewById(R.id.tv_title);
        measure();
    }

    //onCreate中获取控件高度
    private void measure() {
        ViewTreeObserver vto = tvBanner.getViewTreeObserver();
        vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                //防止二次测量
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                    tvBanner.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                } else {
                    tvBanner.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                }

                height = tvBanner.getHeight();
                //添加监听
                scrollView.setScrollViewListener(MainActivity.this);
            }
        });
    }

    @Override
    public void onScrollChanged(MyScrollerView scrollView, int x, int y, int oldx, int oldy) {
        if (y <= 0) {   //设置标题的背景颜色
            tvTitle.setBackgroundColor(Color.argb((int) 0, 144, 151, 166));
        } else if (y > 0 && y <= height) { //滑动距离小于banner图的高度时,设置背景和字体颜色颜色透明度渐变
            float scale = (float) y / height;
            float alpha = (255 * scale);
            tvTitle.setTextColor(Color.argb((int) alpha, 0, 0, 0));
            tvTitle.setBackgroundColor(Color.argb((int) alpha, 255, 255, 0));
        } else {    //滑动距离大于banner时,设置标题的背景颜色
            tvTitle.setBackgroundColor(Color.argb((int) 255, 255, 255, 0));
        }
    }
}


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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值