web-dev-qa-db-ja.com

Android 5.0 KitKat用のマテリアルデザインスタイルのナビゲーションドロワー

Androidが新しいナビゲーションドロワーアイコン、ドロワーアイコン、および戻る矢印アイコンを導入したことがわかります。 KitKatがサポートするアプリでどのように使用できますか。最新のナビゲーションドロワーアイコンとアニメーションを備えたGoogleのニューススタンドアプリの最新バージョンをご覧ください。どうすればそれを実装できますか?

MinSDKを19に、complileSDKを21に設定しようとしましたが、古いスタイルのアイコンを使用しています。それは自己実装されていますか?

61
nomongo

Appcompat v21の新しいツールバーと、このライブラリにある新しいActionBarDrawerToggleも使用する必要があります。

Gradle依存関係をgradleファイルに追加します。

compile 'com.Android.support:appcompat-v7:21.0.0'

activity_main.xmlレイアウトは次のようになります。

<!--I use Android:fitsSystemWindows because I am changing the color of the statusbar as well-->
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:id="@+id/main_parent_view"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="vertical"
    Android:fitsSystemWindows="true">

    <include layout="@layout/toolbar"/>

    <Android.support.v4.widget.DrawerLayout
        Android:id="@+id/drawer_layout"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent">

        <!-- Main layout -->
        <FrameLayout
            Android:id="@+id/main_fragment_container"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent" />

        <!-- Nav drawer -->
        <fragment
            Android:id="@+id/fragment_drawer"
            Android:name="com.example.packagename.DrawerFragment"
            Android:layout_width="@dimen/drawer_width"
            Android:layout_height="match_parent"
            Android:layout_gravity="left|start" />
    </Android.support.v4.widget.DrawerLayout>
</LinearLayout>

ツールバーのレイアウトは次のようになります。

<?xml version="1.0" encoding="utf-8"?>
<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/toolbar"
    app:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:minHeight="?attr/actionBarSize"
    Android:background="?attr/colorPrimary"/>

あなたのアクティビティは以下から拡張する必要があります

ActionBarActivity

アクティビティでビュー(ドロワーとツールバー)を見つけたら、ツールバーをサポートアクションバーとして設定し、setDrawerListenerを設定します。

setSupportActionBar(mToolbar);
mDrawerToggle= new ActionBarDrawerToggle(this, mDrawerLayout,mToolbar, R.string.app_name, R.string.app_name);
mDrawerLayout.setDrawerListener(mDrawerToggle);

その後、メニュー項目とdrawerToogleの状態に注意するだけです:

 @Override
public boolean onCreateOptionsMenu(Menu menu) {
    MenuInflater inflater = new MenuInflater(this);
    inflater.inflate(R.menu.menu_main,menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if (mDrawerToggle.onOptionsItemSelected(item)) {
        return true;
    }
    return super.onOptionsItemSelected(item);
}

@Override
protected void onPostCreate(Bundle savedInstanceState) {
    super.onPostCreate(savedInstanceState);
    mDrawerToggle.syncState();
}

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

@Override
public void onBackPressed() {
    if(mDrawerLayout.isDrawerOpen(Gravity.START|Gravity.LEFT)){
        mDrawerLayout.closeDrawers();
        return;
    }
    super.onBackPressed();
}

実装はツールバーの前と同じであり、矢印アニメーションを無料で受け取ります。頭痛はありません。詳細については、次を参照してください。

ツールバーとステータスバーの下に引き出しを表示する場合は、 この質問 を参照してください。

EDIT:サポートデザインライブラリのNavigationViewを使用します。ここでの使用方法を学ぶためのチュートリアル: http://antonioleiva.com/navigation-view/

130
jpardogo

答えはもはや役に立ちません。 Androidを投稿した時点では実装されていなかったため、歴史的な目的のためにここに残しておきます:)


これを達成できるライブラリがたくさんあります。

選択1- https://github.com/neokree/MaterialNavigationDrawer

その他

18
appbootup

マテリアルデザインスタイルの実際のナビゲーションドロワーが必要な場合(定義済み ここ
まさにそれを行うカスタムライブラリを実装しました。
見つけることができます こちら

2
NeoKree

新しく生成されたmain_contentのレイアウトとともにトップコメントをサポートします。含まれているコンテンツレイアウトをDrawerLayoutでオーバーライドするだけです。引き出しレイアウトには、このlayout_behaviorが必要であることに注意してください:appbar_scrolling_view_behavior

最上位のコンテナのレイアウト https://github.com/juanmendez/jm_Android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/activity_recycler.xml#L17

含まれるコンテンツレイアウト https://github.com/juanmendez/jm_Android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/content_recycler.xml#L9

see the navigation drawer!!

0
Juan Mendez