ImageButton: значок квадрата силы (высота = WRAP_CONTENT, ширина =?)

Question

В моем горизонтальном LinearLayout у меня есть TextEdit и ImageButton.ImageButton так же высоко, как TextEdit.

Я бы хотел, чтобы ImageButton был точно такой же ширины, как и его длина.

В данный момент выглядит как ширина кнопки ImageButton, когда нет масштабирования (ширина ImageButton [px] = немасштабируемая ширина рисования [px]):

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <EditText
        android:id="@+id/txtName"
        android:layout_width="1dp"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <ImageButton
        android:id="@+id/btSet"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:scaleType="fitEnd"
        android:src="@drawable/pin2" />

</LinearLayout>

Как это должно выглядеть:

Answer 1

Попробуйте, я думаю, это должно работать:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:orientation="horizontal" >

    <ImageButton
        android:id="@+id/btSet"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:scaleType="centerInside"
        android:adjustViewBounds="true"
        android:src="@drawable/pin2" />

    <EditText
        android:id="@+id/txtName"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_toLeftOf="@id/btSet" />

</RelativeLayout>

Объяснение: centerInside обеспечит пропорциональное масштабирование изображения в пределах ImageButton. adjustViewBounds="true" будет ... хорошо, отрегулировать границы вида, если изображение необходимо масштабировать.

Answer 2

попробуйте добавить

AdjustViewBounds = "true"

в ImageButton, который должен обрезать лишнюю ширину

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <EditText
        android:id="@+id/txtName"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <ImageButton
        android:id="@+id/btSet"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:src="@drawable/pin" />
</LinearLayout>

Answer 3

Используйте

android:scaleType="fitCenter"

или android:scaleType="centerInside"

в ImageButton в XML-файле.

Answer 4

У меня была такая же проблема. Я пытался создать что-то похожее на это:

Но то, что я получал, было так:

ImageButton растягивался горизонтально.
Все лучшие ответы не сработали для меня. Но я заметил, что люди упоминают layout_weight, и просто из любопытства посмотрел на него и обнаружил следующее в Документах Android :

Вес макета

LinearLayout также поддерживает назначение веса отдельным детям с помощью атрибута android: layout_weight. Этот атрибут присваивает виду значение важности с точки зрения того, сколько места оно должно занимать на экране. Большее значение веса позволяет расширить его, чтобы заполнить все оставшееся пространство в родительском представлении. Дочерние представления могут указывать значение веса, и тогда любое оставшееся пространство в группе представлений присваивается детям в пропорции их заявленного веса. Вес по умолчанию - ноль.

Например, если есть три текстовых поля и два из них объявляют вес 1, а другому не присвоен вес, третье текстовое поле без веса не будет расти и будет занимать только область, требуемую его содержимым. Два других будут расширяться в равной степени, чтобы заполнить пространство, оставшееся после измерения всех трех полей. Если третьему полю присваивается вес 2 (вместо 0), то теперь оно объявляется более важным, чем оба остальных, поэтому оно получает половину от общего оставшегося пространства, в то время как первые два делят остальные равные

Таким образом, в принципе, если для элемента layout_width установить значение 0, оно будет отображаться в соответствии с размерами его содержимого.
Если вы установите его на что-то еще, элемент будет бороться за дополнительное пространство в родительском элементе, который его содержит; с более взвешенными элементами, занимающими больше места.

Итак, когда я установил layout_width = 0 для обоих TextView и ImageButton в моем примере, ни один из них не занимает дополнительное пространство, и они оба сжимаются влево.

Но когда я установил его на 1 для TextView и 0 для ImageButton, ImageButton не займет больше места, чем требуется для его содержимого; в то время как TextView занимает все дополнительное пространство и толкает ImageButton вправо.
Просто так, как я этого хочу.

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

Answer 5

Я могу немного опоздать на вечеринку.Однако есть простой способ добиться этого поведения, переопределив onMeasure ().Вот как это будет выглядеть:

public class MySquareImageButton extends ImageButton {
    public MySquareImageButton(Context context) {
        super(context);
    }

    public MySquareImageButton(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MySquareImageButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //(1)if you want the height to match the width
        super.onMeasure(widthMeasureSpec, widthMeasureSpec);
        //(2)if you want the width to match the height
        //super.onMeasure(heightMeasureSpec, heightMeasureSpec);
    }
}

И тогда вы просто замените ImageButton вашего XML на этот пользовательский:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <EditText
        android:id="@+id/txtName"
        android:layout_width="1dp"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <com.whatever_your_package.MySquareImageButton
        android:id="@+id/btSet"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:scaleType="fitEnd"
        android:src="@drawable/pin2" />

</LinearLayout>

Вы просто поместите wrap_content в width иливысота, в зависимости от того, какой из них вы хотите диктовать размер вашей кнопки.Если вы хотите, чтобы ваша кнопка перенесла ее высоту на изображение, а ширина просто соответствовала высоте, вы должны использовать

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

и использовать

        //(2)if you want the width to match the height
        //super.onMeasure(heightMeasureSpec, heightMeasureSpec);

Answer 6

Я попробовал сам, это работает

Просто сделайте следующее ...

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

    <EditText
        android:id="@+id/editText1"
        android:layout_width="0dp"
        android:layout_weight="5"
        android:layout_height="wrap_content"
        android:inputType="text"/>

    <ImageButton
        android:id="@+id/imageButton"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent" />

</LinearLayout>

Используйте соотношение веса макета 5: 1 внутри LinearLayout для EditText и ImageButton

Answer 7

Просто столкнулся с чем-то вроде этого, и другие предложения не помогли. Что помогло, так это установив отступ в ImageButton:

android:padding="5dp"

Кроме того, я не трогал оригинальный макет. Кнопка стала квадратной на 3 эмуляторах, которые я тестировал (3.2, 4.4.2, 5.1)

Answer 8

Просто добавьте следующую строку в ImageButton, и дополнительный фон исчезнет:

android:layout_gravity="center|clip_horizontal"

надеюсь, это сработает

Answer 9

<LinearLayout
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:orientation="horizontal"
 android:weightSum="1.0" >

<EditText
   android:id="@+id/txtName"
   android:layout_weight="0.75" // this work like percentage adjust as u want 70 or 75
   android:layout_height="wrap_content"
   android:layout_width="0dp" 
   android:inputType="text"
   android:singleLine="true"/>

<ImageButton
   android:id="@+id/btSet"
   android:layout_weight="0.25" // this work like percentage adjust as u want 25 or 30
   android:layout_height="wrap_content"
   android:layout_width="0dp"
   android:scaleType="fitEnd"
   android:src="@drawable/pin2" />

</LinearLayout>

Answer 10

, если хотите, ваш ImageButton растягивается и имеет такую ​​же ширину, как и длина, лучше использовать NinePatch Image. форму справки можно найти здесь Draw 9-patch & Как работает инструмент Android-9-patch?