How to ellipsize center-aligned textview beside a right-aligned button when screen width is small

Question

------------------------------------
|           LONG_TITL...   |button|  |
|------------------------------------|
|                                    |

I have an app header which consists of the app title and a button. The button should be fixed on the right side but I want the title to be in the middle and ellipsize when the screen is too small. Problem is the title just won't ellipsize even though the button is nearly beside it.

Here's what I have so far:

<RelativeLayout android:id="@+id/headr"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center">

    <ImageView
        android:id="@+id/bar_orange"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:minHeight="40dp"
        android:scaleType="centerCrop"
        android:src="@drawable/bar_orange"/>

    <TextView
        android:id="@+id/Title"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:text="@string/bcd"
        android:textColor="#FFFFFF"
        android:ellipsize="marquee"
        android:singleLine="true"
        android:textSize="18sp"
        android:textStyle="bold"/>

    <Button
        android:padding="5dp"
        android:id="@+id/home"
        android:textColor="#ffffff"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:singleLine="true"
        android:background="@drawable/button_home"
        android:text="@string/home"/>

</RelativeLayout>

Is there a way to do this with just RelativeLayout ?

Answer 1

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

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

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:layout_toLeftOf="@+id/button"
            android:ellipsize="end"
            android:singleLine="true"
            android:text="very large center align text very large center align text very large center align text" />

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:text="Right button" />
    </RelativeLayout>

</RelativeLayout>

Answer 2

add this to your textView

  android:layout_centerHorizontal="true"
  android:layout_centerVertical="true"

Answer 3

在TextView中更改为android:ellipsize="end" 。

Answer 4

为TextView设置固定宽度