allDroid
allDroid

Reputation: 415

How to give only bottom border to RelativeLayout in Android

I have created a relative layout in which it requires only bottom border. How can I do that? Below is the RelativeLayout that I have used.

I have added view inside relative layout but it shows at bottom of screen

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

<TextView
    android:id="@+id/auth_lbl_register_text"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:background="#EAEAEA"
    android:clickable="true"
    android:ellipsize="none"
    android:fontFamily="FNB Sans"
    android:gravity="left"
    android:maxLines="50"
    android:paddingBottom="10dp"
    android:paddingRight="10dp"
    android:paddingTop="10dp"
    android:scrollHorizontally="false"
    android:text="@string/auth_into"
    android:textColor="@color/labelColor"
    android:textSize="20sp" />

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="50dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:background="@drawable/border"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/cellnum_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:fontFamily="FNB Sans"
        android:text="@string/cell_num_label"
        android:textColor="@color/labelColor"
        android:textSize="15sp" />

    <EditText
        android:id="@+id/auth_txt_msisdn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginLeft="25dp"
        android:layout_toRightOf="@+id/cellnum_text"
        android:ellipsize="start"
        android:ems="10"
        android:gravity="center_horizontal"
        android:hint="Enter cell number"
        android:inputType="number"
        android:singleLine="true"
        android:textSize="15sp" />
</RelativeLayout>

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingLeft="5sp"
    android:paddingRight="5sp" >

    <CheckBox
        android:id="@+id/auth_cbx_agree_terms"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="10dp"
        android:button="@drawable/check_box"
        android:clickable="true"
        android:ellipsize="none"
        android:fontFamily="FNB Sans"
        android:gravity="left"
        android:maxLines="50"
        android:paddingLeft="10dp"
        android:paddingStart="30dp"
        android:scrollHorizontally="false"
        android:text="@string/auth_agree_terms"
        android:textColor="@color/labelColor"
        android:textSize="20sp" />
</RelativeLayout>

<!-- next -->

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/auth_cmd_validate"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_weight="0.9"
        android:background="#F49B00"
        android:gravity="center"
        android:paddingLeft="0dp"
        android:text="Next"
        android:textColor="@color/labelColor"
        android:textSize="20dp"
        android:textStyle="normal" />

    <ImageView
        android:layout_width="40dp"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:src="@drawable/next_arrow_white" />
</RelativeLayout>

<!-- end of next -->

<TextView
    android:id="@+id/or_text"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="5dp"
    android:layout_marginTop="5dp"
    android:background="#EAEAEA"
    android:clickable="false"
    android:fontFamily="FNB Sans"
    android:gravity="center"
    android:padding="10sp"
    android:text="OR"
    android:textColor="@color/labelColor"
    android:textSize="20sp" />

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/auth_cmd_register"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_weight="0.9"
        android:background="@color/white"
        android:gravity="center"
        android:paddingLeft="0dp"
        android:text="Register Online"
        android:textColor="@color/labelColor"
        android:textSize="20dp"
        android:textStyle="normal" />

    <ImageView
        android:id="@+id/imgArrowRight"
        android:layout_width="40dp"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:gravity="center"
        android:src="@drawable/line_arrow" />

    <View
        android:id="@+id/view"
        android:layout_width="fill_parent"
        android:layout_height="2dp"
        android:layout_alignParentBottom="true"
        android:background="@color/black" />
</RelativeLayout>

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/auth_cmd_terms"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_weight="0.9"
        android:background="#ffffff"
        android:gravity="center"
        android:paddingLeft="0dp"
        android:text="Terms and Condition"
        android:textColor="@color/labelColor"
        android:textSize="20dp"
        android:textStyle="normal" />

    <ImageView
        android:id="@+id/imgArrowRight1"
        android:layout_width="40dp"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:gravity="center"
        android:src="@drawable/line_arrow" />
</RelativeLayout>

Upvotes: 4

Views: 1344

Answers (3)

kandroidj
kandroidj

Reputation: 13932

You need to specify android:layout_height="N" where N is your height in dp when using android:layout_alignParentBottom="true" :

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

<RelativeLayout
    android:id="@+id/relativeLayoutOne"
    android:layout_width="fill_parent"
    android:layout_height="200dp">
    <!-- Bottom Border shows -->
    <View android:layout_alignParentBottom="true"
        android:layout_height="1dp"
        android:background="#F00"
        android:layout_width="fill_parent"/>
</RelativeLayout>

<RelativeLayout
    android:id="@+id/relativeLayoutTwo"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">
    <TextView
        android:text="Text View 1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />
</RelativeLayout>

<RelativeLayout
    android:id="@+id/relativeLayoutThree"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">
    <TextView
        android:text="Text View 2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

</RelativeLayout>
</LinearLayout>

Upvotes: 3

Vigor
Vigor

Reputation: 1754

You can add a new ImageView to your RelativeLayout, set the height to 1 px, align it to the bottom, then this ImageView can be 'considered' as the border.

pleas see following xml:

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="55dp" >

    <TextView
        android:id="@+id/txtCategoryName"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_weight="0.9"
        android:background="#ffffff"
        android:gravity="center"
        android:paddingLeft="0dp"
        android:text="Register"
        android:textColor="@color/labelColor"
        android:textSize="20dp"
        android:textStyle="normal" />

    <ImageView
        android:id="@+id/imgArrow"
        android:layout_width="40dp"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:gravity="center"
        android:src="@drawable/line_arrow" />

    <ImageView
        android:id="@+id/imgBorder"
        android:layout_width="fill_parent"
        android:layout_height="1px"
        android:layout_alignParentBottom="true" 
        android:background="#ff0000"/>
</RelativeLayout>

@inner_class7 is correct, you need to give a value as the height of the RelativeLayout, or, it will show on the bottom of the screen.

Upvotes: 1

Rajesh Jadav
Rajesh Jadav

Reputation: 12861

You can use View to give bottom border to your RelativeLayout.

Add this in your RelativeLayout.

<View
     android:id="@+id/view"
     android:layout_width="fill_parent"
     android:layout_height="2dp"
     android:layout_alignParentBottom="true"
     android:background="@color/black" />

I hope it helps!

Upvotes: 1

Related Questions