web-dev-qa-db-ja.com

Android下部ナビゲーションレイアウトでアイコンのサイズを増やす方法は？

私は最近、Googleがデザインライブラリ25で導入したAndroidの下部レイアウトナビゲーションスタイルを使用しています。私がドロウアブルフォルダーに保存している画像は72x72であるにもかかわらず、私のものは非常に小さいです。

enter image description here

アイコンは、少なくとも2倍、おそらく3倍のサイズにする必要があります。どうすればいいですか？ bottom_layout.xmlのコードは次のとおりです。

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

 <menu xmlns:Android="http://schemas.Android.com/apk/res/Android"

   xmlns:app="http://schemas.Android.com/apk/res-auto">
  <item
    Android:id="@+id/menu_home"
    Android:title="test"
    Android:icon="@drawable/tabbarglossary"
    app:showAsAction="always|withText"
    />
  <item
    Android:id="@+id/menu_search"
    Android:title="test2"
    Android:icon="@drawable/mediationtabbar"
    app:showAsAction="always|withText"
    />

  <item
    Android:id="@+id/menu_notifications"
    Android:title="test3"
    Android:icon="@drawable/ic_action_name"
    app:showAsAction="always|withText"
    />

</menu>

そして、私のactivity_main.xmlで：

 <Android.support.design.widget.BottomNavigationView
    Android:id="@+id/navigation"
    Android:layout_width="match_parent"
    Android:layout_height="80dp"
    Android:layout_alignParentBottom="true"
    Android:layout_gravity="bottom"
    Android:layout_marginBottom="0dp"
    Android:layout_marginLeft="0dp"
    Android:layout_marginRight="0dp"
    Android:focusable="false"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    design:menu="@menu/bottom_layout" />

ありがとう

androidbottomnavigationview
14
joey

アイコンのサイズは、アイテムレイアウトで24dpにハードコーディングされています（ design_bottom_navigation_item.xml を参照）。これはプログラムで変更できます。

BottomNavigationView bottomNavigationView = (BottomNavigationView) activity.findViewById(R.id.bottom_navigation_view);
BottomNavigationMenuView menuView = (BottomNavigationMenuView) bottomNavigationView.getChildAt(0);
for (int i = 0; i < menuView.getChildCount(); i++) {
    final View iconView = menuView.getChildAt(i).findViewById(Android.support.design.R.id.icon);
    final ViewGroup.LayoutParams layoutParams = iconView.getLayoutParams();
    final DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
    // set your height here
    layoutParams.height = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32, displayMetrics);
    // set your width here
    layoutParams.width = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 32, displayMetrics);
    iconView.setLayoutParams(layoutParams);
}

[〜＃〜] edit [〜＃〜]

アイコンがテキストを覆っているという問題について：

下部のナビゲーションビューの一部のデフォルトディメンションをオーバーライドできます。たとえば、高さ。

<dimen name="design_bottom_navigation_height" tools:override="true">56dp</dimen>

デフォルトの仕様については、 guidelines bottom navigation を確認してください。

29
beeb

app:itemIconSizeプロパティに希望の値を設定します。

14
Jonatan

Android Asset Studio から 汎用アイコンの生成 を使用してみてください：

  • アイコンのサイズは24dpです
  • 0dpのパディングがあります

注：必要に応じてカスタムアイコンを使用できます。

icon generator

次に、適切なディレクトリ（mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi）を使用して、対応するドロアブルを生成します。

ケースに72x72などの静的な描画可能な寸法があると、電話機の密度に応じてアイコンのサイズが変わる場合があり、電話機ごとにピクセルの変換方法が異なります。

Zipファイル内のアイコンをダウンロードして、描画可能なフォルダーをリソースディレクトリに展開するだけで、問題が解決するはずです。

6
Bradley Wilson

ここに：

BottomNavigationView bottomNavigationView = (BottomNavigationView) 
configurationActivity.findViewById(R.id.bottom_navigation_view);
BottomNavigationMenuView menuView = (BottomNavigationMenuView) 
bottomNavigationView.getChildAt(0);
for (int i = 0; i < menuView.getChildCount(); i++) {
     final View iconView = 
menuView.getChildAt(i).findViewById(Android.support.design.R.id.icon);
     final ViewGroup.LayoutParams layoutParams = 
iconView.getLayoutParams();
     final DisplayMetrics displayMetrics = 
getResources().getDisplayMetrics();
layoutParams.height = (int) 
TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, 
displayMetrics);
layoutParams.width = (int) 
TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, 
 displayMetrics);
iconView.setLayoutParams(layoutParams);
}

必要に応じて画像のサイズを調整できます。ハッピーコーディング

3
Minkoo

下のナビゲーションに次の2行を追加します。

app:menu="@menu/main_bottom_navigation"
app:itemIconSize="@dimen/bottom_navigation_icon_size"

dimens.xmlに追加：

<dimen name="bottom_navigation_icon_size" tools:override="true">32dp</dimen>
<dimen name="design_bottom_navigation_height" tools:override="true">72dp</dimen>

アイコンのサイズを増やすには、bottom_navigation_icon_sizeを増やします。 design_bottom_navigation_heightの値を変更して、テキストが重ならないようにしたり、余白を増やしたりする必要がある場合があります。

1
Dan Bray

dimens.xmlのオーバーライド：

<dimen name="design_bottom_navigation_icon_size" tools:override="true">'your size in dp'</dimen>
1
Evgeniy Pavlov