[Android]ToolBar使用詳解(一)——項目配置

    Google在2015的IO大會上發佈了系列的Material Design風格的控件。

    其中ToolBar是替代ActionBar的控件。

    由於ActionBar在各個安卓版本和定製Rom中的效果表現不一,導致嚴重的碎片化問題

    ToolBar應運而生。


效果圖

    顯示效果跟ActionBar並沒有區別。

    優點:自定義視圖的操作更加簡單,狀態欄的顏色可以調(Android 4.4以上)。

    接下來講述在Android Studio中配置Toolbar的幾個步驟。


配置Gradle

    compile 'com.android.support:appcompat-v7:22.0.0'

在AndroidManifest.xml設置Activity的主題

android:theme="@style/AppTheme"

重定義主題

  • Android 4.4及以上
在values文件夾中新建values-v19.xml,內容如下
<resources>

    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>
        <!--Toolbar顏色-->
        <item name="colorPrimary">@android:color/holo_blue_bright</item>
        <!-- 狀態欄顏色 -->
        <item name="colorPrimaryDark">@android:color/holo_blue_bright</item>
        <item name="android:windowTranslucentNavigation">true</item>
        <item name="android:windowTranslucentStatus">true</item>
    </style>


</resources>

  • Android 4.4以下
<resources>

    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>
        <!--Toolbar顏色-->
        <item name="colorPrimary">@color/Indigo_colorPrimary</item>
    </style>


</resources>

在values文件夾中新建colors.xml文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="Indigo_colorPrimaryDark">#303f9f</color>
    <color name="Indigo_colorPrimary">#3f51b5</color>
    <color name="Indigo_nav_color">#4675FF</color>
</resources>

注意

  • 均取消ActionBar,都繼承了NoActionBar主題;
  • Android 4.4及以上版本可對狀態欄顏色進行改變,需要在代碼中進行設置。

創建toolbar的佈局文件widget_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:background="?attr/colorPrimary"
    android:minHeight="?android:attr/actionBarSize">

</android.support.v7.widget.Toolbar>

說明

設置toolbar的背景顏色
  • android:background="?attr/colorPrimary"
設置toolbar的最小高度
  • android:minHeight="?android:attr/actionBarSize"

在Activity中進行引用

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <include
        layout="@layout/widget_toolbar"
        android:id="@+id/toolbar" />

</RelativeLayout>

說明
防止ActionBar會和狀態欄混在一起
  • android:fitsSystemWindows="true"


代碼實現

 private Toolbar mToolbar;
    private WebFragment mWebFragment;

    private long mBeforeTime;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            SystemBarTintManager tintManager = new SystemBarTintManager(this);
            mToolbar = (Toolbar) findViewById(R.id.toolbar);
            tintManager.setStatusBarTintEnabled(true);
            setSupportActionBar(mToolbar);
            tintManager.setStatusBarTintResource(android.R.color.holo_blue_bright);
        }
        getSupportActionBar().setHomeButtonEnabled(true); //設置返回鍵可用
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    }
SystemBarTintManager可以在點擊打開鏈接下載,就一個簡單的Java文件。

關於更多ToolBar的使用請繼續關注。


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