Toolbar基本使用及常見問題

1.導航傳回圖示不垂直居中問題，如下圖：

Toolbar基本使用及常見問題

出現這個問題，隻需要設定minHeight屬性值與layout_height屬性值一樣即可，在xml布局中或者代碼上設定均可，在代碼設定需要注意把dp轉成px，否則會達不到效果的

//xml布局檔案設定中：
<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:minHeight="46dp"
        android:background="@color/colorPrimary"
        app:navigationIcon="@drawable/ic_arrow_back_white_24dp">
 </android.support.v7.widget.Toolbar>

//代碼上設定
 toolbar.setMinimumHeight(toPx(this, 46));
 public static int toPx(Context context, float dpValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        int pxValue = (int) (dpValue * scale + 0.5f);
        return pxValue;
    }

2.Toolbar自定義标題欄不居中問題：

Toolbar基本使用及常見問題

未優化前的xml布局如下：

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:minHeight="46dp"
        android:background="@color/colorPrimary">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:orientation="horizontal">

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:textColor="#feffff"
                android:textSize="16sp"
                android:gravity="center_vertical|left"
                android:text="左邊"
                tools:ignore="HardcodedText"/>

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:textColor="#feffff"
                android:textSize="16sp"
                android:gravity="center"
                android:text="标題"
                tools:ignore="HardcodedText"/>


            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:textColor="#feffff"
                android:textSize="16sp"
                android:gravity="center_vertical|right"
                android:text="右邊"
                tools:ignore="HardcodedText"/>

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

從xml布局中左邊、标題、右邊這個三個控件都是等比布局，然而實際卻沒有達到我們想要的左右水準居中的效果，其實中間的标題也沒有居中；其實是左邊有一個預設的内容邊距所導緻的，我們可以代碼可以檢視具體值：

int contentInsetStart = toolbar.getContentInsetStart();
int contentInsetEnd = toolbar.getContentInsetEnd();
 Log.i(TAG,"left:"+contentInsetStart+"\n"+"right:"+contentInsetEnd);

//log日志：
ToolbarActivity1: left:32
                  right:0

知道了問題所在，我們就可以通過消除預設的左邊距來達到水準居中的效果，或者設定一個右邊距與左邊距相同的值

方法一：設定屬性值 app:contentInsetStart=“0dp” 即可，不能用app:contentInsetLeft=“0dp”，否則會達不到效果的

//xml布局：
<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:minHeight="46dp"
        app:contentInsetStart="0dp"
        android:background="@color/colorPrimary">
        
//或者代碼上：
toolbar.setContentInsetsRelative(0,0);

方法二：左右邊設定同樣的值

int contentInsetStart = toolbar.getContentInsetStart();
 int contentInsetEnd = toolbar.getContentInsetEnd();
  Log.i(TAG,"left:"+contentInsetStart+"\n"+"right:"+contentInsetEnd);
 toolbar.setContentInsetsRelative(contentInsetStart,contentInsetStart);

當有導航傳回圖示和中間标題時，此時設定 app:contentInsetStart=“0dp”，想讓标題居中是達不到效果的，如圖：

Toolbar基本使用及常見問題

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:minHeight="46dp"
        app:contentInsetStart="0dp"
        app:navigationIcon="@drawable/ic_arrow_back_white_24dp"
        android:background="@color/colorPrimary">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:orientation="horizontal">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#feffff"
                android:textSize="16sp"
                android:gravity="center"
                android:text="标題"
                tools:ignore="HardcodedText"/>
        </LinearLayout>
    </android.support.v7.widget.Toolbar>

出現這種情況，其他導航傳回圖示也有一個預設寬度的，同樣我們也可以通過代碼可知：

int contentInsetStartWithNavigation = toolbar.getContentInsetStartWithNavigation();
Log.i(TAG,"nav:"+contentInsetStartWithNavigation);

//log日志：
05-10 00:16:21.606 4578-4578/com.pos.templatefaq I/ToolbarActivity1: nav:144

解決方案：其實和上面的方案二基本一樣的思路

int contentInsetStartWithNavigation = toolbar.getContentInsetStartWithNavigation();
        Log.i(TAG,"nav:"+contentInsetStartWithNavigation);
        toolbar.setContentInsetsRelative(contentInsetStartWithNavigation,contentInsetStartWithNavigation);


// 或者在xml布局設定左右邊相同的邊距也可

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="46dp"
        android:minHeight="46dp"
        app:navigationIcon="@drawable/ic_arrow_back_white_24dp"
        //注意點
        app:contentInsetStartWithNavigation="50dp"
        android:background="@color/colorPrimary">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
             //注意點
            android:layout_marginEnd="50dp"
            android:gravity="center"
            android:orientation="horizontal">
            
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#feffff"
                android:textSize="16sp"
                android:gravity="center"
                android:text="标題"
                tools:ignore="HardcodedText"/>
            
        </LinearLayout>
    </android.support.v7.widget.Toolbar>

效果如下：

Toolbar基本使用及常見問題

同樣的思路可以自定義很多想要的效果：

Toolbar基本使用及常見問題

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/toolbar_height"
        android:minHeight="@dimen/toolbar_height"
        android:background="@color/colorWhite"
        android:elevation="1dp"
        android:gravity="center_vertical"
        app:navigationIcon="@drawable/ic_nav_back"
        app:contentInsetStartWithNavigation="50dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/AppTheme.NoActionBar.PopupOverlay"
        app:titleTextAppearance="@style/Toolbar_TextAppearance_White">


        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">


            <EditText
                android:id="@+id/et_search"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="50dp"
                android:background="@drawable/search_product_list_bg"
                android:drawableStart="@drawable/icon_search"
                android:drawablePadding="4dp"
                android:textSize="@dimen/text_size_14"
                android:hint="@string/search_product_tips"
                android:textColorHint="@color/colorTxtGray"
                android:textColor="@color/colorBlack"
                android:paddingBottom="4dp"
                android:paddingLeft="10dp"
                android:paddingRight="10dp"
                android:paddingTop="4dp" />


            <ImageButton
                android:id="@+id/search"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_gravity="right|center_vertical"
                android:background="@null"
                android:paddingRight="15dp"
                android:paddingLeft="15dp"
                android:src="@drawable/search_icon_selecter2"
                tools:ignore="RtlHardcoded" />


        </FrameLayout>

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

Toolbar基本使用及常見問題

繼續閱讀

Android時間軸(Timeline)效果的實作

Android之Application的使用

Android中使用SVG

封裝一個簡單的崩潰監聽類封裝一個簡單的崩潰監聽類

eclipse項目遷移到android studio(圖文版)注意看第二張圖，Android Studio導入的一定是Build.gradle。好多人沒說清這點。

打開多個Activity後傳回到原始界面資料

android的四種activity加載模式（launchMode）

Android四大元件之一：Activity總結（上）

對于Android的Activity啟動模式的一些總結和了解安卓Activity的啟動模式

Android查缺補漏之Toolbar

Activity任務棧和啟動模式

Android app 第三方支付寶支付接入

android 使用shape自定義圓角矩形

基礎篇(十六) Service和子線程

Android調用gallery擷取圖檔從gallery中擷取圖檔

挑戰練習---禁止一題多答（3.7）（Android程式設計權威指南）