studio - manual de programacion android
Imagen de fondo de escala para ajustar el contenido del diseño (8)
Cree un xml dibujable, digamos 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"
Tengo un diseño que contiene algunos campos de texto y una imagen de fondo que se muestra en la parte superior de mi actividad. Me gustaría que la imagen de fondo se escale para envolver el contenido (no me importa 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 ajusta 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 algunas otras preguntas, encontré estas dos:
¿Cómo envolver las vistas de contenido en lugar de fondo dibujable?
¿Escalar una imagen extraíble o de fondo?
Basado en esto, creé un FrameLayout con un ImageView mostrando el fondo. Desafortunadamente, todavía no puedo hacer que funcione. Quiero que la altura de la imagen de fondo se reduzca / expanda con el tamaño de las vistas de texto, pero con FrameLayout, el ImageView se ajusta al tamaño de su matriz, y no puedo encontrar la manera de que el padre se ajuste a el tamaño del diseño de 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 sobre la mejor manera de hacer que una imagen escale el tamaño de los contenidos de algún diseño? No me preocupa la relación de aspecto de la imagen, ya que no importará, solo quiero que llene el fondo.
¡Gracias!
Creo que hice algo similar a esto en el pasado, intente jugar con la configuración de gravedad en su vista de imagen, creo que uno de ellos debería hacer lo que está buscando.
No lo he intentado, pero si configura dinámicamente la imagen de fondo en onCreate podría funcionar. El tamaño del diseño ya debería estar establecido.
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>
Puedes probar este truco
- FrameLayout (contenido de pantalla, contenido de texto)
- ImageView (emparejar el padre, emparejar el padre) // es su fondo
- LinearLayout (contenido de pantalla, contenido de texto)
- Todos tus contenidos van dentro de este diseño lineal o de cualquier otro tipo que quieras
Puedes usar esto:
<ImageView
...
android:scaleType="fitXY"
>
Espero que haya sido de ayuda)))
Trabaja con RealtiveLayout (no obligatorio pero en lugar de FrameLayout y usa android: scaleType = "fitXY". Mueve el imageView a RealtiveLayout que contiene las textviews android: id = "@ + id / HeaderList" y desarma 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!
Tuve el mismo problema (creo), y la única solución que pude encontrar fue esta:
<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>