Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


Escala la imagen de fondo para ajustar el contenido del diseño

Tengo un diseño que contiene algunos campos de texto y tiene una imagen de fondo que se muestra en la parte superior de mi actividad. Me gustaría que la imagen de fondo para escalar para envolver el contenido (no se preocupan por la relación de aspecto). Sin embargo, la imagen es más grande que el contenido, por lo que el diseño en su lugar envuelve la imagen de fondo. Aquí está mi código original:

<RelativeLayout android:layout_width="fill_parent" android:id="@+id/HeaderList" android:layout_gravity="top" android:layout_height="wrap_content" android:background="@drawable/header"> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/NameText" android:text="Jhn Doe" android:textColor="#FFFFFF" android:textSize="30sp" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:paddingLeft="4dp" android:paddingTop="4dp" /> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:textColor="#FFFFFF" android:layout_alignParentLeft="true" android:id="@+id/HoursText" android:text="170 hours" android:textSize="23sp" android:layout_below="@+id/NameText" android:paddingLeft="4dp" /> </RelativeLayout> 

Después de buscar a través de algunas otras preguntas, encontré estos dos:

¿Cómo envolver las vistas de contenido en lugar de dibujos de fondo?

Escala de una imagen de dibujo o de fondo?

Basado en esto, creé un FrameLayout w / un ImageView que muestra el fondo. Por desgracia, todavía no puedo conseguir que funcione. Quiero que la altura de la imagen de fondo se reduzca / expanda w / el tamaño de las vistas de texto, pero con el FrameLayout, el ImageView se ajusta al tamaño de su padre, y no puedo encontrar una manera de hacer que el padre ajuste a El tamaño del diseño de la vista de texto. Aquí está mi código actualizado:

 <FrameLayout android:layout_width="fill_parent" android:layout_height="wrap_content" > <ImageView android:src="@drawable/header" android:layout_width="fill_parent" android:scaleType="fitXY" android:layout_height="fill_parent" /> <RelativeLayout android:layout_width="fill_parent" android:id="@+id/HeaderList" android:layout_gravity="top" android:layout_height="wrap_content" > <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/NameText" android:text="John Doe" android:textColor="#FFFFFF" android:textSize="30sp" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:paddingLeft="4dp" android:paddingTop="4dp" /> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:textColor="#FFFFFF" android:layout_alignParentLeft="true" android:id="@+id/HoursText" android:text="170 hours" android:textSize="23sp" android:layout_below="@+id/NameText" android:paddingLeft="4dp" /> </RelativeLayout> </FrameLayout> 

¿Alguien tiene alguna sugerencia para la mejor manera de hacer una escala de imagen al tamaño de los contenidos de algún diseño? No estoy preocupado por la relación de aspecto de la imagen, ya que no importa, sólo quiero que llene el fondo.

¡Gracias!

  • Android GLSurfaceView fondo transparente sin setZOrderonTop
  • Cree un nuevo TextView mediante programación y luego muéstrelo debajo de otro TextView
  • Cómo establecer Parámetros de diseño RelativeLayout en código no en xml
  • Android: Uso de alignBaseline para una imagen que sigue al texto
  • LinearLayout vs RelativeLayout
  • Androide - superponer imágenes (jugar a las cartas)
  • Cambiar mediante programación RelativeLayout toRightOf to toLeftOf
  • Las dependencias circulares no pueden existir en RelativeLayout, android?
  • 8 Solutions collect form web for “Escala la imagen de fondo para ajustar el contenido del diseño”

    Tuve el mismo problema (creo), y la única solución que pude encontrar fue la siguiente:

     <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" > <View android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/some_image" android:layout_alignTop="@+id/actual_content" android:layout_alignBottom="@id/actual_content" android:layout_alignLeft="@id/actual_content" android:layout_alignRight="@id/actual_content" /> <LinearLayout android:id="@id/actual_content" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true" > <!-- more stuff ... --> </LinearLayout> </RelativeLayout> 

    Usted puede intentar este truco,

    • FrameLayout (wrapcontent, wrapcontent)
      • ImageView (padre del fósforo, padre del fósforo) // su su fondo
      • LinearLayout (wrapcontent, wrapcontent)
        • Todo su contenido va dentro de este diseño lineal o cualquier otro tipo lo que quieras

    Mueva el imageView a RealtiveLayout que contiene las vistas de texto android: id = "@ + id / HeaderList" y desactive el fondo android: background = "@ Drawable / header "en este nivel.

     <?xml version="1.0" encoding="utf-8"?> <RelativeLayout android:id="@+id/principal" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/header" > <RelativeLayout android:layout_width="fill_parent" android:id="@+id/HeaderList" android:layout_gravity="top" android:layout_height="wrap_content" > <ImageView android:id="@+id/backImg" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_centerInParent="true" android:adjustViewBounds="true" android:background="@color/blancotransless" android:src="@drawable/header" android:scaleType="fitXY" > </ImageView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/NameText" android:text="John Doe" android:textColor="#FFFFFF" android:textSize="30sp" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:paddingLeft="4dp" android:paddingTop="4dp" /> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:textColor="#FFFFFF" android:layout_alignParentLeft="true" android:id="@+id/HoursText" android:text="170 hours" android:textSize="23sp" android:layout_below="@+id/NameText" android:paddingLeft="4dp" /> </RelativeLayout> </RelativeLayout> 

    ¡Más o menos debería funcionar!

    Cree un xml dibujable, diga mybackground.xml

     <?xml version="1.0" encoding="utf-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:src="@drawable/header" android:gravity="fill" /> 

    Luego en su RelativeLayout en el primer fragmento de código use

     android:background="@drawable/mybackground" 

    Creo que he hecho algo similar a esto en el pasado, intente jugar con el ajuste de gravedad en su vista de imagen, creo que uno de ellos debe hacer lo que buscas.

    No lo he probado, pero si establece la imagen de fondo dinámicamente en el onCreate que podría funcionar. El tamaño del diseño ya debe estar establecido.

    Puede utilizar esto:

     <ImageView ... android:scaleType="fitXY" > 

    Espero que ayudó

    Prueba este código …..

     <LinearLayout android:layout_width="fill_parent" android:id="@+id/HeaderList" android:orientation="vertical" android:layout_gravity="top" android:layout_height="wrap_content" android:background="@drawable/header"> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/NameText" android:text="Jhn Doe" android:textColor="#FFFFFF" android:textSize="30sp" android:paddingLeft="4dp" android:paddingTop="4dp" /> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:textColor="#FFFFFF" android:id="@+id/HoursText" android:text="170 hours" android:textSize="23sp" android:paddingLeft="4dp" /> </LinearLayout> 
    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.