Comment aligner verticalement un élément dans une liste en utilisant une disposition relative?

Question

J'utilise une vue de liste dans Android 1.5 pour afficher une liste d'images et de texte à côté de l'image. J'essaye de centrer verticalement le texte mais le texte est en haut de la rangée au lieu de centré. Ci-dessous ma mise en page:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/row" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:padding="10dip"> 

    <ImageView android:id="@+id/item_image" android:layout_width="wrap_content" 
     android:layout_height="wrap_content" android:paddingRight="10dip" 
     android:src="@drawable/default_image" android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentBottom="true" 
     android:layout_centerVertical="true" 
     android:gravity="center_vertical"/> 

    <TextView android:id="@+id/item_title" 
     android:layout_width="wrap_content" android:layout_height="wrap_content" 
     android:layout_toRightOf="@id/item_image" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentBottom="true" 
     android:layout_centerVertical="true" 
     android:gravity="center_vertical" 
     /> 

</RelativeLayout> 

Il semble étrange que je dois mettre alignParentTop = « true » quand je suis en train de centrer verticalement le texte, mais si je ne suis pas le texte ne montre même pas. Qu'est-ce que je fais mal?

Answer 1

EDIT suivant les commentaires:

Il se trouve faire ce travail avec RelativeLayout n'est pas facile. Au bas de la réponse, j'ai inclus un RelativeLayout qui donne l'effet voulu, mais seulement jusqu'à ce qu'il soit inclus dans un ListView. Après cela, les mêmes problèmes que ceux décrits dans la question se sont produits. Cela a été corrigé en utilisant à la place LinearLayout (s).

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:paddingLeft="10dp" 
    android:orientation="horizontal"> 

    <ImageView android:id="@+id/pickImageImage" 
     android:layout_width="100dp" 
     android:layout_height="80dp" 
     android:background="@drawable/icon" 
     android:scaleType="fitXY" 
     android:layout_marginRight="10dp"/> 

    <TextView android:id="@+id/pickImageText" 
     android:layout_height="fill_parent" 
     android:layout_width="fill_parent" 
     android:gravity="left|center_vertical" 
     android:text="I'm the text"/> 

</LinearLayout> 

Si vous voulez avoir deux zones de texte, vous pouvez imbriquer un deuxième orientation="vertical" et LinearLayout après la ImageView puis mettre les zones de texte là-dedans.

Cela fonctionne, mais je dois admettre que je ne sais pas pourquoi les RelativeLayouts n'ont pas. Par exemple, ce blog post by Romain Guy dit spécifiquement que le RelativeLayout devrait. Quand je l'ai essayé, je n'ai jamais eu assez de travail; Certes, je ne l'ai pas fait exactement comme il l'a fait, mais mes seuls changements étaient avec certains attributs des TextViews, ce qui n'aurait pas dû faire une grande différence.

---

voici la réponse originale:

Je pense que vous confondez Android avec toutes ces instructions quelque peu contradictoires dans RelativeLayout. J'ai reformaté votre chose à ceci:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/row" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:padding="10dip"> 

    <ImageView android:id="@+id/item_image" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:paddingRight="10dip" 
     android:src="@drawable/icon" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true"/> 

    <TextView android:id="@+id/item_title" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@id/item_image" 
     android:layout_centerVertical="true" 
     android:text="Blah!"/> 

</RelativeLayout> 

Et cela fonctionne très bien. J'ai supprimé plusieurs de vos android:layout_alignParentxxx redondants car ils n'étaient pas nécessaires. Cette vue vient maintenant avec l'image dans le coin supérieur gauche et le texte verticalement centré à côté de lui. Si vous voulez que l'image soit centrée verticalement, alors vous ne pouvez pas avoir le RelativeLayout sur android: layout_height = "wrap_content" parce qu'il essaie de ne pas se faire plus grand que la hauteur de l'image. Vous devez spécifier une hauteur, par ex. 80dp, puis définissez le ImageView à une hauteur fixe comme 60dp avec android: scaleType = "fitXY" pour l'adapter à l'échelle correctement.

Answer 2

La directive Baseline le ferait, mais ImageView ne prend tout simplement pas en charge l'alignement de la ligne de base à ce jour. Vous pouvez contourner ce problème en créant une sous-classe de ImageView, remplacer la méthode getBaseline() et renvoyer la hauteur de l'image.

Answer 3

était coincé sur une question similaire pendant un certain temps, mais ont trouvé cet CommonsWare de:

« Lorsque vous gonflez la mise en page, utilisez inflate(R.layout.whatever, parent, false), lorsque le parent ListView. »

Fonctionne uniquement lorsque vous définissez la hauteur de la ligne sur une valeur spécifique (c'est-à-dire que vous ne pouvez pas utiliser wrap_content).