Home » Android » Android draw a Horizontal line between views

Android draw a Horizontal line between views

Posted by: admin March 11, 2020 Leave a comment

Questions:

I have My Layout like below:

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

My Requirement is to draw a Horizontal line between TextView and ListView

Could anyone help?

How to&Answers:

It will draw Silver gray colored Line between 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" />

Answer:

You should use the new lightweight View Space to draw dividers.
Your layout will load faster if you will use Space instead of View.

Horizontal divider:

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

Vertical divider:

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

You can also add a background:

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

Usage example:

....
<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"/>
....

In order to use Space you should add the dependency in your build.gradle:

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

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

Answer:

add something like this in your layout between the views you want to separate:

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

Hope it helps 🙂

Answer:

Creating it once and using it wherever needed is a good idea.
Add this in your 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>

and add this in your xml code, where a line divider is needed:

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

Originally answered by toddles_fp to this question: Android Drawing Separator/Divider Line in Layout?

Answer:

Try this

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

Answer:

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

Answer:

You can put this view between your views to imitate the line

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

Answer:

In each parent LinearLayout for which you want dividers between components, add android:divider="?android:dividerHorizontal" or android:divider="?android:dividerVertical.

Choose appropriate between them as per orientation of your LinearLayout.

Till I know, this resource style is added from Android 4.3.

Answer:

Try this

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

Answer:

Try this works for me

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

Answer:

A View whose background color you can specify would do (height=a few dpi).
Looked in real code and here it is:

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

Note that it may be any kind of View.

Answer:

—-> Simple one

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

Answer:

If you does not want to use an extra view just for underlines. Add this style on your textView.

style="?android:listSeparatorTextViewStyle"

Just down side is it will add extra properties like

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

which you can easily override.