web-dev-qa-db-ja.com

アクションバーのアプリアイコンの横に「メニュー」インジケータを追加する方法

少なくともGmailとYoutube Androidアプリは、スワイプまたはアプリアイコン（ホームボタン）をクリックして開くサイドメニュー（ ナビゲーションドロワー ？）を使用します。

enter image description here

上記のスクリーンショットのメニューインジケータ/アイコンは、既製のAndroid SDK？（またはGoogleがアプリで使用するカスタムアイコン？））いずれの場合でも、ホームボタンをそのように見えるようにする最も簡単な方法は何ですか、つまり、メニューを開くようなものですか？

（targetSdkVersion 18; minSdkVersion 14）

解決

最後に 動作しました 。私にとって欠けていたのは、1） 実際のアイコン および2）ActionBarDrawerToggleでのsyncState()の遅延呼び出しでした。

androidandroid-actionbarnavigation-drawerandroid-iconsandroid-homebutton
24
Jonik

同様の実装を作成する/アプリケーションを調べるには、ActionBarDrawerToggleを使用し、カスタムアイコンをActionBarホームボタンの横のインジケーターとして設定する必要があります。例えば ​​：

import Android.app.ActionBar;
import Android.support.v4.app.ActionBarDrawerToggle;
import Android.support.v4.widget.DrawerLayout;

private void setUpDrawerToggle(){
    ActionBar actionBar = getActionBar();
    actionBar.setDisplayHomeAsUpEnabled(true);
    actionBar.setHomeButtonEnabled(true);

    // ActionBarDrawerToggle ties together the the proper interactions
    // between the navigation drawer and the action bar app icon.
    mDrawerToggle = new ActionBarDrawerToggle(
            this,                             /* Host Activity */
            mDrawerLayout,                    /* DrawerLayout object */
            R.drawable.ic_drawer,             /* nav drawer image to replace 'Up' caret */
            R.string.navigation_drawer_open,  /* "open drawer" description for accessibility */
            R.string.navigation_drawer_close  /* "close drawer" description for accessibility */
    ) {
        @Override
        public void onDrawerClosed(View drawerView) {
            invalidateOptionsMenu(); // calls onPrepareOptionsMenu()
        }

        @Override
        public void onDrawerOpened(View drawerView) {
            invalidateOptionsMenu(); // calls onPrepareOptionsMenu()
        }
    };

    // Defer code dependent on restoration of previous instance state.
    // NB: required for the drawer indicator to show up!
    mDrawerLayout.post(new Runnable() {
        @Override
        public void run() {
            mDrawerToggle.syncState();
        }
    });

    mDrawerLayout.setDrawerListener(mDrawerToggle);
}

どこ R.drawable.ic_drawerは、実際にはインジケータとして使用するアイコンです。 Android Asset Studio ;にあります。 Navigation Drawer Indicator を参照してください。

参照資料

  1. ActionBarDrawerToggle
  2. ナビゲーションドロワーの作成
33
hardartcore

Android-Developer および HpTerm は、正しい修正を助けてくれました。

  1. これを指摘することは確かに NavigationDrawer specific（Googleの例のように既に使用していた）
  2. _ic_drawer.png_アイコンの場所の指定（→ Android Asset Studio ）

さて、残念なことに、以下のようなActionBarDrawerToggleを作成することはnotで十分だと思われます。少なくとも私のNexus 7（API 18）テストデバイスでは。

_drawerToggle = new ActionBarDrawerToggle(this, 
                       drawerLayout, 
                       R.drawable.ic_navigation_drawer, 
                       R.string.side_menu_open, 
                       R.string.side_menu_closed) {
    // ...
};
_

部分的なソリューション（APIレベル18+）

インジケーターを表示する方法の1つを見つけました：setHomeAsUpIndicator()欠点：そのメソッドはAPIレベル18で追加されました。

