web-dev-qa-db-ja.com

ナビゲーションドロワー(メニュードロワー)Android 5(Lollipop)スタイル

プロジェクトでmenudrawerライブラリを使用しています(これは https://github.com/SimonVT/Android-menudrawer )。

API21(Android 5 Lollipop)とマテリアルデザインに対応するようにアプリを更新しています。このライブラリをAPI21で使用すると、menudrawerアイコンが正しく表示されません。

新しいPlayストアで表示される移行を実現したい(矢印への新しいmenudrawerアイコンの移行)。

Play Store navigation drawer icon

それを行うための最良の方法は何ですか?このライブラリで可能ですか?現在私が考えている唯一の解決策は、カスタムドローアブルです。しかし、おそらく私は何らかの方法でネイティブのドローアブルを使用できますか?

13
adek

OK。私は新しいAPIで数時間過ごしましたが、私にとって最善の方法は、ドロワーをlibからネイティブのDrawerLayoutに書き直すことです。

しかし、おそらくこれは同様の問題を持つ誰かにとって有用でしょう。 DrawerLayoutを使用してテストプロジェクトを作成しました(Android Studio-> menudrawerを使用した新しいプロジェクト)。

そして、私は同じ問題を見ました。間違ったアイコン。ファンシーなアニメーションとAndroid 5.0の良いアイコンを表示したい場合は、以下を使用していることを確認してください。

import Android.support.**v7**.app.ActionBarDrawerToggle;

V7に注意してください。デフォルトでは、Fragmentクラスにはv4インポートがあり、適切なアイコンは表示されません。

別物。 v7に変更した後、ActionBarDrawerToggle関数を新しいコンストラクターに修正する必要があります。以上です。新しい引き出しアイコンが表示されます。

41
adek

まず、最新のSDKに更新してください。 Android Studioで新しいプロジェクトを作成し、次に、gradle依存関係としてbuid.gradleにappcompat-v7.21.0。+およびappcompat-v4.21.0。+ライブラリを追加します。

compile 'com.Android.support:appcompat-v7:21.0.2'
compile 'com.Android.support:support-v4:21.0.2'

Color.xmlファイルにprimaryColorとprimarycolorDarkを追加します。

<resources>
<color name="primaryColor">#2196F3</color>
<color name="primaryColorDark">#0D47A1</color>
</resources>

Strings.xmlファイルに引き出しの開閉文字列値を追加します。

<resources>
<string name="app_name">Lollipop Drawer</string>
<string name="action_settings">Settings</string>
<string name="drawer_open">open</string>
<string name="drawer_close">close</string>
</resources>

Activity_my.xmlレイアウトファイルは次のようになります。

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:orientation="vertical"
Android:layout_height="match_parent"
tools:context=".MainActivity">

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


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

    <!-- activity view -->
    <RelativeLayout
        Android:layout_width="match_parent"
        Android:background="#fff"
        Android:layout_height="match_parent">

        <TextView
            Android:layout_centerInParent="true"
            Android:layout_width="wrap_content"
            Android:textColor="#000"
            Android:text="Activity Content"
            Android:layout_height="wrap_content" />
    </RelativeLayout>

    <!-- navigation drawer -->
    <RelativeLayout
        Android:layout_gravity="left|start"
        Android:layout_width="match_parent"
        Android:background="#fff"
        Android:layout_height="match_parent">

        <ListView
            Android:id="@+id/left_drawer"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:divider="#eee"
            Android:background="#fff"
            Android:dividerHeight="1dp" />
    </RelativeLayout>

</Android.support.v4.widget.DrawerLayout>

</LinearLayout>

Toolbar.xmlレイアウトファイルは次のようになります。

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v7.widget.Toolbar xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:id="@+id/toolbar"
Android:minHeight="?attr/actionBarSize"
Android:background="?attr/colorPrimary"
Android:layout_width="match_parent"
Android:layout_height="wrap_content">

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

MyActivity.Javaは次のようになります。ここで、アクティビティはActionBarActivityを拡張し、ツールバーをサポートアクションバーとして設定する必要があります。

import Android.content.res.Configuration;
import Android.support.v4.widget.DrawerLayout;
import Android.support.v7.app.ActionBarActivity;
import Android.os.Bundle;
import Android.support.v7.app.ActionBarDrawerToggle;
import Android.support.v7.widget.Toolbar;
import Android.view.Menu;
import Android.view.MenuItem;
import Android.view.View;
import Android.widget.ArrayAdapter;
import Android.widget.ListView;

public class MyActivity extends ActionBarActivity {

private Toolbar toolbar;
private DrawerLayout drawerLayout;
private ActionBarDrawerToggle drawerToggle;
private ListView leftDrawerList;
private ArrayAdapter<String> navigationDrawerAdapter;
private String[] leftSliderData = {"Home", "Android", "Sitemap", "About", "Contact Me"};

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_my);
    nitView();
    if (toolbar != null) {
        toolbar.setTitle("Navigation Drawer");
        setSupportActionBar(toolbar);
    }
    initDrawer();
}

private void nitView() {
    leftDrawerList = (ListView) findViewById(R.id.left_drawer);
    toolbar = (Toolbar) findViewById(R.id.toolbar);
    drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
    navigationDrawerAdapter=new ArrayAdapter<String>( MyActivity.this, Android.R.layout.simple_list_item_1, leftSliderData);
    leftDrawerList.setAdapter(navigationDrawerAdapter);
}

private void initDrawer() {

    drawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close) {

        @Override
        public void onDrawerClosed(View drawerView) {
            super.onDrawerClosed(drawerView);

        }

        @Override
        public void onDrawerOpened(View drawerView) {
            super.onDrawerOpened(drawerView);

        }
    };
    drawerLayout.setDrawerListener(drawerToggle);
}

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

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

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.my, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    int id = item.getItemId();
    if (id == R.id.action_settings) {
        return true;
    }
    if (drawerToggle.onOptionsItemSelected(item)) {
        return true;
    }
    return super.onOptionsItemSelected(item);
}
}

Android Lollipopの値21フォルダーにstyle.xmlファイルを作成します

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

<style name="myAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/primaryColor</item>
    <item name="colorPrimaryDark">@color/primaryColorDark</item>
    <item name="Android:statusBarColor">@color/primaryColorDark</item>

    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="spinBars">true</item>
    <item name="color">@Android:color/black</item>
</style>

</resources>

古いバージョンの値フォルダにstyle.xmlファイルを作成してから、Android Lollipop

<resources>

<style name="myAppTheme" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/primaryColor</item>
    <item name="colorPrimaryDark">@color/primaryColorDark</item>
    <item name="Android:windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="spinBars">true</item>
    <item name="color">@Android:color/black</item>
</style>

</resources>

AndroidManifest.xmlは次のようになります。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:Android="http://schemas.Android.com/apk/res/Android"
package="nkdroid.com.lollipopdrawer" >

<application
    Android:allowBackup="true"
    Android:icon="@drawable/ic_launcher"
    Android:label="@string/app_name"
    Android:theme="@style/myAppTheme" >
    <activity
        Android:name=".MyActivity"
        Android:label="@string/app_name" >
        <intent-filter>
            <action Android:name="Android.intent.action.MAIN" />

            <category Android:name="Android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

</manifest>

参照のみ:ここから完全なソースコードをダウンロードできますここをクリック

19
nirav kalola

Androidチームによって2015年5月にリリースされた新しいLollipopコンポーネントを確認してください。

設計サポートライブラリ

設計サポートライブラリのブログ

1
Pioneer