Фоновые изображения кнопок растянуты (использование wrap_content или dp)

Я устанавливаю фоновые изображения на свои пользовательские кнопки. Я сделал скриншот для своего приложения и упомянул, что когда я использую «wrap_content» для ширины и высоты кнопки, кнопка растягивается. Когда я исправляю размер в dp, он будет казаться приятным (например: в моей папке mdpi у меня есть значки 48x48px, поэтому я устанавливаю 48dp по ширине и высоте). Не могли бы вы объяснить мне почему?

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/definition_layout" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:padding="5dp" android:layout_alignParentTop="true" > <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/buttons" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="5dp" > <Button android:id="@+id/addToFavorites" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="@drawable/favorites_button" /> <Button android:id="@+id/fontup" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="@drawable/fontup_button" /> <Button android:id="@+id/fontdown" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="@drawable/fontdown_button" /> <Button android:id="@+id/comment" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="@drawable/comment_button" /> <Button android:id="@+id/speak" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:background="@drawable/speak_button" /> </LinearLayout> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_below="@id/buttons"> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content"> <ImageView android:id="@+id/image_frame" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <WebView android:id="@+id/webView1" android:layout_below="@id/image_frame" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </ScrollView> </RelativeLayout> 

В приведенном выше коде показан мой XML-файл. Вы можете проверить эту ссылку, чтобы просмотреть снимок экрана для моей проблемы: https://www.dropbox.com/s/phnxt5p335ltqef/buttons_icon_altered.png

Solutions Collecting From Web of "Фоновые изображения кнопок растянуты (использование wrap_content или dp)"

Он выглядит растянутым, потому что «wrap_content» означает, что андроид будет растягивать изображение, чтобы он соответствовал охватывающему макету.

В вашем случае кнопки в линейном макете занимают столько места, сколько возможно в макете. Поэтому, если вы не установите высоту и ширину кнопок, они растянутся, чтобы заполнить пространство, занимаемое линейной компоновкой, и, следовательно, их фоновые изображения также растянутся вместе с кнопками.

Но если вы установите размер кнопки 48dp, тогда изображения не будут растягиваться, так как они также имеют размер 48 пикселей, и, следовательно, они будут выглядеть красиво.

Пройдите отличные официальные документы разработчиков для получения дополнительной информации о макетах здесь: https://developer.android.com/guide/topics/ui/declaring-layout.html

И для изучения того, как управлять вашими макетами и активами для нескольких размеров и разрешений экрана Android здесь:

https://developer.android.com/guide/practices/screens_support.html

Вы можете избежать растяжки фона кнопки, установив minWidth & minHeight на 0dp

 <Button android:id="@+id/addToFavorites" android:layout_width="wrap_content" android:layout_height="wrap_content" android:minWidth="0dp" android:minHeight="0dp" android:layout_margin="5dp" android:background="@drawable/favorites_button" /> 

Это довольно легко:

  • Используйте ImageButton вместо кнопки
  • Установите для атрибута фона значение null
  • Установить атрибут src
  • Установите для атрибута scaleType значение centerInside

Рабочий пример:

 <ImageButton android:id="@+id/my_awesome_button" android:scaleType="centerInside" android:background="@null" android:gravity="center" android:layout_height="wrap_content" android:layout_width="wrap_content" android:src="@drawable/my_awesome_drawable"/> 

Примечание. Вы также можете использовать значение dp вместо « wrap_content ».

Я надеюсь, что это помогает.