Android Zeichnungstrenner / Trennlinie im Layout?

684

Ich möchte eine Linie genau in der Mitte eines Layouts zeichnen und sie als Trennzeichen für andere Elemente wie TextView verwenden. Gibt es dafür ein gutes Widget? Ich möchte ein Bild nicht wirklich verwenden, da es schwierig wäre, die anderen Komponenten darauf abzustimmen. Und ich möchte, dass es auch relativ positioniert ist. Vielen Dank

Androider
quelle

Antworten:

1684

Normalerweise benutze ich diesen Code, um eine horizontale Linie hinzuzufügen:

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

Um ein vertikales Trennzeichen hinzuzufügen, wechseln Sie die Werte layout_widthundlayout_height

Alex Kucherenko
quelle
10
Funktioniert auch bei mir. Kann auch android hinzufügen: layout_marginTop = "2dp" (etc), um Leerzeichen oben und unten hinzuzufügen.
Prise
4
Dies ist ideal für eine einfache horizontale Linie. Wenn Sie jedoch möchten, dass die Farbe an den Enden verblasst, verwenden Sie hier eine der anderen Methoden.
Scott Biggs
91
Oder noch besser, verwenden Sielayout_height="2dp" and android:background="?android:attr/listDivider"
Dan Dar3
17
Sie sollten px anstelle von dp für Teiler verwenden. Es sei denn, Sie möchten tatsächlich, dass die Teilergröße variiert und möglicherweise unter 1/2 Pixel fällt. :)
Austin Hanson
9
Die Materialdesignspezifikation empfiehlt die Verwendung von 1 dp dickem google.com/design/spec/components/dividers.html#dividers-specs
Alex Kucherenko
620

Verbesserung der Antworten von Alex Kucherenko und Dan Dar3

Ich habe dies zu meinen Stilen hinzugefügt:

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

Dann ist in meinen Layouts weniger Code und einfacher zu lesen.

<View style="@style/Divider"/>
toddles_fp
quelle
40
Das ist großartig und meiner Meinung nach die beste Lösung! Auf diese Weise müssen Sie die Farbe nicht manuell einstellen, sodass die Konsistenz einfacher ist, wenn Sie mehr als ein Thema haben (ich verwende Theme.Sherlock und Theme.Sherlock.Light).
Kopfgeldjaeger
2
+1 - Ein großartiger Ersatz für die 9-Zeilen-Lösung <Image>, die ich bisher verwendet habe. Sehr ... stilvoll
AVIDeveloper
3
Dies scheint die sauberste Lösung zu sein. Vielen Dank!
FrozenCow
2
Dies scheint zu funktionieren, aber in der Android Studio-Vorschau mit API 21 wird es nicht angezeigt ... Ich konnte nicht testen, ob dies nur ein Problem der Vorschau oder auch auf realen Geräten ist ...
DominicM
3
Ich dachte, es wird nicht auch in der Android Studio-Vorschau angezeigt, aber nachdem ich die Vorschau vergrößert habe, kann ich die schwache Linie erkennen, die angezeigt wird.
Nick Spacek
136

Fügen Sie dies in Ihr Layout ein, in dem Sie den Teiler haben möchten (ändern Sie die Attribute entsprechend Ihren Anforderungen):

<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@android:drawable/divider_horizontal_dark"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:scaleType="fitXY"
    android:paddingLeft="5dp"
    android:paddingRight="5dp"
    android:paddingBottom="2dp"
    android:paddingTop="2dp" />
Camille Sévigny
quelle
1
Danke, hat für mich gearbeitet. Sieht besonders gut aus in DrawerLayout
Martin Vysny
4
@Ahmed Sie können dies nicht verwenden, wenn Sie einen weißen Aktivitätshintergrund haben. In diesem Fall verwenden Sie stattdessen android: src = "@ android: drawable / divider_horizontal_bright".
Romanos
96

Sie können dies verwenden in LinearLayout:

android:divider="?android:dividerHorizontal"
android:showDividers="middle"

Zum Beispiel:

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

        <TextView 
         android:layout_height="wrap_content"
         android:layout_width="wrap_content"
         android:text="abcd gttff hthjj ssrt guj"/>

        <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="abcd"/>
        <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="abcd gttff hthjj ssrt guj"/>

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

