CODEWITHSUNDEEP
androidalignmenttextview
user3607124
user3607124

Reputation: 65

How to align text one below the other in android?

I'm working on android app. Here I have 2 TextView which I need to align one below the other.(i.e "Artist Name" should be exact below the "Title of song" )

Could anyone help me in aligning the TextView one below the other. Thanks in advance.

Below is my code

<RelativeLayout xmlns:
  android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:background="@drawable/list_selector"
  android:orientation="horizontal"
  android:padding="5dip" >

  <TableLayout
  android:layout_width="wrap_content"
  android:layout_height="match_parent"
  android:layout_centerHorizontal="true" >

  <!--  Left side Thumbnail image -->
  <TableRow android:id="@+id/thumbnail"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:padding="3dip"
   android:layout_alignParentLeft="true"
   android:background="@drawable/image_bg"
   android:layout_marginRight="5dip">

<ImageView
    android:id="@+id/list_image"
    android:layout_width="50dip"
    android:layout_height="50dip"
    android:src="@drawable/doc"/>



 <!-- Title Of Song-->
 <TextView
 android:id="@+id/title"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignTop="@+id/thumbnail"
 android:layout_toRightOf="@+id/thumbnail"
 android:text="love you the"
 android:textColor="#040404"
 android:typeface="sans"
 android:textSize="15dip"
 android:textStyle="bold"/>

 <!-- Artist Name -->
  <TextView
  android:id="@+id/artist"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_below="@id/title"
  android:textColor="#343434"
  android:textSize="10sp"
  android:layout_marginTop="1dip"
  android:layout_toRightOf="@+id/thumbnail"
  android:text="Mary" />

  <!-- Rightend Duration -->
  <TextView
 android:id="@+id/duration"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignParentRight="true"
 android:layout_alignTop="@id/title"
 android:gravity="right"
 android:text="7:45"
 android:layout_marginRight="5dip"
 android:textSize="10dip"
 android:textColor="#10bcc9"
 android:textStyle="bold"/>

    <!-- Rightend Arrow -->
     <ImageView android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/arrows"
 android:layout_alignParentRight="true"
 android:layout_centerVertical="true"/>
 </TableRow>
 </TableLayout>

   </RelativeLayout>

Upvotes: 1

Views: 5391

Answers (5)

AndroidHacker
AndroidHacker

Reputation: 3596

try like this.. 

 android:layout_below="@+id/your_another_text_view"

UPDATE

You just need to make use of relative layout specifically for that textView.. Try it and let me know.

Upvotes: 2

Ramki Anba
Ramki Anba

Reputation: 764

try to use LinearLayout or use the property android:layout_alignBottom="@+id/title"

Upvotes: 0

Hareshkumar Chhelana
Hareshkumar Chhelana

Reputation: 24848

// try this way,hope this will help you to solve your problem.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/list_selector"
    android:orientation="horizontal"
    android:padding="5dip" >

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true" >

        <!--  Left side Thumbnail image -->
        <TableRow android:id="@+id/thumbnail"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="3dp"
            android:background="@drawable/image_bg"
            android:layout_marginRight="5dp">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
                <ImageView
                    android:id="@+id/list_image"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:layout_alignParentLeft="true"
                    android:src="@drawable/ic_launcher"/>


                <TextView
                    android:id="@+id/title"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_toRightOf="@id/list_image"
                    android:text="love you the"
                    android:textColor="#040404"
                    android:typeface="sans"
                    android:textSize="15sp"
                    android:textStyle="bold"/>

                <!-- Artist Name -->
                <TextView
                    android:id="@+id/artist"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/title"
                    android:layout_toRightOf="@id/list_image"
                    android:textColor="#343434"
                    android:textSize="12sp"
                    android:layout_marginTop="1dp"
                    android:text="Mary" />

                <TextView
                    android:id="@+id/duration"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_toRightOf="@id/title"
                    android:gravity="right"
                    android:text="7:45"
                    android:layout_marginRight="5dp"
                    android:textSize="12sp"
                    android:textColor="#10bcc9"
                    android:textStyle="bold"/>

                <ImageView
                    android:id="@+id/arrow_image"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_launcher"
                    android:layout_alignParentRight="true"
                    android:layout_toRightOf="@id/duration"
                    android:layout_centerVertical="true"/>

            </RelativeLayout>
        </TableRow>
    </TableLayout>
</RelativeLayout>

Upvotes: 2

Robi Kumar Tomar
Robi Kumar Tomar

Reputation: 3404

Simply use this to place your Item's to related to other's.

androidHacker is right, you can place one text view to below of other like this:

android:layout_below="@+id/your_another_text_view"

Similar layout is here in this tutorial for that you are looking here.

Upvotes: 3

Wasim Ahmed
Wasim Ahmed

Reputation: 356

 <TextView
 android:id="@+id/title"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignTop="@+id/thumbnail"
 android:layout_toRightOf="@+id/thumbnail"
 android:text="love you the"
 android:textColor="#040404"
 android:typeface="sans"
 android:textSize="15dip"
 android:textStyle="bold"/>

 <!-- Artist Name -->
  <TextView
  android:id="@+id/artist"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_below="@id/title"
  android:textColor="#343434"
 android:layout_alignLeft="@+id/title"// This line is new
  android:textSize="10sp"
  android:layout_marginTop="1dip"

  android:text="Mary" />

Upvotes: 1

Related Questions