[Android] 狀態欄(Status Bar)文字與圖示轉換成灰色

應該有許多人有遇到這樣的問題，UI/UX設計師所設計的畫面中，有時為了配合設計，最上方狀態欄(Status Bar)背景設計為淺色系的，這時狀態欄中的文字與圖示(時間、網路訊號等)系統預設是白色的，會變得十分不顯眼。

在Android 6.0(API 23)之後，有兩種方法可以使狀態欄中的文字與圖示變成灰色的，以配合淺色系的背景色，如下圖↓

第一種方法：透過styles.xml，<item name="android:windowLightStatusBar">true</item>

	<resources>
	<!-- Base application theme. -->
	<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
	<!-- Customize your theme here. -->
	<item name="colorPrimary">@color/colorPrimary</item>
	<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
	<item name="colorAccent">@color/colorAccent</item>
	<!-- 使用LightStatusBarMode -->
	<item name="android:windowLightStatusBar">true</item>
	</style>
	</resources>

view raw styles.xml hosted with ❤ by GitHub

第二種方法：透過SYSTEM_UI_FLAG_LIGHT_STATUS_BAR，由程式端改變顏色

	@Override
	protected void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	setContentView(R.layout.activity_main);
	if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
	int flags = getWindow().getDecorView().getSystemUiVisibility();
	flags |= View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR;
	getWindow().getDecorView().setSystemUiVisibility(flags);
	}
	}

view raw onCreate.java hosted with ❤ by GitHub

這邊也寫一個非常簡單的小程式，透過按鈕Button隨即切換狀態欄的背景顏色以及文字、圖示顏色，深色背景搭配預設圖示顏色，淺色背景搭配灰色圖示顏色。

完成圖↓

MainActivity.java

	package com.example.solinari.statusbarlightmode;
	import android.os.Build;
	import android.support.v7.app.AppCompatActivity;
	import android.os.Bundle;
	import android.view.View;
	import android.widget.Button;
	import android.widget.Toast;
	public class MainActivity extends AppCompatActivity {
	@Override
	protected void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	setContentView(R.layout.activity_main);
	Button btnChangeStatusBar = (Button) findViewById(R.id.btnChangeStatusBar);
	btnChangeStatusBar.setOnClickListener(new View.OnClickListener() {
	@Override
	public void onClick(View view) {
	if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
	int flags = getWindow().getDecorView().getSystemUiVisibility();
	if(flags != 8192){//8192為SYSTEM_UI_FLAG_LIGHT_STATUS_BAR的值
	flags |= View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR;//淺色背景搭配灰色文字、圖示
	getWindow().setStatusBarColor(getResources().getColor(R.color.lightStatus,null));
	}
	else{
	flags = 0;//深色背景搭配預設(白色)文字、圖示
	getWindow().setStatusBarColor(getResources().getColor(R.color.colorPrimaryDark,null));
	}
	getWindow().getDecorView().setSystemUiVisibility(flags);
	}
	else{//版本低於Android 6.0時，出現提示訊息
	Toast.makeText(MainActivity.this,"This version is not supported !",Toast.LENGTH_LONG).show();
	}
	}
	});
	}
	}

view raw MainActivity.java hosted with ❤ by GitHub

參考資料：Change status bar text color when primaryDark is white
                    Android 6.0狀態欄使用灰色文字與圖示
                    Android M Light and Dark status bar programmatically
完整專案：Solinari GitHub