Android沉浸式頂欄的實現

最近好長時間沒用path了,今天登陸之後猛然間發現path的的導航條和手機系統的通知欄的顏色融爲一體,諮詢過別人之後才發現這是Android4.4系統出現的新功能,官方術語叫:沉浸式頂欄。現在我們就來記錄該功能的實現方式:

首先創建一個Android項目。



在style.xml中添加


   <style name="Theme.Timetodo" parent="@android:style/Theme.Holo.Light">

        <!-- translucent system bars -->
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowTranslucentNavigation">true</item>
    </style>


其中 android:windowTranslucentStatus表示是否要填充頂部的狀態欄區域
android:windowTranslucentNavigation表示是否要填充底部的狀態欄區域
這兩種樣式的目的就是默認讓應用的內容放置到系統欄的下邊,如果僅僅想擴展背景樣式到系統欄下邊,則需要設置android:fitsSystemWindows爲true,
會增加試圖的Pading值讓你的佈局恢復正常大小,並且可以將背景擴大。


在已經創建的Activity中添加

package com.example.androidedemo;

import java.lang.reflect.Field;

import android.annotation.SuppressLint;
import android.app.ActionBar;
import android.app.ActionBar.LayoutParams;
import android.app.Activity;
import android.content.res.Resources;
import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.util.TypedValue;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.TextView;

@SuppressLint("NewApi")
public class MainActivity extends Activity {
    private RelativeLayout rlLayout;

	@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //設置ACtionBar
        ActionBar actionBar = getActionBar();
        Resources r = getResources();
        Drawable myDrawable = r.getDrawable(R.drawable.ba);
        actionBar.setBackgroundDrawable(myDrawable);
        
        actionBar.setDisplayHomeAsUpEnabled(true);
        actionBar.setHomeButtonEnabled(true);
        
        rlLayout = (RelativeLayout) findViewById(R.id.rlayout);
        ListView listView = (ListView) findViewById(R.id.listView);
        listView.setAdapter(new MyAdapter(getApplicationContext()));
        
<span style="white-space:pre">	</span>//此處判斷的目的是讓Android系統大於等於4.4的系統才執行沉浸式的功能
        if (android.os.Build.VERSION.SDK_INT > 18) {
            Window window = getWindow();
            window.setFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS, WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            window.setFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION, WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
        }
<span style="white-space:pre">	</span>//獲取到系統通知欄的高度,然後給系統通知欄設置我們需要的顏色。並將其addView到ViewGroup中。
        // 創建TextView
         TextView textView = new TextView(this);
         LinearLayout.LayoutParams lParams = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, getStatusBarHeight());
         textView.setBackgroundColor(Color.parseColor("#3F9FE0"));
         textView.setLayoutParams(lParams);
         // 獲得根視圖並把TextView加進去。
         ViewGroup view = (ViewGroup) getWindow().getDecorView();
         view.addView(textView);
     }


    //開啓全屏模式
    @SuppressLint("NewApi")
    public static void hideSystemUI(View view) {
        view.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_FULLSCREEN
                | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
    }

    //取消全屏模式
    @SuppressLint("NewApi")
    public static void showSystemUI(View view) {
        view.setSystemUiVisibility(
                View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
    }
    
 // 獲取手機狀態欄高度
    public int getStatusBarHeight() {
        Class<?> c = null;
        Object obj = null;
        Field field = null;
        int x = 0, statusBarHeight = 0;
        try {
            c = Class.forName("com.android.internal.R$dimen");
            obj = c.newInstance();
            field = c.getField("status_bar_height");
            x = Integer.parseInt(field.get(obj).toString());
            statusBarHeight = getResources().getDimensionPixelSize(x);
        } catch (Exception e1) {
            e1.printStackTrace();
        }
        return statusBarHeight;
    }

    // 獲取ActionBar的高度
    public int getActionBarHeight() {
        TypedValue tv = new TypedValue();
        int actionBarHeight = 0;
        if (getTheme().resolveAttribute(android.R.attr.actionBarSize, tv, true))// 如果資源是存在的、有效的
        {
            actionBarHeight = TypedValue.complexToDimensionPixelSize(tv.data, getResources().getDisplayMetrics());
        }
        return actionBarHeight;
    }
}



在drawable文件夾中添加

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <gradient
        android:angle="270"
        android:endColor="#c8c8c8"
        android:startColor="#3F9FE0"
        android:type="linear" />

</shape>  

此代碼是給您的導航條設置一個漸變,目的是讓導航條和系統通知欄的樣式融合看起來更加緊密。


最後在AndroidManifest.xml文件中將Application中的theme更改爲上邊我們定義的樣式

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.androidedemo"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="8" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/Theme.Timetodo" >
        <activity
            android:name="com.example.androidedemo.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>


最後運行結果:


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章