Нежелательные отступы вокруг ImageView


142

Мне нужно включить изображение заголовка во все мои действия / представления. Файл с заголовком называется header.xml:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content"
  android:background="#0000FF" 
  android:padding="0dip">

  <ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/header"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="0dip"
    android:layout_marginTop="0dip"
    android:layout_marginBottom="0dip"
    android:padding="0dip"
    android:paddingTop="0dip"
    android:paddingBottom="0dip"
    android:layout_gravity="fill"
    android:background="#00FF00"
    />
</FrameLayout>

Обратите внимание на android:background="#00FF00"(зеленый), это просто визуализация целей.

Я включаю их в свои взгляды, как это:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical"
  style="@style/white_background">

  <include layout="@layout/header" />
  (...)

Итак, когда я на самом деле это пробую, результат выглядит как левое изображение, а не как (справа):

обратите внимание на зеленую границу

(1) Это - оранжевая - часть является изображением / ImageView, о котором идет речь
(2) Нелюбимая зеленая рамка. примечание: обычно зеленая область будет прозрачной - она ​​только зеленая, потому что я установил background.

Обратите внимание на зеленую рамку вокруг изображения вверху; Это часть ImageView, и я просто не могу понять, почему он существует и как я могу от него избавиться. Он устанавливает все отступы и поля на 0 (но результат тот же, когда я их опускаю). Изображение в формате 480x64px jpeg *, и я поместил его в res / drawable (но не в один из них drawable-Xdpi).

(* jpeg, потому что кажется, что я наткнулся на старую проблему png-гаммы - сначала я обошел проблему, сделав зеленую рамку такой же оранжевой, как на картинке, и цвета не совпадали.)

Я попробовал это на моем htc desire / 2.2 / Build 2.33.163.1 и на эмуляторе. Также я описал проблему кому-то в # android-dev; Она могла воспроизвести проблему, но также не имела объяснения. Цель сборки - 1.6.

update @tehgoose: этот код дает точно такой же результат + верх + низ.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical"
  style="@style/white_background">

  <!-- <include layout="@layout/header" />  -->

  <ImageView
    android:src="@drawable/header"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#00FF00"
    android:layout_weight="0"
    />

  <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="8dip"
    android:layout_weight="1">

    (... rest of the elements)

  </LinearLayout>
</LinearLayout>

Отрицательные значения полей и / или android:layout_margin="-10dp"android:padding="-10dp"
отступов

Ответы:


442

Ну наконец то!

<ImageView
  (...)
  android:adjustViewBounds="true" />

атрибут adjustViewbounds сделал трюк:

Установите для этого параметра значение true, если вы хотите, чтобы ImageView корректировал свои границы, чтобы сохранить соотношение сторон его отрисовки.

я наткнулся на это здесь . Спасибо за вашу помощь!


7
У меня такая же проблема, но это решение не дало результата.
Марти Миллер

4
Ничего себе ... без этого атрибута добавлялись нежелательные отступы в зависимости от плотности экрана, так что это происходило только на некоторых устройствах. Это сводило меня с ума, потому что изображение выглядело отлично на всех устройствах, которыми я владею, тогда, когда я попробовал его на устройстве друга, это выглядело как дерьмо. СПАСИБО.
DiscDev

Слава богу, я переключаю свою первую попытку с попытки решить ошибку, чтобы найти что-то ненормальное для Android. Я полагаю, что эта проблема началась у некоторых производителей, меняющих вещи с Android, а затем они должны добавить свойство, чтобы решить эту проблему в следующих версиях.
Ратата Тата

К сожалению, это не работает для низких API, API 16 и 17 по крайней мере.
Luoser

1
Вау, это именно то, что я искал, я несколько часов чесал голову, даже пытался сделать недействительным макет и установить его высоту / ширину для изображения. Такое простое решение, которое прекрасно работает без необходимости в scaleType.
CodyEngel

39
android:scaleType="fitXY"

Меня устраивает.


3
scaleType="fitXY"делает что-то другое, хотя: он изменяет соотношение сторон изображения, что приводит к искажению. иногда это может быть приемлемо, например, для абстрактного фонового изображения.
stefs

