67 votes

Deux TextViews côte à côte, un seul à ellipsiser?

Je veux avoir deux TextView éléments apparaissent côte à côte (dans un élément de liste), celui qui est aligné à gauche, un à droite. Quelque chose comme:

|<TextView>               <TextView>|

( | représentent l'écran que les extrémités)

Cependant, l' TextView sur la gauche peut avoir un contenu qui est trop long pour tenir sur l'écran. Dans ce cas, je veux l'avoir ellipsize mais encore de montrer l'ensemble du droit TextView. Quelque chose comme:

|This is a lot of conte...<TextView>|

J'ai eu de nombreuses tentatives à ce, à l'aide d' LinearLayout et RelativeLayout, et la seule solution que j'ai est d'utiliser un RelativeLayout et de mettre un marginRight sur le gauche TextView assez grande pour effacer le droit TextView. Comme vous pouvez l'imaginer, cependant, ce n'est pas optimal.

Existe-il d'autres solutions?

Final, LinearLayout solution:

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    >
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:ellipsize="end"
        android:inputType="text"
        />
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="0"
        android:layout_gravity="right"
        android:inputType="text"
        />
</LinearLayout>

Vieux, TableLayout solution:

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="1"
    android:shrinkColumns="0"
    >
    <TableRow>
        <TextView android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:singleLine="true"
            />
        <TextView android:id="@+id/date"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:singleLine="true"
            android:ellipsize="none"
            android:gravity="right"
            />
    </TableRow>
</TableLayout>

20voto

capecrawler Points 10454

Juste une idée, pourquoi ne pas vous déclarer en premier dans le fichier xml du layout le textview sur la droite et définir sa largeur que l'envelopper de contenu, android:layout_alignParentRight="true" et android:gravity="right". Ensuite déclarer le textview sur la gauche, sa largeur de combler parent, android:layout__toLeftOf={id de la textview sur le droit} ayant RelativeView que la vue racine.

En déclarant d'abord le droit textview, sa largeur sera calculé de la première et occupent la vue alors que le textview sur la gauche pour occuper l'espace restant de la vue.

Je n'ai pas encore essayé, mais il peut vous donner une idée.

[Mise à jour]

J'ai essayé de créer une ressource xml de mise en page... et il fonctionne en quelque sorte...

<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">
  <TextView 
    android:id="@+id/right"
    android:layout_alignParentRight="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="right"
    android:text="right"
    >
  </TextView>
  <TextView 
    android:id="@+id/left"
    android:layout_alignParentLeft="true"
    android:layout_toLeftOf="@id/right"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:ellipsize="end"
    android:lines="1"
    android:singleLine="true"
    android:maxLines="1"
    android:text="too looooooooooong ofskgjo sdogj sdkogjdfgds dskjgdsko jgleft"
    >
  </TextView>
</RelativeLayout>

17voto

davenpcj Points 3424

Le LinearLayout réponse a fonctionné pour moi avec ce même problème. Posté comme une réponse distincte parce qu'il n'était pas clair ce qui a fait et ne fonctionne pas pour le demandeur.

Une différence. TableLayout était moins idéal pour moi parce que j'avais deux lignes de données, et je voulais la rangée du bas pour se comporter comme cette question décrit, et la rangée du haut pour couvrir la zone. Cette question a été répondu dans l'autre DONC, la question: Colspan dans TableLayout, mais LinearLayout était plus simple.

Si obtenir les largeurs de droit a pris un peu de moi. J'ai inclus les android peluches tweak de l'utilisation de 0dp de la largeur sur la mise à l'échelle de l'élément de performance.

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    >
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:ellipsize="end"
        android:inputType="text"
        />
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="0"
        android:layout_gravity="right"
        android:inputType="text"
        />
</LinearLayout>

15voto

ud_an Points 2875

UTILISER tablelayout et mettre les deux zones de texte dans la rangée du tableau est à essayer. je n'ai pas essayé

0voto

Maragues Points 9461

Pourquoi ne mettez-vous pas une marge de gauche sur le TextView de droite? J'utilise cette approche pour un

 |<TextView>       <ImageButton>|
 

et il fonctionne.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X