Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to add bottom border in relativelayout

Tags:

android

xml

<LinearLayout 
            android:layout_width="fill_parent" android:layout_height="wrap_content"
            android:orientation="vertical" android:background="@drawable/settings_border" android:padding="1dp"
            android:layout_marginLeft="15dip" android:layout_marginRight="15dip" android:layout_marginTop="5dip">
            <RelativeLayout android:id="@+id/map_refresh"
                android:layout_height="fill_parent" android:layout_width="wrap_content" 
                android:background="@drawable/settings_selector_up" 
                android:padding="15dp">
                <TextView android:id="@+id/Text1" 
                    android:layout_height="wrap_content" android:layout_width="wrap_content"
                    android:text="Map refresh period">
                </TextView>
                <TextView android:id="@+id/TextView09" 
                    android:layout_height="wrap_content" android:layout_width="wrap_content"
                    android:text="1 min" 
                    android:layout_alignParentRight="true"
                    android:paddingRight="5dp">
                </TextView>
            </RelativeLayout>

            <RelativeLayout android:id="@+id/own_location" 
                android:layout_height="fill_parent" android:layout_width="wrap_content" 
                android:padding="15dp"
                android:background="@drawable/settings_selector_mid">
                <TextView android:id="@+id/Text1" 
                    android:layout_height="wrap_content" android:layout_width="wrap_content"
                    android:text="Own location update period">
                </TextView>
                <TextView android:id="@+id/TextView09" 
                    android:layout_height="wrap_content" android:layout_width="wrap_content"
                    android:text="1 min" 
                    android:layout_alignParentRight="true"
                    android:paddingRight="5dp">
                </TextView>
            </RelativeLayout>

I want set only bottom border in relativelayout. I want to dispaly listview style but not using listview. Lets say each listitem is relativlayout. I want set only bottom border so its look like a listview's divider.

like image 727
fish40 Avatar asked Nov 30 '11 09:11

fish40


People also ask

How do I add a border in relative layout?

Create a FrameLayout that gets the background color of your border, and a margin or padding of your border width, and place that FrameLayout in your RelativeLayout. Place the TextView in your FrameLayout instead of directly in the RelativeLayout. poof instant border. Show activity on this post.

How do you add a border on Android?

To add a border to Android TextView we need to create an XML containing shape as a rectangle file under the drawable's folder and set it as background to the TextView. <stroke> tag is used to set the border width and color.

What is the difference between RelativeLayout and LinearLayout?

LinearLayout means you can align views one by one (vertically/ horizontally). RelativeLayout means based on relation of views from its parents and other views.


2 Answers

I hope I understood what you said.

in the res folder create a new folder (if you don't already have it) named drawable

there create an xml named "borders.xml"

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
        <gradient android:angle="90" android:centerColor="#6da23f" android:endColor="#8bc45d" android:startColor="#2f481c" />

            <stroke android:width="2dp" android:color="#999999" />

            <padding android:bottom="4dp" android:left="3dp" android:right="3dp" android:top="6dp" />

            <corners android:radius="10px"/>
        </shape>
    </item>
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
            <gradient android:angle="90" android:centerColor="#6da23f" android:endColor="#8bc45d" android:startColor="#4c8a39" />

            <stroke android:width="1dp" android:color="#FFFFFF" />

            <padding android:bottom="4dp" android:left="3dp" android:right="3dp" android:top="6dp" />

            <corners android:radius="10px"/>
        </shape>
    </item>
</selector>

You can further edit it as you like. Then select the layout from the Outline and click Background properties, and select the borders xml that you created.

This will create borders for all 4. Alternatively, you can add a simple

<View android:layout_width="1dip"
    android:layout_height="fill_parent"
    android:background="#FFFFFF" />

line and add it to the bottom of your layout and change the color/size to your liking.

like image 169
OWADVL Avatar answered Oct 05 '22 17:10

OWADVL


For some reason the other solutions didn't work for me - all borders were shown no matter how I changed it. This worked:

<?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="@color/gray" />
            <solid android:color="@color/gray" />
        </shape>
    </item>

    <item android:bottom="1dp">
        <shape
            android:shape="rectangle">
            <stroke android:width="1dp" android:color="@color/white" />
            <solid android:color="@color/white" />

        </shape>
    </item>
</layer-list>

The color of the border is gray and the background is white for the container (LinearLayout in my example). You can simply change the second item to make the border thicker or have border on the top/left/right.

This is how the layout xml looks like:

<LinearLayout
        android:id="@+id/searchWrapper"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="5dp"
        android:paddingBottom="5dp"
        android:background="@drawable/bottom_gray_border"
        android:layout_alignParentTop="true">

        <EditText
            android:id="@+id/searchEditText"
            style="@style/EditTextSearch"
            android:hint="@string/find"
            android:layout_marginLeft="5dp"/>

</LinearLayout> 

I got the idea from here: Is there an easy way to add a border to the top and bottom of an Android View?

like image 21
bentzy Avatar answered Oct 05 '22 16:10

bentzy