1
Я управлял соотношением сторон, используя android: width и android: height, а scaleType = "fitXY" действительно заполнил для меня imageView желаемым соотношением сторон, что было по крайней мере моим опытом. Спасибо за ваш вклад.
Бадр

Это работает, но изображение неуместно, разбалансировано, обрезано
최봉재

1
Не совсем, но android: scaleType = "fitEnd" работал как по волшебству.
TheLibrarian

Я нашел комбинацию android:adjustViewBounds="true"и android:scaleType="fitXY"был тем, что мне нужно для выравнивания ImageViews в моем макете. Изображения были отключены на один или два пикселя (очень маленькие на экране высокого разрешения) с просто adjustViewBounds. scaleTypeКажется, что добавление символа заставляет окончательное масштабирование изображения после того, как границы вида отрегулированы, что заставляет изображение масштабироваться до полного размера новых границ.
Джефф Локхарт

3

Это связано с соотношением сторон изображения. По умолчанию система сохраняет исходное соотношение сторон источника изображения. Что в большинстве случаев не совсем соответствует макету или размерам, указанным в макете. Следовательно,

  1. Либо измените размер изображения в соответствии с указанным макетом, либо
  2. Используйте, android:scaleTypeчтобы соответствовать изображению. Например, вы можете указатьandroid:scaleType="fitXY"

3

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

scaletype = "fitCenter"
android:adjustViewBounds="true"
android:layout_height="wrap_content"

0

Может быть, вы можете дать specific height to imageView say 50dp or 40dpи adjust image to make green borderисчезнуть.

Например: android:layout_height="40dp"


Установка layout_width = "480px" и layout_height = "64px" дает желаемый результат, но пиксели не очень практичны. я честно не понимаю, как это переводится в дп.
Stefs

Вы должны использовать dp так же, как и пиксели. Это все, что они есть; отображать независимые пиксели. но это работает.
Удайкиран

dp / dip означает плотность, независимую от пикселей; насколько я понимаю, он покрывает разные плотности, но (конечно) не разные размеры экрана. все, что я хочу, это чтобы изображение масштабировалось до 100% ширины экрана и оставляло высоту, чтобы сохранялись пропорции.
Stefs

0
android:layout_height="wrap_content"

Вам нужно изменить его на "fill_parent"

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

Я не понимаю, зачем вам вообще нужен макет кадра. Без этого ваше изображение в любом случае просто заполнило бы экран.

РЕДАКТИРОВАТЬ: да, извините, XML это высота для изображения.


1
Единственное, что нужно добавить, это то, что ему нужно установить высоту макета ImageView, это не так очевидно в вашем ответе :)
ernazm

Я попробовал это без окружения, ничего не меняет. кроме того, текущее изображение является просто заполнителем - скоро появятся дополнительные элементы (оправдывая окружающий макет). Я не хочу, чтобы изображение соответствовало экрану, я хочу, чтобы оно было там, наверху.
Stefs

Дважды проверьте, есть ли на вашем изображении пустое место сверху и снизу. Если нет, попробуйте масштабировать объект imageview с помощью android: scaleType = "". Там должно быть один, чтобы удовлетворить то, что вы ищете.
NotACleverMan


-1

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

Вот что я использовал:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!--<gradient android:startColor="#FFFFFF" android:endColor="#969696"

    android:angle="270">
-->
<gradient android:startColor="#FFFFFF" android:endColor="#FFFFFF"

    android:angle="270">
</gradient>
    <stroke android:width="2dp" android:color="@color/graycolor" />
<corners android:radius="2dp" />
<padding android:left="5dp" android:top="5dp" android:right="5dp"
    android:bottom="5dp" />


2
Вау! я уже работал с фигурами (для фонов вкладок), но, честно говоря, я не понимаю, как мне применить это здесь.
Stefs

@Schnalle: создайте два файла shape.xml и один файл selector.xml. применить фоновое изображение как файл selector.xml. В файле селектора укажите два состояния для сфокусированного / выбранного и нормального состояния.
Zoombie
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.