_@Override
protected void onCreate(Bundle savedInstanceState) {
    // ...
    getActionBar().setDisplayHomeAsUpEnabled(true); // also required
    if (Build.VERSION.SDK_INT >= 18) {
        getActionBar().setHomeAsUpIndicator(
            getResources().getDrawable(R.drawable.ic_navigation_drawer));
    }
}
_

だから今疑問が残ります：APIレベル14から17で（この場合）この仕事をする方法？

4.1.2（API 16）デバイスで、_ic_drawer_アイコンがnot表示されることを確認しました。 setDisplayHomeAsUpEnabled(true)を使用すると、通常の「ホーム」アイコン（左向きの小さな矢印）が表示され、それがないと、アプリアイコンの残りのスペースが空白のままになります。

最終的解決

Android-Developer's answer の編集バージョンを使用して動作するようになりました。

非常に奇妙なことに、ActionBarDrawerToggle初期化コードに欠けていたものはこれでした：

_   // Defer code dependent on restoration of previous instance state.
   drawerLayout.post(new Runnable() {
        @Override
        public void run() {
            mDrawerToggle.syncState();
        }
    });
_

含まれている場合、setHomeAsUpIndicator()の呼び出しはnotが必要です。

10
Jonik

ここのキーワードは NavigationDrawer ;です。 Android開発者サイトに完全に動作するコード例があります。

指定されたリンクの終わりを読む：アプリアイコンで開く/閉じる

次のコードがそこからコピーされます

public class MainActivity extends Activity {
    private DrawerLayout mDrawerLayout;
    private ActionBarDrawerToggle mDrawerToggle;
    ...

    public void onCreate(Bundle savedInstanceState) {
        ...

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerToggle = new ActionBarDrawerToggle(
                this,                  /* Host Activity */
                mDrawerLayout,         /* DrawerLayout object */
                R.drawable.ic_drawer,  /* nav drawer icon to replace 'Up' caret */
                R.string.drawer_open,  /* "open drawer" description */
                R.string.drawer_close  /* "close drawer" description */
                ) {

            /** Called when a drawer has settled in a completely closed state. */
            public void onDrawerClosed(View view) {
                getActionBar().setTitle(mTitle);
            }

            /** Called when a drawer has settled in a completely open state. */
            public void onDrawerOpened(View drawerView) {
                getActionBar().setTitle(mDrawerTitle);
            }
        };

        // Set the drawer toggle as the DrawerListener
        mDrawerLayout.setDrawerListener(mDrawerToggle);

        getActionBar().setDisplayHomeAsUpEnabled(true);
        getActionBar().setHomeButtonEnabled(true);
    }

    @Override
    protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        // Sync the toggle state after onRestoreInstanceState has occurred.
        mDrawerToggle.syncState();
    }

    @Override
    public void onConfigurationChanged(Configuration newConfig) {
        super.onConfigurationChanged(newConfig);
        mDrawerToggle.onConfigurationChanged(newConfig);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Pass the event to ActionBarDrawerToggle, if it returns
        // true, then it has handled the app icon touch event
        if (mDrawerToggle.onOptionsItemSelected(item)) {
          return true;
        }
        // Handle your other action bar items...

        return super.onOptionsItemSelected(item);
    }

    ...
}

一部のファイルはダウンロードとして入手でき、アニメーション効果のある小さな3行が完全に例示されています。

それらのファイルを対応するdrawableフォルダーにコピーする必要があります。使用するテーマに応じて、暗いアイコンと明るいアイコンのセットが異なります。

私の場合、単にdrawer_shadow.9.pngおよびic_drawer.pngをドローアブルフォルダーに追加し、例に従ったところ、すべて正常に機能しました。

アイコンは私が提供したリンクで利用できますが、それらは[〜＃〜] not [〜＃〜]「アクションバーアイコンパック」、サンプルアプリにあります対応するres/drawableフォルダー。

2
HpTerm