</LinearLayout>
user2240225
quelle
4
Beachten Sie, dass dies nur von API Level 11
San
Leider hebt diese Methode die Teiler nicht mit kräftigen Farben hervor.
Das Original Android
weniger ist besser! Thanx
pablo.vix
60

Einfachster Weg:

Vertikaler Teiler:

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

Vertikale Teileransicht

Horizontaler Teiler:

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

Horizontale Teileransicht

Das ist alles ja!

Gib das einfach ein res>values>styles.xml

<style name="Divider">
    <item name="android:background">?android:attr/listDivider</item> //you can give your color here. that will change all divider color in your app.
</style>

<style name="Divider.Horizontal" parent="Divider">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">1dp</item> // You can change thickness here.

</style>

<style name="Divider.Vertical" parent="Divider">
    <item name="android:layout_width">1dp</item>
    <item name="android:layout_height">match_parent</item>
</style>
Khemraj
quelle
Dies überlappt das Ganze mit einer Ansicht.
ChumiestBucket
56
<TextView
    android:id="@+id/line"
    style="?android:attr/listSeparatorTextViewStyle"
    android:paddingTop="5dip"
    android:gravity="center_horizontal"
    android:layout_below="@+id/connect_help"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000" />
pprados
quelle
1
Ich würde diese Methode mehr verteidigen als andere, weil sie einen bereits existierenden Stil verwendet, aber es könnte nicht jedem gefallen.
Magnet
3
Der Nachteil dieses Ansatzes ist jedoch, dass schlechtes Android NICHT den vorhandenen Stil garantiert.
Youngjae
46

Verwenden Sie diesen Code. Es wird helfen

<LinearLayout
    android:layout_width="0dip"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:layout_weight="1"
    android:divider="?android:dividerHorizontal"
    android:gravity="center"
    android:orientation="vertical"
    android:showDividers="middle" >
Deepak Goel
quelle
20

Schreiben Sie einfach Folgendes:

 android:divider="?android:dividerHorizontal"
 android:showDividers="middle"

vollständiges Beispiel:

<LinearLayout
        android:id="@+id/llTipInformation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tvServiceRating"
        android:orientation="horizontal"
        android:divider="?android:dividerHorizontal"
        android:layout_marginTop="@dimen/activity_horizontal_margin"
        android:showDividers="middle">

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/main.msg.tippercent"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/colorWhite"
            android:layout_marginTop="@dimen/activity_vertical_margin"/>
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/main.msg.tiptotal"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/colorWhite"
            android:layout_marginTop="@dimen/activity_vertical_margin"/>

</LinearLayout>
Farid Ahmed
quelle
1
Dies sollte als Antwort akzeptiert werden, da dies die korrekteste Methode ist, um einen Teiler zu einemLinearLayout
JaydeepW
Dies gilt für alle Elemente im Layout ,, corrent?
Rami Alloush
20
<View
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:layout_marginTop="4dp"
            android:background="@android:color/darker_gray" />

Zwischen zwei Layouts Geben Sie diesen Code ein, um Divider zu erhalten.

SHASHWAT DOSHI
quelle
18

Wenn Sie actionBarSherlock verwenden, können Sie die Klasse com.actionbarsherlock.internal.widget.IcsLinearLayout verwenden, um Teiler zu unterstützen und sie zwischen den Ansichten anzuzeigen .

Anwendungsbeispiel:

<com.actionbarsherlock.internal.widget.IcsLinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:divider="@drawable/divider"
    android:dividerPadding="10dp"
    android:orientation="vertical"
    android:showDividers="beginning|middle|end" >
... children...

res / drawable / divider.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <size android:height="2dip" />

    <solid android:color="#FFff0000" />

</shape>

Beachten Sie, dass in der Vorschau des Grafikdesigners aus irgendeinem Grund "android.graphics.bitmap_delegate.nativeRecycle (I) Z" steht. Ich bin mir nicht sicher, was es bedeutet, aber es kann ignoriert werden, da es sowohl auf neuen als auch auf alten Android-Versionen (getestet auf Android 4.2 und 2.3) einwandfrei funktioniert.

Anscheinend wird der Fehler nur angezeigt, wenn API17 für den Grafikdesigner verwendet wird.

Android-Entwickler
quelle
12

