Android 透明狀態欄 沉浸式狀態欄的實作
- Android 透明狀態欄
- 實作平臺
- 設定所需要的顏色
- 填滿螢屏
- 狀態欄透明化
- Padding調整
- 狀態欄顏色文字顏色設定(可選)
- 顏色填充
- 任務完成!
最近在做畢業設計,想要實作沉浸式狀態欄,在網上搜索了好多的文章后拼拼湊湊,才實作了這個功能,也算是第一次做Android開發,所以寫個文章紀念一下,并且分享給大家,
Android 透明狀態欄
實作平臺
Android 10 ,Flyme8.0,MEIZU 17 pro,
理論上應該支持所有的Android 6.0 以上的系統,
設定所需要的顏色
在color.xml檔案中首先設定一個透明的顏色以及你所需要的狀態欄顏色,
這樣的操作可以方便你以后對狀態欄顏色進行修改,就像修改變數一樣就可以改變所有的該顏色,
color.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="flesh">#F1E8D9</color>
<color name="flesh_black">#F8E4C2</color>
<color name="white">#FFFFFF</color>
<color name="black">#000000</color>
<color name="transparent">#00FFFFFF</color>
<color name="tea_green">#7CB342</color>
<color name="tea_green_black">#43A047</color>
<color name="app_bg_color">@color/flesh</color>
<color name="app_text_color">@color/black</color>
<color name="topBar_color">@color/flesh_black</color>
<color name="statusBar_color">@color/flesh_black</color>
<color name="tab_bg_color">@color/tea_green</color>
<color name="tab_bg_onclick_color">@color/tea_green_black</color>
<color name="tab_text_color">@color/white</color>
</resources>
填滿螢屏
首先先讓Activity填滿螢屏,
在style.xml中的要修改的Activity的主題中添加如下代碼,
<item name="android:windowTranslucentStatus">false</item><!--可以頁面拉伸到狀態欄頂部-->
<item name="android:windowTranslucentNavigation">true</item><!--可以頁面拉伸到虛擬按鍵底部-->
添加后的代碼如下:
style.xml
<style name="TabTheme_NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:background">@color/app_bg_color</item>
<item name="android:textColor">@color/app_text_color</item>tools:targetApi="m">true</item>-->
<item name="android:windowTranslucentStatus">false</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
效果如下圖,我們還需要使狀態欄變為透明,
狀態欄透明化
再在style.xml中添加對狀態欄透明化的代碼,
#00FFFFFF是透明的顏色引數,如果你需要修改為其他的顏色,可以自行修改,
<item name="android:statusBarColor" tools:targetApi="lollipop">#00FFFFFF</item><!--設定狀態欄的顏色-->
style.xml
<style name="TabTheme_NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:background">@color/app_bg_color</item>
<item name="android:textColor">@color/app_text_color</item>
<item name="android:statusBarColor" tools:targetApi="lollipop">#00FFFFFF</item>
<item name="android:windowTranslucentStatus">false</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
效果如下圖
我們發現還需要調整界面的Padding,使它能將狀態欄的位置空出來,
Padding調整
需要在Activity的class檔案中,
使用setPadding(int left, int top, int right, int bottom)方法限制Activity的位置,
通過getStatusBarHeight方法獲取狀態欄的高度,然后對Activity進行限制,
//設定relativeLayout的padding
findViewById(R.id.relativeLayout)
.setPadding(0, getStatusBarHeight(), 0, 0);
//將這段代碼添加到class的onCreate方法中
//獲取狀態欄高度
public int getStatusBarHeight() {
int result = 0;
//獲取狀態欄高度的資源id
int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
if (resourceId > 0) {
result = getResources().getDimensionPixelSize(resourceId);
}
return result;
}
Activity.class
public class MainActivity extends TabActivity {
//MainActivity初始化方法
@RequiresApi(api = Build.VERSION_CODES.M)
@Override
protected void onCreate(Bundle savedInstanceState) {
//初始化頁面
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//設定relativeLayout的padding
findViewById(R.id.relativeLayout)
.setPadding(0, getStatusBarHeight(), 0, 0);
}
//獲取狀態欄高度
public int getStatusBarHeight() {
int result = 0;
//獲取狀態欄高度的資源id
int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
if (resourceId > 0) {
result = getResources().getDimensionPixelSize(resourceId);
}
return result;
}
}
效果如下圖
狀態欄顏色文字顏色設定(可選)
如果程式的背景顏色是淺色系,諸如我的程式一樣,
你可以再對狀態欄文字的顏色進行修改,
以下的代碼相當于告訴系統:我的狀態欄是淺色的,請把文字改為黑色,
<item name="android:windowLightStatusBar" tools:targetApi="m">true</item>
修改后的style.xml檔案
style.xml
<style name="TabTheme_NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:background">@color/app_bg_color</item>
<item name="android:textColor">@color/app_text_color</item>
<item name="android:statusBarColor" tools:targetApi="lollipop">#00FFFFFF</item>
<item name="android:windowLightStatusBar" tools:targetApi="m">true</item>
<item name="android:windowTranslucentStatus">false</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
效果如下圖
這樣我們就實作了無填充的透明的狀態欄,
如果你的程式不像我一樣頂部有其他顏色的部件,那么你的沉浸式狀態欄就完成了,
但是這樣的界面對我來說還不是滿意的, 我還需要將狀態狀態欄下進行填充來改變上方的顏色,
顏色填充
這個需求我是填充TextView進行實作,
https://blog.csdn.net/sinat_38184748/article/details/96827134 android 在LinearLayout中動態添加View BY YD-10-NG
addView(View child) // child-被添加的View
addView(View child, int index) // index-被添加的View的索引
addView(View child, int width, int height) // width,height被添加的View指定的寬高
addView(View view, ViewGroup.LayoutParams params) // params被添加的View指定的布局引數
addView(View child, int index, LayoutParams params)
首先對TextView類繼承,然后將其修改為我們所需要的填充物,
TopBar_TextView.java
//TopBar_TextView.java
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.view.ViewGroup;
public class TopBar_TextView extends androidx.appcompat.widget.AppCompatTextView {
//初始化方法
@SuppressLint({"ResourceAsColor", "UseCompatLoadingForDrawables"})
public TopBar_TextView(Context context, Drawable drawable) {
super(context);
this.setBackgroundDrawable(drawable);//設定填充物顏色
this.setHeight(getStatusBarHeight());//設定填充物高度,等于狀態欄高度
this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);//設定填充物寬度為狀態欄寬度
}
//獲取狀態欄高度
public int getStatusBarHeight() {
int result = 0;
//獲取狀態欄高度的資源id
int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
if (resourceId > 0) {
result = getResources().getDimensionPixelSize(resourceId);
}
return result;
}
}
TeaControlActivity.class
import android.annotation.SuppressLint;
import android.app.ActionBar;
import android.app.Activity;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.widget.LinearLayout;
import android.widget.TextView;
import androidx.annotation.Nullable;
public class TeaControlActivity extends Activity {
private LinearLayout linearLayout;
private int top = 0;//置頂
Drawable drawable;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tea_control);
//狀態欄遮擋物的顏色
drawable = getResources().getDrawable(R.color.statusBar_color);
//添加狀態欄遮擋
linearLayout = findViewById(R.id.LinearLayout_control);
linearLayout.addView(new TopBar_TextView(TeaControlActivity.this,drawable), top);
}
}
效果如下圖
任務完成!
Android開發新手一個,
如有錯誤請大家指正,
如有疑問,請留言,我會盡力為大家解答,
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/258459.html
標籤:其他
