Relleno no deseado alrededor de ImageView

7 minutos de lectura

avatar de usuario
stefs

Necesito incluir un gráfico de encabezado en todas mis actividades/vistas. El archivo con el encabezado se llama 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="https://stackoverflow.com/questions/5830503/@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>

Nota la android:background="#00FF00" (verde), es solo para fines de visualización.

Los incluyo en mis puntos de vista así:

<?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" />
  (...)

Entonces, cuando realmente lo pruebo, el resultado se parece a la imagen de la izquierda, en lugar de cómo debería verse (a la derecha):

nota el borde verde

(1) Esta parte, la naranja, es la imagen/ImageView en cuestión
(2) El borde verde no amado. nota: normalmente, el área verde sería transparente. Solo es verde porque configuré el background.

Tenga en cuenta el borde verde alrededor de la imagen en la parte superior; Es parte de ImageView y simplemente no puedo entender por qué está allí o cómo puedo deshacerme de él. Estableció todos los rellenos y márgenes en 0 (pero el resultado es el mismo cuando los omito). La imagen es un jpeg* de 480x64px y la puse en res/drawable (no en uno de los drawable-Xdpi aunque).

(* jpeg, porque parece que me topé con el viejo problema gamma png – al principio solucioné el problema haciendo que el borde verde fuera del mismo naranja que la imagen, y los colores no coincidían).

Lo probé en mi HTC Desire/2.2/Build 2.33.163.1 y en el emulador. También le describí el problema a alguien en #android-dev; Podía reproducir el problema pero tampoco tenía explicación. el objetivo de compilación es 1.6.

actualice @tehgoose: este código produce exactamente el mismo resultado de relleno superior + inferior.

<?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="https://stackoverflow.com/questions/5830503/@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>

  • Los valores de margen y/o relleno negativos también pueden funcionar:android:layout_margin="-10dp", android:padding="-10dp"

    – Samus

    16 de noviembre de 2018 a las 21:22

avatar de usuario
stefs

¡finalmente!

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

la atributo de ajuste de los límites de la vista Hizo el truco:

Establezca esto en verdadero si desea que ImageView ajuste sus límites para preservar la relación de aspecto de su dibujable.

Me topé con eso aquí. ¡Gracias por tu ayuda!

  • Tengo el mismo problema, pero esta solución no tuvo ningún efecto.

    –Marty Miller

    2 de agosto de 2012 a las 19:51

  • Guau… sin ese atributo, se agregaba un relleno no deseado según la densidad de la pantalla, por lo que solo sucedía en algunos dispositivos. Me volvió loco porque la imagen se veía bien en todos los dispositivos que tengo, luego, cuando la probé en el dispositivo de un amigo, parecía una mierda. GRACIAS.

    – DiscDev

    14 de diciembre de 2012 a las 15:09

  • Gracias a los dioses, cambié mi primer intento de tratar de resolver el error para encontrar algo desgastado de Android. Creo que este problema comenzó cuando algunos fabricantes cambiaron cosas de Android y luego tuvieron que poner una propiedad para resolverlo en las próximas versiones.

    – Ratata Tata

    31 mayo 2015 a las 23:10

  • Lamentablemente, esto no funciona para apis inferiores, al menos api 16 y 17.

    – más suave

    15 de enero de 2016 a las 23:22

  • Wow, esto es exactamente lo que estaba buscando, estuve rascándome la cabeza durante unas horas, incluso llegué a intentar invalidar mi diseño y configurar su alto/ancho a la imagen. Una solución tan simple que funciona perfectamente sin necesidad de scaleType.

    – Cody Engel

    12 de febrero de 2017 a las 22:12

avatar de usuario
Luna llena

android:scaleType="fitXY"

Esto funciona para mi.

  • scaleType="fitXY" Sin embargo, hace algo diferente: cambia la relación de aspecto de la imagen, lo que provoca distorsión. esto puede ser aceptable a veces, por ejemplo, para una imagen de fondo abstracta.

    – Stefs

    24/10/2014 a las 13:45

  • Controlé la relación de aspecto usando android:width y android:height, y scaleType=”fitXY” llenó el imageView para mí con la relación de aspecto deseada, esa fue al menos mi experiencia. Gracias por tu contribución.

    – Luna llena

    24/10/2014 a las 18:40

  • Funciona pero la imagen no es bonita, está desequilibrada o está recortada

    – 최봉재

    21 de abril de 2016 a las 7:04


  • No exactamente, pero android:scaleType=”fitEnd” funcionó como magia.

    – La bibliotecaria

    13 de marzo de 2017 a las 9:49

  • Encontré una combinación de android:adjustViewBounds="true" y android:scaleType="fitXY" era lo que necesitaba para alinear ImageViews en mi diseño. Las imágenes estaban desviadas por un píxel o dos (muy pequeñas en una pantalla de alta resolución) con solo adjustViewBounds. Agregando el scaleType parece forzar una escala final de la imagen después de ajustar los límites de la vista, lo que obliga a la imagen a escalar al tamaño completo de los nuevos límites.

    –Jeff Lockhart

    27 de agosto de 2018 a las 19:12


avatar de usuario
MJ Montes

ese relleno adicional se genera automáticamente ya que Android intentaría obtener la relación de aspecto original. por favor intente a continuación

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

avatar de usuario
nazar merza

Tiene que ver con la relación de aspecto de la imagen. De forma predeterminada, el sistema mantiene la relación de aspecto original de la fuente de la imagen. Que en la mayoría de los casos no coincide exactamente con el diseño o las dimensiones especificadas en el diseño. Por lo tanto,

  1. Cambie el tamaño de la imagen para que se ajuste al diseño especificado, o
  2. Usar android:scaleType para adaptarse a la imagen. Por ejemplo, puede especificar android:scaleType="fitXY"

use este android:scaleType=”fitXY” en imageview xml

avatar de usuario
Udaykirán

Puede ser que puedas dar specific height to imageView say 50dp or 40dp y adjust image to make green border desaparecer

P.ej: android:layout_height="40dp"

android:layout_height="wrap_content"

Debe cambiarlo a “fill_parent”

También es posible que deba escalar su imagen para que tenga la proporción correcta para completar el diseño del marco en el que se encuentra.

No entiendo por qué necesita el diseño del marco allí. Sin él, su imagen simplemente llenaría la pantalla de todos modos.

EDITAR: sí, lo siento, el xml es la altura de la vista de imagen.

  • Lo único que debe agregar es que necesita establecer la altura de diseño de ImageViewno es tan evidente en tu respuesta 🙂

    – ernazm

    29/04/2011 a las 10:00

  • Lo probé sin un diseño circundante también, no cambia nada. Además, la imagen actual es solo un marcador de posición: pronto habrá elementos adicionales (que justifican el diseño circundante). No quiero que la imagen coincida con la pantalla, la quiero justo ahí, en la parte superior.

    – Stefs

    29 de abril de 2011 a las 10:57

  • Verifique dos veces para ver si su imagen tiene espacios en blanco en la parte superior e inferior. De lo contrario, intente escalar el objeto de vista de imagen usando android:scaleType=””. Debe haber uno que se adapte a lo que estás buscando.

    – No es un hombre inteligente

    29 de abril de 2011 a las 12:58

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad