Android 标题栏和状态栏随ScrollView滑动颜色改变轻松实现

概述

在开发过程中,这样的需求也是常见的,随着ScrollView 的滑动,标题栏和状态栏背景透明度发生变化。有多中实现方式,在这里记录一下自己用到的一种。

效果

待上传

代码实现

public class ZpScrollViewActivity extends Activity{  
  
    private View titleLine;  
    private View titleLine1;  
    private LinearLayout title;  
    private LinearLayout top;  
    private MyScrollView scrollView;  
  
    @Override  
    protected void onCreate(@Nullable Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_scrollview);  
  
        initView();  
    }  
  
    private void initView() {  
        setTranslucentStatus(this, true);  
  
        title = (LinearLayout) findViewById(R.id.ll_title);  
        title.getBackground().mutate().setAlpha(0);  
        top = (LinearLayout) findViewById(R.id.ll_title_top);  
        titleLine1 = findViewById(R.id.v_title_line_1);  
        titleLine = findViewById(R.id.v_title_line);  
        scrollView = (MyScrollView) findViewById(R.id.sv_content);  
  
        // 设置状态栏高度  
        int statusBarHeight = this.getResources().getDimensionPixelSize(this.getResources().getIdentifier("status_bar_height", "dimen", "android"));  
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, statusBarHeight);  
        titleLine.setLayoutParams(params);  
        titleLine1.setLayoutParams(params);  
  
        // 设置滑动  
        scrollView.setOnScrollistener(new MyScrollView.OnScrollistener() {  
  
            @Override  
            public void onScroll(int startY, int endY) {  
                //根据scrollview滑动更改标题栏透明度  
                changeAphla(startY, endY);  
            }  
        });  
    }  
  
    /** 
     * 根据内容窗体的移动改变标题栏背景透明度 
     * 
     * @param startY scrollview开始滑动的y坐标(相对值) 
     * @param endY   scrollview结束滑动的y坐标(相对值) 
     */  
    private void changeAphla(int startY, int endY) {  
        //获取标题高度  
        int titleHeight = title.getMeasuredHeight();  
        //获取背景高度  
        int backHeight = top.getMeasuredHeight();  
  
        //获取控件的绝对位置坐标  
        int[] location = new int[2];  
        top.getLocationInWindow(location);  
        //从屏幕顶部到控件顶部的坐标位置Y  
        int currentY = location[1];  
        //表示回到原位(滑动到顶部)  
        if (currentY >= 0) {  
            title.getBackground().mutate().setAlpha(0);  
        }  
  
        Log.e("zpan", "=titleHeight=" + titleHeight + "=backHeight=" + backHeight + "=currentY=" + currentY);  
        //颜色透明度改变  
        if (currentY < titleHeight && currentY >= -(backHeight - titleHeight)) {  
            //计算出滚动过程中改变的透明值  
            double y = Math.abs(currentY) * 1.0;  
            double height = (backHeight - titleHeight) * 1.0;  
            int changeValue = (int) (y / height * 255);  
  
            Log.e("zpan", "changeValue=" + changeValue);  
            //判断是向上还是向下  
            if (endY > startY) {    //向上;透明度值增加,实际透明度减小  
                title.getBackground().mutate().setAlpha(changeValue);  
            } else if (endY < startY) {     //向下;透明度值减小,实际透明度增加  
                title.getBackground().mutate().setAlpha(changeValue);  
            }  
        }  
        //红色背景移除屏幕  
        if (currentY < -(backHeight - titleHeight)) {  
            title.getBackground().mutate().setAlpha(255);  
        }  
    }  
  
    /** 
     * 设置状态栏透明 
     * 
     * @param activity 
     * @param on 
     */  
    public void setTranslucentStatus(Activity activity, boolean on) {  
        Window win = activity.getWindow();  
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {  
            win.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS  
                    | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);  
            win.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN  
//                    | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION //保证华为虚拟键盘能显示  
                    | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);  
            win.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);  
            win.setStatusBarColor(Color.TRANSPARENT);  
//            win.setNavigationBarColor(Color.TRANSPARENT); //保证华为虚拟键盘是系统色  
        }  
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT && Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {  
            WindowManager.LayoutParams winParams = win.getAttributes();  
            final int bits = WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS;  
            if (on) {  
                winParams.flags |= bits;  
            } else {  
                winParams.flags &= ~bits;  
            }  
            win.setAttributes(winParams);  
        }  
    }  
} 

