CODEWITHSUNDEEP
androidtextviewandroid-relativelayout
Meymann
Meymann

Reputation: 2532

RelativeLayout layout_alignBottom of TextView doesn't work properly

Trying to do some alignment by a flexible TextView, in a RelativeLayout container that may vary in height. Seems like no brainer, and yet, it doesn't align anywhere near where it should.

The following simple code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

<-- Stands for any view that would force minimum height, e.g. an avatar image -->
<View
    android:layout_width="10dp"
    android:layout_height="73dp"
    android:background="#300f"/>

<TextView
    android:id="@+id/t1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:text="ceterum censeo carthaginem esse delendam"/>

<View
    android:layout_width="40dp"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/t1"
    android:layout_alignBottom="@+id/t1"
    android:background="#6f00"/>

</RelativeLayout>

This is the result:

enter image description here

One may obviously expect that the red rectangle would align vertically with the text. But it doesn't.

What has gone wrong?...

Upvotes: 1

Views: 1047

Answers (7)

Noorul
Noorul

Reputation: 3444

Try this solution. hope this helps.

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <View
       android:layout_width="10dp"
       android:layout_height="73dp"
       android:background="#300f"/>
    <RelativeLayout 
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:layout_centerVertical="true">

      <TextView
         android:id="@+id/t1"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="ceterum censeo carthaginem esse delendam"/>

      <View
         android:layout_width="40dp"
         android:layout_height="wrap_content"
         android:layout_alignTop="@+id/t1"
         android:layout_alignBottom="@+id/t1"
         android:background="#6f00"/>
   </RelativeLayout>

 </RelativeLayout>

Upvotes: 0

Tzlil Gavra
Tzlil Gavra

Reputation: 88

It has to do with you relative layout height is set to wrap_content.

from RelativeLayout documentation:

Note that you cannot have a circular dependency between the size of the RelativeLayout and the position of its children. For example, you cannot have a RelativeLayout whose height is set to WRAP_CONTENT and a child set to ALIGN_PARENT_BOTTOM.

So either you set that height to match_parent or, easier, like Ahamed wrote add android:layout_centerVertical="true" to your red color layout

Upvotes: 1

Jozef Dochan
Jozef Dochan

Reputation: 935

Use android:layout_toEndOf like this

<TextView
    android:id="@+id/t1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:text="ceterum censeo carthaginem esse delendam"/>

<View
    android:layout_width="40dp"
    android:layout_height="wrap_content"
    android:layout_toEndOf="@+id/t1"
    android:layout_alignBottom="@+id/t1"
    android:background="#6f00"/>

Upvotes: 0

Rajakumar
Rajakumar

Reputation: 937

Try this code it may solve your problem:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff" >

<View
    android:layout_width="10dp"
    android:layout_height="73dp"
    android:background="#300f" />

<TextView
    android:id="@+id/t1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:text="ceterum censeo carthaginem esse delendam" />

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

    <View
        android:layout_width="10dp"
        android:layout_height="73dp"
        android:background="#6f00" />
</LinearLayout>

</RelativeLayout>

Upvotes: 0

Sri
Sri

Reputation: 1336

Please try this below.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <View android:id="@+id/some_view_id"
        android:layout_width="10dp"
        android:layout_height="73dp"
        android:background="#300f"/>

    <TextView
        android:id="@+id/t1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_below="@id/some_view_id"
        android:text="varying text view here that can \n go for multiple lines and not disturb the one below"/>

    <View
        android:layout_width="40dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/t1"
        android:background="#6f00"/>
</RelativeLayout>

Upvotes: 0

Paul
Paul

Reputation: 710

try using the attribute "android:layout_below". For example:
...
<View android:id="@+id/v1"
    android:layout_width="10dp"
    android:layout_height="73dp"
    android:background="#300f"/>

<TextView
    android:id="@+id/t1"
    android:layout_below="@+id/v1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:text="ceterum censeo carthaginem esse delendam"/>

...

Upvotes: 0

Surya Prakash Kushawah
Surya Prakash Kushawah

Reputation: 3201

user android:layout_below="@id/id"

<View
    android:layout_width="40dp"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/t1"
  android:layout_below="@+id/t1"
    android:background="#6f00"/>

I hope It's work

Upvotes: 0

Related Questions