CODEWITHSUNDEEP
androidlayoutandroid-linearlayoutandroid-tablelayout
Nik
Nik

Reputation: 7214

Complex android layout

I need to make layout with 4 TextView.

First TextView places at the left bound of screen, second TextView may hav different sizes, third TextView places after second textView and fourth TextView places at the right bound of screen.

If second TextView is short, after third TextView adds empty space like:

[TextView1 TextView2 TextView3 (free space) TextView4]

If second TextView is long, it ellipsize with ... at the end:

[TextView1 VeryLooooooongTexVi... TextView3 TextView4]

How can I write this layout in xml? I must use LinearLayout or TableLayout is better? Can you give any examples?

Upvotes: 0

Views: 776

Answers (2)

andro
andro

Reputation: 977

You can use a RelativeLayout for aligning the textviews the way you want using the attributes layout_alignParentLeft,layout_alignParentRight and layout_toRightOf. The second TextView can be designed in the required way by using maxWidth, ellipsize, singleLine attributes of TextView. The layout will be somewhat like this:

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

    <TextView android:id="@+id/firstTextView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:text="first"/>

    <TextView android:id="@+id/secondTextView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_toRightOf="@id/firstTextView"
        android:layout_marginLeft="10dp"
        android:singleLine="true"
        android:maxWidth="100dp"
        android:ellipsize="end"
        android:text="secondtextviewlonnnnnnnnnnnnnnnnng"/>

    <TextView android:id="@+id/thirdTextView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_toRightOf="@id/secondTextView"
        android:layout_marginLeft="10dp"
        android:text="third"/>

    <TextView android:id="@+id/fourthTextView"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:layout_marginLeft="10dp"
        android:text="fourth"/>

</RelativeLayout>

Also, you can find an example project of different layouts here

Upvotes: 1

ePeace
ePeace

Reputation: 1997

<?xml version="1.0" encoding="utf-8"?>


<TextView
    android:layout_width="0"
    android:layout_height="fill_parent"
    android:layout_weight="1" />

<TextView
    android:layout_width="0"
    android:layout_height="fill_parent"
    android:layout_weight="1" />

<TextView
    android:layout_width="0"
    android:layout_height="fill_parent"
    android:layout_weight="1" />


<View
    android:layout_width="0"
    android:layout_height="fill_parent"
    android:layout_weight="1" />

<TextView
    android:layout_width="0"
    android:layout_height="fill_parent"
    android:layout_weight="1" />

Upvotes: 0

Related Questions