注:代码里面的关键位置,注释比较详细,在这里就不做过多的介绍,有兴趣可以实际的尝试一下。

布局:activity_scrollview

<?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
              android:layout_width="match_parent"  
              android:layout_height="match_parent">  
  
    <com.example.zpdemo.base.MyScrollView  
        android:id="@+id/sv_content"  
        android:layout_width="match_parent"  
        android:layout_height="match_parent"  
        android:fillViewport="true">  
  
        <LinearLayout  
            android:layout_width="match_parent"  
            android:layout_height="match_parent"  
            android:orientation="vertical">  
  
            <LinearLayout  
                android:id="@+id/ll_title_top"  
                android:layout_width="match_parent"  
                android:layout_height="wrap_content"  
                android:orientation="vertical"  
                android:background="#2c5aff">  
  
                <View  
                    android:id="@+id/v_title_line"  
                    android:layout_width="match_parent"  
                    android:layout_height="0dp"/>  
  
                <View  
                    android:layout_width="match_parent"  
                    android:layout_height="50dp"/>  
  
                <TextView  
                    android:layout_width="match_parent"  
                    android:layout_height="150dp"  
                    android:gravity="center"  
                    android:text="状\n态\n改\n变"  
                    android:textColor="#ffffff"  
                    android:textSize="24sp"/>  
  
            </LinearLayout>  
  
            <TextView  
                android:layout_width="match_parent"  
                android:layout_height="600dp"  
                android:gravity="center"  
                android:background="#b5f581"  
                android:text="内\n容\n区\n域"  
                android:textColor="#ffffff"  
                android:textSize="24sp"/>  
  
        </LinearLayout>  
    </com.example.zpdemo.base.MyScrollView>  
  
    <LinearLayout  
        android:id="@+id/ll_title"  
        android:layout_width="match_parent"  
        android:layout_height="wrap_content"  
        android:orientation="vertical"  
        android:background="#f10303">  
  
        <View  
            android:id="@+id/v_title_line_1"  
            android:layout_width="match_parent"  
            android:layout_height="0dp"/>  
  
        <TextView  
            android:layout_width="match_parent"  
            android:layout_height="50dp"  
            android:gravity="center"  
            android:text="头部"  
            android:textColor="#ffffff"  
            android:textSize="18sp"/>  
  
        <View  
            android:layout_width="match_parent"  
            android:layout_height="2dp"  
            android:background="#fff"/>  
  
    </LinearLayout>  
</RelativeLayout>  

自定义ScrollView 滑动事件,是为了处理ScrollView 的向下兼容问题

public class MyScrollView extends ScrollView {  
  
    private OnScrollistener onScrollistener;  
  
    public OnScrollistener getOnScrollistener() {  
        return onScrollistener;  
    }  
  
    public void setOnScrollistener(OnScrollistener onScrollistener) {  
        this.onScrollistener = onScrollistener;  
    }  
  
    public MyScrollView(Context context, AttributeSet attrs, int defStyle) {  
        super(context, attrs, defStyle);  
    }  
  
    public MyScrollView(Context context, AttributeSet attrs) {  
        super(context, attrs);  
    }  
  
    public MyScrollView(Context context) {  
        super(context);  
    }  
  
    public interface OnScrollistener {  
  
        void onScroll(int startY, int endY);  
    }  
  
    @Override  
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {  
        onScrollistener.onScroll(oldt, t);  
        super.onScrollChanged(l, t, oldl, oldt);  
    }  
} 

注:代码意思比较简单,不做过多的解释

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,128评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,316评论 3 388
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,737评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,283评论 1 287
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,384评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,458评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,467评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,251评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,688评论 1 306
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,980评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,155评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,818评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,492评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,142评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,382评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,020评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,044评论 2 352

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,947评论 25 707
  • 上月少时合约期满,解散的消息满天飞,不算严格意义上的sone,但刷着东京那一场《再次重逢的世界》还是满怀遗憾。 ‍...
    互撩中毒的钱哥和大爷阅读 590评论 0 0
  • 天天天气预报,发现今天江夏是重度污染,心情很沉重。 用百度云盘下载也是很奇怪的,在对你的文件夹里面找不到...
    忽尔今至阅读 134评论 0 0
  • 第一最好不相见,如此便可不相恋。 那年秋天,他们第一次见面。考试成绩他只比她低一分,她回头望去,正巧他抬头,目光在...
    北冥小鱼阅读 221评论 0 0