Android支持工具欄無法正確顯示自定義繪圖

Question

我正在嘗試將我的應用程序ActionBar更新到工具欄中但我在自定義工具欄時遇到了一些問題，以顯示自定義drawable。

我到目前為止嘗試的是將我的xml drawable設置到工具欄中但是它會破壞整個工具欄並將菜單按鈕移動到我無法正常看到的位置：

這是第一個可繪制的：

bg_actionbar.xml

<?xml version="1.0" encoding="utf-8"?>

<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/bg_gradient" />
    <item android:drawable="@drawable/icon_logo" />

</layer-list>

bg_gradient只是一個9patch圖像漸變，與icon_logo相同。

對於我的工具欄：

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/actionBar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@drawable/bg_actionbar"
        app:contentInsetEnd="0dp"
        app:contentInsetStart="0dp">


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

這個按下我的菜單按鈕，左邊的間距約為300dp，圖標高度縮小。

現在我只是嘗試將背景直接改為png圖像（bg_gradient），同樣的事情發生了。 我也嘗試在工具欄中添加一個ImageView，但同樣的事情就是破壞了整個ToolBar，我又一次失去了如何進一步自定義這個工具欄。 有人有想法嗎？ TIA。

更新：

我嘗試在工具欄上添加線性布局以包含背景但仍然無法正確顯示在我的結尾：

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/actionBar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/cherry_red"
        app:contentInsetEnd="0dp"
        app:contentInsetStart="0dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/bg_actionbar"/>

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

這是發生的事情：

此外，這是我的預期：

圖標應位於中心，9patch圖像為漸變，因為我在XML上遇到麻煩，在開始的中間和結束顏色上有一個百分比，而navigationIcon應該在漸變的頂部。

Answer 1

嘿，我認為這將有所幫助，因為我有一個類似的東西的應用程序

我的xml是這樣的：

    <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/custom_toolbar" android:layout_width="match_parent" android:layout_height="56dp" 
android:background="@drawable/actionbar_bg" >

            <RelativeLayout android:id="@+id/toolbar_logo"
            android:layout_width="140dp" android:layout_height="40dp"
            android:background="@drawable/ic_logo"
            android:layout_gravity="left|center_vertical"
            android:clickable="true">

        </RelativeLayout>

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

而drawable / actionbar_bg是這樣的：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient android:startColor="#FFFFFF"
                android:endColor="#4093A3"
                android:angle="90" />
        </shape>
    </item>
</layer-list>

希望這對你有所幫助。

Answer 2

使用以下示例xml進行布局

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <include layout="@layout/toolbar_home"
        android:id="@+id/tool_bar" />

</LinearLayout>

toolbar_home.xml

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <android.support.v7.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/actionbar_icon_bg"/>

    <ImageView android:layout_width="40dp"
        android:layout_height="40dp"
        android:src="@drawable/ic_launcher"
        android:layout_centerInParent="true"/>
</RelativeLayout>

在你的活動中，

    toolbar = (Toolbar) findViewById(R.id.tool_bar);
    setSupportActionBar(toolbar); //or setActionBar(toolbar)

獲取導航圖標和東西

    toolbar.setNavigationIcon(R.drawable.btn_main_nav_selector);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true); // or getActionBar().setDisplayHomeAsUpEnabled(true);

Answer 3

。采用

內心View上的Gravity

希望能幫助到你