Hinzufügen dieser Ansicht; das zieht ein Trennzeichen zwischen Ihremtextviews

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000000" />
elfekz
quelle
12

Es ist sehr einfach. Erstellen Sie einfach eine Ansicht mit der schwarzen Hintergrundfarbe.

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000"/>

Dadurch wird eine horizontale Linie mit Hintergrundfarbe erstellt. Sie können wie in jeder anderen Ansicht auch andere Attribute wie Ränder, Auffüllungen usw. hinzufügen.

Wijay Sharma
quelle
11

Hier ist Ihre Antwort ... dies ist ein Beispiel, um eine Grenze zwischen Steuerelementen zu ziehen ...

<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="fill_parent"
             android:layout_height="2dp"
             android:background="#d13033"/>

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

Dieser Code zieht eine Linie zwischen zwei Steuerelementen ...

Archan Desai
quelle
10

Es fügt an einer beliebigen Stelle in Ihrem Layout einen horizontalen Teiler hinzu.

    <TextView
       style="?android:listSeparatorTextViewStyle"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"/>
Kamel
quelle
Die Zeile wird nur unter der Textansicht angezeigt.
Live-Liebe
10

Sie können dieses <View>Element direkt nach der ersten Textansicht verwenden.

 <View
         android:layout_marginTop="@dimen/d10dp"
         android:id="@+id/view1"
         android:layout_width="fill_parent"
         android:layout_height="1dp"
         android:background="#c0c0c0"/>
Yogesh Sarvaiya
quelle
8

Laufzeitversion:

View dividerView = new View(getContext());
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(
    ViewGroup.LayoutParams.FILL_PARENT, UIUtils.dpToPix(getContext(), 1));
dividerView.setLayoutParams(lp);

TypedArray array = getContext().getTheme()
    .obtainStyledAttributes(new int[] {android.R.attr.listDivider});
Drawable draw = array.getDrawable(0);       
array.recycle();

dividerView.setBackgroundDrawable(draw);
mParentLayout.addView(dividerView);
alcsan
quelle
7

Verwenden Sie diesen XML-Code, um eine vertikale Linie hinzuzufügen

 <View
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:layout_centerVertical="true"
    android:background="#000000" />

Verwenden Sie diesen XML-Code, um eine horizontale Linie hinzuzufügen

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000000" />
Maksudul Hasan Raju
quelle
6
//for vertical line:

<View
   android:layout_width="1dp"
   android:layout_height="fill_parent"
   android:background="#00000000" />




//for horizontal line: 

<View
   android:layout_width="fill_parent"
   android:layout_height="1dp"
   android:background="#00000000" />
//it works like a charm
Traumentwickler
quelle
6

In Fällen, in denen beispielsweise android:layout_weightEigenschaften verwendet werden, um Layoutkomponenten verfügbaren Bildschirmbereich zuzuweisen

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
    </LinearLayout>

     /* And we want to add a verical separator here */

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
     </LinearLayout>

</LinearLayout>

Um ein Trennzeichen zwischen den beiden vorhandenen Layouts hinzuzufügen, das bereits den gesamten Bildschirmbereich belegt hat, können wir nicht einfach ein weiteres LinearLayout hinzufügen, android:weight:"1"da dadurch drei Spalten gleicher Breite erstellt werden, die wir nicht möchten. Stattdessen werden wir den Platz verringern, den wir diesem neuen Layout geben werden. Der endgültige Code würde folgendermaßen aussehen:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
    </LinearLayout>

                    /* *************** ********************** */

    /* Add another LinearLayout with android:layout_weight="0.01" and 
       android:background="#your_choice" */
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.01"
        android:background="@android:color/darker_gray"
     />

    /* Or View can be used */
    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_marginTop="16dp"
        android:background="@android:color/darker_gray"
     />

                     /* *************** ********************** */

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
    </LinearLayout>

</LinearLayout>

Geben Sie hier die Bildbeschreibung ein

Cyclotron3x3
quelle
5

Wenn Sie es häufig verwenden, ist es am besten, es zu tun

styles.xml:

<style name="Seperator">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">1dp</item>
        <item name="android:background">@color/light_color</item>
    </style>

Fügen Sie es jetzt in Ihrem Layout wie folgt hinzu:

