how to set border linear layout on top and bottom

Question

<?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:background="#ffffff"
    android:orientation="vertical" >

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

        <LinearLayout
            android:id="@+id/home"
            android:layout_width="match_parent"
            android:layout_height="60dip"
            android:layout_marginRight="5dip"
            android:src="@anim/linearsavelocationbackground"
            android:weightSum="1" >

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="30dip"
                android:layout_height="30dip"
                android:layout_marginTop="15dip"
                android:layout_weight=".2"
                android:src="@drawable/homestatus" />

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="17dp"
                android:layout_weight=".6"
                android:gravity="center_vertical"
                android:paddingLeft="10dp"
                android:text="Home"
                android:textColor="#3a3838"
                android:textSize="15dp"
                android:textStyle="bold" />

            <ImageView
                android:id="@+id/homeimage"
                android:layout_width="30dip"
                android:layout_height="30dip"
                android:layout_marginRight="5dip"
                android:layout_marginTop="15dp"
                android:layout_weight="0.20"
                android:src="@drawable/deletingright" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/office"
            android:layout_width="match_parent"
            android:layout_height="60dip"
            android:layout_marginRight="5dip"
            android:background="#ffffff"
            android:src="@anim/linearsavelocationbackground"
            android:weightSum="1" >

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="30dip"
                android:layout_height="30dip"
                android:layout_marginTop="15dip"
                android:layout_weight=".2"
                android:src="@drawable/work" />

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="17dp"
                android:layout_weight=".6"
                android:gravity="center_vertical"
                android:paddingLeft="10dp"
                android:text="Home"
                android:textColor="#3a3838"
                android:textSize="15dp"
                android:textStyle="bold" />

            <ImageView
                android:id="@+id/homeimage"
                android:layout_width="30dip"
                android:layout_height="30dip"
                android:layout_marginRight="5dip"
                android:layout_marginTop="15dp"
                android:layout_weight="0.20"
                android:src="@drawable/deletingright" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

bacground for border

<?xml version="1.0" encoding="UTF-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
   <corners android:radius="20dp"/> 
   <padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
   <solid android:color="#CCCCCC"/>
 </shape>

This is my code i am trying to display border top and bottom on Linarlayout but i am unable to show effect i have to set border top and bottom of home Linear Layout and office linear layout i am tried to set that but effect is not coming please check where am doing mistake.

why do You have set this inside the anim folder? it has to be a drawable inside the drawable folder... — Opiatefuchs, Jan 19 '15 at 07:06

score 7 · Accepted Answer · answered Jan 19 '15 at 07:06

7

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

<item
    android:bottom="1dp"
    android:left="-2dp"
    android:right="-2dp"
    android:top="1dp">
    <shape android:shape="rectangle" >
        <stroke
            android:width="1dp"
            android:color="@android:color/darker_gray" />

        <solid android:color="@android:color/transparent" />

        <padding
            android:bottom="10dp"
            android:left="10dp"
            android:right="10dp"
            android:top="10dp" />
    </shape>
</item>

Use the above layout as backgroud border. It will give you a very good effect. change the color and padding if you wish. Add this as xml in your drawable folder and make this drawable as background for the layout.

Hope this helps.

answered Jan 19 '15 at 07:06

Vilas

1,695
1
13
13

effect is not coming i have called same thing – Edge Jan 19 '15 at 07:11
How you are using this? – Vilas Jan 19 '15 at 07:14
It's giving me unexpected end of file – Moeez May 18 '21 at 11:53
unexpected end of file just needs closing tag for layer-list after – publicknowledge Sep 20 '22 at 08:49

score 4 · Answer 2 · answered Jan 19 '15 at 07:35

This can be done using an LayerList

Create a drawable name border_top_bottom.xml

<item>
    <shape android:shape="rectangle" >
        <solid android:color="@color/your_border_color" />
    </shape>
</item>
<item
    android:top="1dp"
    android:bottom="1dp">
    <shape android:shape="rectangle" >
        <solid android:color="@color/your_fill_color" />
    </shape>
</item>

On LinearLayout background property use

andorid:background:"@drawable/border_top_bottom.xml"

score 0 · Answer 3 · edited Jan 19 '15 at 07:07

Add a xml in your drawable with the following code & then assign this xml as your linear layout background

<?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
        <item>
          <shape 
            android:shape="rectangle">
                <stroke android:width="1dp" android:color="#FF000000" />
                <solid android:color="#FFDDDDDD" />
            </shape>
       </item>
       <item android:top="1dp" android:bottom="1dp"> 
          <shape 
            android:shape="rectangle">
                <stroke android:width="1dp" android:color="#000" />
                <solid android:color="#FFFFFF" />
            </shape>
       </item>
    </layer-list>

score 0 · Answer 4 · answered Jan 19 '15 at 07:14

I think Your problem is not Your shape, it is how You referred it inside the layout:

         <LinearLayout
        android:id="@+id/home"
        android:layout_width="match_parent"
        android:layout_height="60dip"
        android:layout_marginRight="5dip"
        android:src="@anim/linearsavelocationbackground"
        android:weightSum="1" >

You had set the reference to the anim folder, but it has to be in the drawable folder. If Your shape is inside the anim folder, put it into drawable folder and correct Your LinearLayouts src attribute:

       android:src="@drawable/linearsavelocationbackground"

And then if this is not what you want, create a shape with the examples from krunal and EagleEye.

its working now but in Bottom side its not coming here is my whole Xml and i tried to set inBoth linear layout its coming like this XML: http://paste.ofcode.org/NzVwcK7M6Cpb5eiFntVugn Image: http://snag.gy/si12m.jpg coming like this while i want like this http://snag.gy/iYnXM.jpg — Edge, Jan 19 '15 at 07:25
You have no orientation set on Your LinearLayouts, do this and check the result.... — Opiatefuchs, Jan 19 '15 at 07:42

score 0 · Answer 5 · answered Jan 19 '15 at 07:19

@Edge Please use this code Let's say name of the xml file linearbg.xml and put it in drawable folder under resources.

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

    <item>
        <shape>
            <solid android:color="#EEEEEE" />
        </shape>
    </item>

    <!-- This is the line -->
    <item
        android:top="1dp"
        android:bottom="1dp">
        <shape>
            <solid android:color="#FFFFFF" />
        </shape>
    </item>

</layer-list>

Now use this linearbg.xml as background in your linear layout as android:background="@drawable/linearbg".

how to set border linear layout on top and bottom

5 Answers5