Android trace une ligne horizontale entre les vues


105

J'ai ma disposition comme ci-dessous:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

<TextView
        android:id="@+id/textView1"
        style="@style/behindMenuItemLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="Twitter Feeds"
        android:textStyle="bold" />

    <ListView
        android:id="@+id/list"
        android:layout_width="350dp"
        android:layout_height="50dp" />

    <TextView
        android:id="@+id/textView1"
        style="@style/behindMenuItemLabel1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="1dp"
        android:text="FaceBook Feeds" />

    <ListView
        android:id="@+id/list1"
        android:layout_width="350dp"
        android:layout_height="50dp" />

</LinearLayout>

Ma condition est de tracer une ligne horizontale entre TextViewetListView

Quelqu'un pourrait-il aider?


Vous pouvez ajouter une ligne à l'arrière-plan des vues existantes et ne pas en ajouter une supplémentaire. Ou vous pouvez mettre toutes vos vues dans listView. listView peut dessiner des séparateurs. Le moyen le plus simple est d'ajouter une vue supplémentaire.
Leonidos

Réponses:


285

Il dessinera une ligne de couleur gris argenté entre TextView&ListView

<TextView
    android:id="@+id/textView1"
    style="@style/behindMenuItemLabel1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="1dp"
    android:text="FaceBook Feeds" />

<View
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="#c0c0c0"/>

<ListView
    android:id="@+id/list1"
    android:layout_width="350dp"
    android:layout_height="50dp" />

10
Cette couleur codée en dur revient à utiliser le CSS en ligne dans une page Web. Pourquoi est-ce si voté? Il doit utiliser android: background = "? Android: attr / dividerHorizontal" par exemple.
Roel

4
Parce que c'est facile à mettre en œuvre
Denny

1
@Roel C'est simple, facile et ça marche. Et il est simple de référencer une couleur au lieu de la coder en dur. J'ai essayé votre suggestion, qui, je pense, serait techniquement meilleure, mais elle n'a pas semblé fonctionner - je n'ai pas eu de diviseurs dans mes mises en page. Comment dois-je l'utiliser? Je vous remercie.
nsandersen le

23

Vous devez utiliser la nouvelle vue légère Spacepour dessiner des séparateurs. Votre mise en page se chargera plus rapidement si vous utilisez à la Spaceplace de View.

Séparateur horizontal:

<android.support.v4.widget.Space
        android:layout_height="1dp"
        android:layout_width="match_parent" /> 

Diviseur vertical:

<android.support.v4.widget.Space
        android:layout_height="match_parent"
        android:layout_width="1dp" />

Vous pouvez également ajouter un arrière-plan:

<android.support.v4.widget.Space
        android:layout_height="match_parent"
        android:layout_width="1dp"
        android:background="?android:attr/listDivider"/>

Exemple d'utilisation:

....
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="One"/>

<android.support.v4.widget.Space
    android:layout_height="match_parent"
    android:layout_width="1dp"
    android:background="?android:attr/listDivider"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Two"/>

<android.support.v4.widget.Space
    android:layout_height="match_parent"
    android:layout_width="1dp"
    android:background="?android:attr/listDivider"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Three"/>
....

Pour l'utiliser, Spacevous devez ajouter la dépendance dans votre build.gradle :

dependencies {
    compile 'com.android.support:support-v4:22.1.+'
}

Documentation https://developer.android.com/reference/android/support/v4/widget/Space.html


11
L'utilisation de Spaceva être décevante car Spacene dessine rien (pas même un arrière-plan). Son seul travail est de prendre de la place sur l'écran. La solution est d'utiliser un Viewélément vanille à la place. Ensuite, l'arrière-plan sera dessiné comme vous le souhaitez. (Vous pouvez également éviter la dépendance de la bibliothèque de support si ce n'est pas nécessaire.)
Ted Hopp

6
Spacehérite de Viewet donc hérite de tous les attributs définis par View. (De même, LinearLayouthérite de l' textAlignmentattribut même s'il n'affiche lui-même aucun texte.) N'hésitez pas à le tester par vous-même (ou regardez simplement le code source) et vous constaterez que a Spaceignore tous les attributs liés au dessin.
Ted Hopp du

Oui, Spacene dessine pas de fond, c'est transparent.
vovahost

21

ajoutez quelque chose comme ceci dans votre mise en page entre les vues que vous souhaitez séparer:

  <View
       android:id="@+id/SplitLine_hor1"
       android:layout_width="match_parent"
       android:layout_height= "2dp"
       android:background="@color/gray" />

J'espère que ça aide :)


2
Il dessinera une ligne verticale car sa hauteur est match_parent et sa largeur n'est que de 2 dp.
Bhoomika Brahmbhatt

14

Le créer une fois et l'utiliser là où c'est nécessaire est une bonne idée. Ajoutez ceci dans votre styles.xml:

<style name="Divider">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">1dp</item>
    <item name="android:background">?android:attr/listDivider</item>
</style>

et ajoutez ceci dans votre code xml, où un séparateur de ligne est nécessaire:

<View style="@style/Divider"/>

À l'origine répondu par toddles_fp à cette question: Android Drawing Separator / Divider Line in Layout?


9

Essaye ça

<View
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="?android:attr/listDivider"/>

6
<View
       android:id="@+id/view"
       android:layout_width="match_parent"
       android:layout_height="2dp"
       android:background="#000000" />

ne pouvons-nous pas accéder à cet élément par programme?
gumuruh

2

Vous pouvez mettre cette vue entre vos vues pour imiter la ligne

<View
  android:layout_width="fill_parent"
  android:layout_height="2dp"
  android:background="#c0c0c0"/>

2

Essayez cela fonctionne pour moi

 <View android:layout_width="1dp"
       android:layout_height="match_parent"
       android:background="@color/tw_composer" />

1

Dans chaque parent LinearLayoutpour lequel vous souhaitez des séparateurs entre les composants, ajoutez android:divider="?android:dividerHorizontal"ou android:divider="?android:dividerVertical.

Choisissez entre eux selon l'orientation de votre LinearLayout.

Jusqu'à ce que je sache, ce style de ressource est ajouté à partir d'Android 4.3.


1

Essaye ça

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@android:color/darker_gray"/>

0

Une vue dont vous pouvez spécifier la couleur de fond ferait l'affaire (hauteur = quelques dpi). Regardé dans le vrai code et le voici:

        <LinearLayout
            android:id="@+id/lineA"
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:background="#000000" />

Notez qu'il peut s'agir de n'importe quel type de fichier View.


0

----> Simple

 <TextView
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#c0c0c0"
    android:id="@+id/your_id"
    android:layout_marginTop="160dp" />

0

Si vous ne souhaitez pas utiliser une vue supplémentaire uniquement pour les soulignements. Ajoutez ce style à votre textView.

style="?android:listSeparatorTextViewStyle"

Le seul inconvénient est qu'il ajoutera des propriétés supplémentaires telles que

android:textStyle="bold"
android:textAllCaps="true"

que vous pouvez facilement remplacer.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.