Mettre l'image d'arrière-plan à l'échelle pour envelopper le contenu de la mise en page

Question

J'ai une page qui contient des champs de texte et a une image de fond qui s'affiche en haut de mon activité. J'aimerais que l'image d'arrière-plan à l'échelle pour envelopper le contenu (ne se soucient pas de l'aspect ratio). Cependant, l'image est plus grande que le contenu, de sorte que la mise en page au lieu encapsule l'image d'arrière-plan. Voici mon code d'origine:

<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>

Après une recherche par le biais de certains autres questions, j'ai trouvé ces deux:

Comment envelopper vues de contenu plutôt que l'arrière-plan dessiné?

À l'échelle d'un Drawable ou image d'arrière-plan?

Sur cette base, j'ai créé un FrameLayout w/ une ImageView montrer le fond. Malheureusement, je ne peux toujours pas le faire fonctionner. Je veux la hauteur de l'image d'arrière-plan pour réduire/développer w/ la taille du texte, mais avec le FrameLayout, l'ImageView s'adapte à la taille de son parent, et je ne peux pas trouver un moyen de rendre le parent adapter à la taille de l'affichage du texte de la disposition. Voici mon code mis à jour:

<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>

Ne quelqu'un a des suggestions quant à la meilleure manière de faire une image à l'échelle de la taille du contenu de certaines de mise en page? Je ne suis pas concerné par le ratio d'aspect de l'image, car elle n'a pas d'importance, je veux juste pour remplir l'arrière-plan.

Merci!

Answer 1

J'ai eu le même problème (je pense), et la seule solution que j'ai pu trouver était la suivante:

 <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>
 

Answer 2

Vous pouvez essayer cette astuce,

• FrameLayout (wrapcontent, wrapcontent)
• • ImageView (match parent, match parent) // c'est votre arrière-plan
• • LinearLayout (wrapcontent, wrapcontent)
• • • Tout votre contenu entre dans cette disposition linéaire ou tout autre type que vous voulez

Answer 3

Travaillez avec RealtiveLayout (pas obligatoire mais au lieu de FrameLayout et utilisez android: scaleType = "fitXY". Déplacez l'imageView vers RealtiveLayout qui contient les vues de texte android: id = "@ + id / HeaderList" et désactivez l'arrière-plan android: background = "@ drawable / header "à ce niveau.

 <?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>
 

Plus ou moins ça devrait marcher!

Answer 4

Créez un fichier XML dessinable, par exemple 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" />
 

Ensuite, dans votre RelativeLayout dans la première utilisation d'extrait de code

 android:background="@drawable/mybackground"
 

Answer 5

Je pense que j'ai fait quelque chose de similaire dans le passé, essayez de jouer avec le réglage de la gravité dans votre vue d'image, je pense que l'un d'eux devrait faire ce que vous recherchez.