Поместите ImageView над кнопкой Android
Я пытаюсь разместить ImageView над кнопкой, используя RelativeLayout. Вот мой xml:
<RelativeLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="0.50" >
<Button
android:id="@+id/btnFindDaysInBetween"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/blue_500"
android:text="@string/dt_text_days" />
<ImageView
android:id="@+id/imageview_find_days_in_between"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:contentDescription="@string/empty"
android:src="@drawable/ic_check_circle_white" />
</RelativeLayout>
Вот скриншот изображения:
![enter image description here]()
Как вы можете видеть, изображение ImageView src не отображается. Однако, если я изменяю кнопку в обратном направлении к ImageView, изображение верхнего ImageView видимо. Пожалуйста, см. Ниже..
Изменен xml:
<RelativeLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="0.50" >
<!--
<Button
android:id="@+id/btnFindDaysInBetween"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/blue_500"
android:text="@string/dt_text_days" />
-->
<ImageView
android:id="@+id/imageview_find_days"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:contentDescription="@string/empty"
android:src="@drawable/ic_send_black" />
<ImageView
android:id="@+id/imageview_find_days_in_between"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:contentDescription="@string/empty"
android:src="@drawable/ic_check_circle_white" />
</RelativeLayout>
Изменен скриншот xml:
![enter image description here]()
Что я делаю неправильно в первом макете?
Ответы
Ответ 1
Причина на самом деле очень проста.:) Мы настолько увлечены мыслями в 2D, что не видим elevation
- в Z.
Нет ничего плохого в вашем первом макете. Button
просто имеет более высокий elevation
чем ImageView
- ровно 1dp
выше. Поэтому, независимо от того, как вы упорядочиваете два вида, Button
поднимается выше.
Немного доказательств:
Кнопка A по умолчанию получает стиль Widget.Material.Button
:
<!-- Bordered ink button -->
<style name="Widget.Material.Button">
<item name="background">@drawable/btn_default_material</item>
<item name="textAppearance">?attr/textAppearanceButton</item>
<item name="minHeight">48dip</item>
<item name="minWidth">88dip</item>
<item name="stateListAnimator">@anim/button_state_list_anim_material</item>
<item name="focusable">true</item>
<item name="clickable">true</item>
<item name="gravity">center_vertical|center_horizontal</item>
</style>
Атрибут, который вводит это повышение, android:stateListAnimator
. StateListAnimator
похож на StateListDrawable
и обеспечивает анимацию изменения состояния. Полный xml находится здесь: Ссылка. Но здесь базовое состояние кнопки:
<!-- base state -->
<item android:state_enabled="true">
<set>
<objectAnimator android:propertyName="translationZ"
android:duration="@integer/button_pressed_animation_duration"
android:valueTo="0"
android:startDelay="@integer/button_pressed_animation_delay"
android:valueType="floatType"/>
<objectAnimator android:propertyName="elevation"
android:duration="0"
android:valueTo="@dimen/button_elevation_material"
android:valueType="floatType" />
</set>
</item>
Как вы можете видеть, значение высоты для кнопки установлено на @dimen/button_elevation_material
:
<dimen name="button_elevation_material">1dp</dimen>
И что как ImageView
заканчивается за/ниже Button
.
Итак, что мы можем сделать?
Прямым решением было бы установить возвышение ImageView's
на ту же сумму - 1dp
.
Другим решением, которое потребует немного работы, является удаление возвышения Button's
, а не изменение ImageView's
. Основываясь на стандартном StateListAnimator
, мы можем создать наш собственный - и удалить высоту. Затем в res/values-v21/styles.xml
укажите стиль, который наследуется от Widget.Material.Button
:
<style name="MyDepressedButtonStyle" parent="android:Widget.Material.Button">
<item name="android:stateListAnimator">@anim/customized_state_animator</item>
</style>
Теперь установите этот стиль на Button
:
<Button
style="@style/MyDepressedButtonStyle"
....
.... />
Edit
Собственно, мы можем напрямую применить настроенный StateListAnimator
:
<Button
android:stateListAnimator="@anim/customized_state_animator"
....
.... />
Не нужно брать маршрут scenic
!
Ответ 2
Я нашел решение:
просто android: elevation = "2dp"
<Button
android:id="@+id/btnAccess"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_gravity="right|center"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/imageView4"
android:background="@drawable/or"
android:layout_alignBottom="@+id/btnRegister"
android:layout_centerHorizontal="true"
android:layout_margin="5dp"
android:elevation="2dp" />
Ответ 3
Используйте ImageButton
замените Button
и установите ImageButton
фон как прозрачный.
<ImageButton
android:id="@+id/btnFindDaysInBetween"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/blue_500_text"
android:background="@android:color/transparent"
/>
<ImageView
android:id="@+id/imageview_find_days_in_between"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:contentDescription="@string/empty"
android:src="@drawable/ic_check_circle_white" />
Вы можете создать изображение с цветом и текстом blue_500 (которое легко создать), а затем установить это изображение на ImageButton
. После этого ваш ImageView
будет видеть вверху ImageButton
.
Надеюсь на эту помощь!
Ответ 4
android:background
существует для всех представлений. Как видно из названия, это то, что будет в фоновом режиме.
android:src
существует для ImageViews
и его подклассов. Вы можете думать об этом как о переднем плане. Поскольку ImageView
является подклассом View, у вас даже есть android:background
.
Если передний план меньше фона, то видимая часть фона, которая не покрывается передним планом, будет видна.
Кроме того, вы можете использовать прозрачность на переднем плане, и в этом случае фон будет видимым (прозрачным).
Вы можете использовать ПРЕДПОСЫЛКУ ДЛЯ ВСЕХ ВИДОВ.. Но вы можете использовать SRC только для ImageView
и ImageButton
.....
Ответ 5
@Vamsi Я пробовал ваши обе комбинации, и первый из них не работает с Button
. Вы должны пройти через ImageView.
Это то, что я пытался с помощью ImageView:
![enter image description here]()
Пока я пытался сделать это с помощью Button
и посмотреть, что получилось:
![enter image description here]()
Я попытался изменить порядок, но все напрасно! Кажется, вам нужно идти с помощью ImageView
или ImageButton
.
В конце! Вы можете видеть, что я пробовал:
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="match_parent">
<!-- <ImageView
android:id="@+id/btnTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="@drawable/ic_launcher_web"
android:contentDescription="@string/app_name"
android:text="@string/app_name" /> -->
<ImageView
android:layout_width="wrap_content"
android:id="@+id/imgView"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:contentDescription="@string/app_name"
android:src="@drawable/ic_launcher" />
<Button
android:id="@+id/btnTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/imgView"
android:layout_alignTop="@+id/imgView"
android:text="@string/app_name" />
</RelativeLayout>
Я выполнял такую же работу либо с ImageView
, либо ImageButton
(возможно, с ImageView
) и пробовал тот же подход, что и вы, используя Button
.
Спасибо
Ответ 6
На самом деле гораздо проще просто установить StateListAnimator в @null
<Button
...
android:stateListAnimator="@null" />
Источник Android 5.0 android: высота Работает для просмотра, но не кнопка?
Ответ 7
Кнопка - это просто TextView с определенным стилем, применяемым к нему, поэтому, если вы замените Button с помощью TextView, вы можете отобразить ImageView поверх него. Это также работает на API < 21.
Ответ 8
Я разместил ImageView на кнопке с отключением RelativeLayout, надеюсь, что это поможет.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<View
android:id="@+id/tempview"
android:layout_width="0dp"
android:layout_height="0dp" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tempview"
android:background="@drawable/ic_launcher" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tempview"
android:src="@drawable/img_cancel" />
</RelativeLayout>