<View style="@style/Seperator" />
Irshu
quelle
4
<ImageView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="2dp"
    android:paddingLeft="5dp"
    android:paddingRight="5dp"
    android:paddingTop="2dp"
    android:scaleType="fitXY"
    android:src="?android:attr/listDivider" />
code511788465541441
quelle
ohne android: src = "? android: attr / listDivider" .... füge einfach android: background = "# FFFFFF" hinzu
bebosh
4

Fügen Sie eine horizontale schwarze Linie hinzu, indem Sie Folgendes verwenden:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000000"
    android:layout_marginTop="10dp"/>
Jyoti Sharma
quelle
3

Um die Antwort von Camille Sévigny zu vervollständigen, können Sie zusätzlich Ihre eigene Linienform definieren, um beispielsweise die Linienfarbe anzupassen.

Definieren Sie eine XML-Form im Zeichenverzeichnis. line_horizontal.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto" android:shape="line">
    <stroke android:width="2dp" android:color="@android:color/holo_blue_dark" />
    <size android:width="5dp" />
</shape>

Verwenden Sie diese Zeile in Ihrem Layout mit den gewünschten Attributen:

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="2dp"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:paddingTop="2dp"
        android:src="@drawable/line_horizontal" />
LG
quelle
3

Normalerweise benutze ich diesen Code:

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:layout_alignParentLeft="true"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginTop="10dp"
    android:background="#aa000000" />

Wenn Sie ein Objekt in Ihrem Layout haben und eine Zeile darunter festlegen möchten, verwenden Sie dieses Attribut in ImageView:

android:layout_below="@+id/textBox1"
Hossein
quelle
3

Dies würde Ihnen helfen, dieses Problem zu lösen. Hier wird eine kleine Ansicht erstellt, um eine schwarze Linie als Trennzeichen zwischen zwei Ansichten zu erstellen.

 <View
        android:layout_width="3dp"
        android:layout_height="wrap_content"
        android:background="@android:color/black"
         />
Mayank Garg
quelle
2
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<item
    android:bottom="0dp"
    android:left="-2dp"
    android:right="-2dp"
    android:top="-2dp">
    <shape android:shape="rectangle">
        <stroke
            android:width="1dp"
            android:color="@color/divider" />
    </shape>
</item>

FAHAD HAMMAD ALOTAIBI
quelle
2

Hier ist der Code "eine horizontale Trennlinie zwischen zwei Textansichten". Versuche dies

    <TextView
        android:id="@id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="5dp"
        android:inputType="textPersonName"
        android:text:"address" />


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


    <TextView
        android:id="@id/textView7"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPersonName" 
        android:text:"Upload File" />/>
Sunil
quelle
1

Teilen Sie den Raum in zwei gleiche Teile:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:divider="?android:dividerHorizontal"
        android:showDividers="end"></LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"></LinearLayout>

</LinearLayout>

Beachten Sie, dass ein Teil am Ende einen Teiler enthält

Dan Alboteanu
quelle
1

Einfache Lösung

Fügen Sie einfach diesen Code in Ihr Layout ein und ersetzen Sie 'Id_of__view_present_above' durch die ID der Ansicht, unter der Sie den Teiler benötigen.

<TextView
  android:layout_width="match_parent"
  android:layout_height="1dp"
  android:background="#c0c0c0"
  android:id="@+id/your_id"
  android:layout_marginTop="16dp" 
  android:layout_below="@+id/Id_of__view_present_above"
/>
Shreedhar Bhat
quelle
3
stackoverflow.com/help/how-to-answer Suchen Sie nach- >Brevity is acceptable, but fuller explanations are better.
Andy K
0

Wenn Sie beispielsweise recyclerView für Ihre Artikel verwendet haben:

in build.gradle schreibe:

dependencies {
    compile 'com.yqritc:recyclerview-flexibledivider:1.4.0'

Wenn Sie Farb-, Größen- und Randwerte festlegen möchten, können Sie Folgendes angeben:

RecyclerView recyclerView = (RecyclerView) 
findViewById(R.id.recyclerview);
recyclerView.addItemDecoration(
        new HorizontalDividerItemDecoration.Builder(this)
                .color(Color.RED)
                .sizeResId(R.dimen.divider)
                .marginResId(R.dimen.leftmargin, R.dimen.rightmargin)
                .build());
Morozov
quelle