web-dev-qa-db-ja.com

ナビゲーションドロワーアイコンのサイズは?

Navigation Drawerアイコンの正しいサイズ(アートボードとコンテンツ)を知る必要があります。

Navigation Drawerの仕様には何も記載されていません: http://www.google.com.br/design/spec/patterns/navigation-drawer.html#navigation-drawer-specs

ありがとう!

16
thiagolr

私はバラールの答えに賛成票を投じるだろうが、それは一つの小さな詳細で外れている。正解は、すべての小さなアイコンは24 x 24dpである必要があるということです。

リファレンス: https://material.io/guidelines/layout/metrics-keylines.html#metrics-keylines-touch-target-size

20
MusicMaster

For:

mdpi : 24 x 24 px
hdpi : 36 x 36 px
xhdpi : 48 x 48 px
xxhdpi : 72 x 72 px
xxxhdpi : 96 x 96 px

その比率によると:

mdpi : hdpi : xhdpi : xxhdpi : xxxhdpi= 1 : 1.5 : 2 : 3 : 4

更新:

これで、Googleが公開したマテリアルアイコンデザインとdetails.iconsは、アイコンを囲む2dpのトリムエリアで20dpに縮小できます。

enter image description here

詳細については、 Material Design サイトをご覧ください。

20
Sayem

サポートデザインライブラリによって提供される NavigationView の公式実装を確認できます。

NavigationMenuItemViewのコードが表示される場合、以下を定義します。

this.mIconSize = 
 context.getResources().getDimensionPixelSize(dimen.navigation_icon_size);

どこ:

<dimen name="navigation_icon_size">24dp</dimen
8

通常、これらのナビゲーションアイコンのサイズは24 x 24ピクセルです

1

ビューコンポーネントのサイズを設定するためにアイコンサイズのみが必要な場合は、Toolbar.Button.Navigationスタイルを使用できます。偽のナビゲーションアイコンビューを作成する例を次に示します。

    <Android.support.design.widget.CoordinatorLayout
        Android:id="@+id/vCoordinatorLayout"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent">

        <!--CONTENT VIEW-->
        <LinearLayout
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:orientation="vertical">

        </LinearLayout>

        <!--FAKE TOOLBAR NAVIGATION ICON-->
        <RelativeLayout
            Android:layout_width="?attr/actionBarSize"
            Android:layout_height="?attr/actionBarSize">
            <ImageView
                Android:id="@+id/vToolbarNavigationIcon"
                style="@style/Widget.AppCompat.Toolbar.Button.Navigation"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_centerInParent="true"
                Android:src="@drawable/my_icon"/>
        </RelativeLayout>

    </Android.support.design.widget.CoordinatorLayout>
1
Justin Fiedler