web-dev-qa-db-ja.com

左側にカスタムボタンがあるツールバーを作成する方法

Android開発に慣れていないため、カスタムツールバーの作成に大きな問題があります。私の要件：

  1. 左側のカスタムボタン（アイコン+テキスト）
  2. カスタムボタンの後のディバイダー
  3. ボタンの高さはツールバーと同じでなければなりません（マージンなし）

ここに私の要件を説明するサンプル画像があります： enter image description here

私はactionBar.setCustomView(v);を使用しようとしましたが、それは私の問題を解決しませんでした：

  1. 右ボタンには上/下マージンがあります-ツールバーよりも小さいです
  2. 仕切りを追加できませんでした。
  3. （カスタムビューからの）左ボタンがツールバーの高さよりも小さい。

私の質問：

  1. 左側にカスタムボタンを追加するには、カスタムビューが本当に必要ですか？
  2. 左側に仕切りを追加する方法は？
  3. ボタンの高さをツールバーの高さと同じにする方法は？
androidandroid-toolbarandroid-appcompat
11
fedor.belov

Toolbarは基本的にFrameLayoutであるため、layout-tag内に自由に追加できます。あなたの場合、次のようなもので十分と思われます：

layout.xml

<Android.support.v7.widget.Toolbar
    Android:id="@+id/toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?actionBarSize"
    Android:background="?colorPrimary"
    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

    <LinearLayout
        Android:layout_width="wrap_content"
        Android:layout_height="?attr/actionBarSize"
        Android:divider="@drawable/divider"
        Android:dividerPadding="8dp"
        Android:orientation="horizontal"
        Android:showDividers="end">

        <TextView
            Android:id="@+id/toolbar_save"
            style="@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:background="?attr/selectableItemBackground"
            Android:drawableLeft="@drawable/ic_action_check"
            Android:drawablePadding="8dp"
            Android:gravity="center_vertical"
            Android:paddingLeft="16dp"
            Android:paddingRight="16dp"
            Android:text="Save"
            Android:textAllCaps="true" />

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

divider.xml

これを/res/drawableフォルダーに追加します。これは、上記のコードでLinearLayout分周器として使用されます。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle">

    <size Android:width="1dp" />

    <solid Android:color="@Android:color/white" />

</shape>

コード

private void setupToolbar() {
    Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(mToolbar);
    // Hide the title
    getSupportActionBar().setTitle(null);
    // Set onClickListener to customView
    TextView tvSave = (TextView) findViewById(R.id.toolbar_save);
    tvSave.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            // TODO
        }
    });
}

右側の項目に関して：デフォルトのonCreateOptionsMenuメソッドを使用し、対応するR.menu.*リソースをインフレートするだけです。

結果

result image

31
reVerse
 <Android.support.v7.widget.Toolbar
        Android:layout_width="match_parent"
        Android:layout_height="?actionBarSize"
        app:contentInsetLeft="0dp"
        app:contentInsetStart="0dp"
        app:contentInsetStartWithNavigation="0dp"
      />

ツールバーにはapp：contentInsetStartWithNavigation = "0dp"も必要です

0
jerboy