Fixed-width TextView with stretched compound drawable

Question

I'm trying to achieve the following layout: a fixed width TextView aligned to the left of its parent, with the text inside it aligned to the right side of that TextView (that's why fixed width, can it be done other way?) and the rest of the parent is filled with a drawable (simple line). Like this:

It's a ListView containing 2 types of rows and the layout for the rows with lines is quite trivial - LinearLayout with TextView and ImageView (I can post the exact code later if needed). And I'm getting a warning that it could be replaced with a single TextView with compound drawable.

I'm all for optimization so I really tried to follow that advice. Unfortunately I wasn't able to get the same result - the line is either constrained to TextView's width or text is aligned to the right side of the ListItem, now to fixed position.

Am I missing something?

Edit: Apparently it is not actually possible and since there are some other complications (the drawable is now a level-list drawable, which is not always a line and sometimes it has a non-fixed height that I have to set) I will leave it as it is now - linear layout, containing one TextView and one ImageView.

Behistun

Can you post the layout? – Absquatulate

github.com/aragaer/jtt_android/blob/master/res/layout/… – Behistun

Answer 1

I don't think that you're missing anything. The TextView compound drawable features are not very customizable and in general are not worth the time you spend trying to get them to look right. Some lint warnings are a little overzealous and premature.

Godwin

Answer 2

The optimization that the lint refers to is something that is better attributed for a fixed size image. In your case, the line has to stretch the rest of the screen length and as such it is not something that can be done with a textview with compound drawable. This kind of lint warning is more of a suggestion rather than something that MUST be done and is detected by just checking for a linear layout with only a textview and an imageview rather than checking what would need to go in the image view. If you already have it working the way you did it I think you should leave it alone.

Gloat

Answer 3

Your view create from this -

<?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="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/time"
        android:layout_width="@dimen/today_time_width"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:gravity="right"
        android:layout_marginRight="5dp" />

    <ImageView
        android:layout_gravity="center"
        android:id="@+id/border"
        android:layout_width="match_parent"
        android:layout_height="@dimen/today_current"
        android:src="?attr/item_boundary" />

</LinearLayout>

Gib

Not much difference - I asked how I can get rid of the whole layout, leaving only one text view. – Behistun

If you want to get rid of the whole layout, then you can use Button and create a drawable as your "?attr/item_boundary" and set that drawable left in button. From this you can set Text and image both in a single button. Like this - – Gib

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <Button android:id="@+id/time" android:layout_width="@dimen/today_time_width" android:layout_height="wrap_content" android:background="#fff" android:layout_gravity="left" android:drawableLeft="@drawable/item_boundary" android:gravity="right" /> </LinearLayout> – Gib

Did not work unfortunately - the width is limited to layout width and text completely fits into it. If drawable would have fixed width it might have worked, but doesn't work when it has to be stretched. – Behistun

Answer 4

There is no way to achive this using only standart TextView. If you really want to reduce view count you can create your custom TextView class, set layoutWidth to matchParent and draw line from text end to right border. But it's not worth to be doing. Some extra views won't slow your list.

Cnossus

Answer 5

I am not sure if you will be able to achieve what you really want to , but then you could change the linear layout in the link you posted to something like this:

    <RelativeLayout
        android:id="@+id/relTrial"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
    <TextView 
        android:id="@+id/txtTime"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:gravity="right"
        android:text="12:45 AM"
        android:layout_alignParentLeft="true"/>
    <LinearLayout 
        android:id="@+id/lnrSep"
        android:layout_width="fill_parent"
        android:layout_height="1dp"
        android:gravity="bottom"
        android:layout_marginLeft="5dp"  
        android:layout_marginRight="5dp"          
        android:layout_centerVertical="true"
        android:orientation="horizontal"
        android:background="@android:color/darker_gray"
        android:layout_toRightOf="@+id/txtTime"
        android:layout_alignParentRight="true"></LinearLayout>
    </RelativeLayout>

This way the time text will be right aligned although being at the left side, and the line will also be visible.

Hope that helps.

Scherzando

This is similar what I use now - LinearLayout is replaced with Relativelayout and ImageView is replaced with LinearLayout. Not sure if there is any significant difference at all. – Behistun

Answer 6

If I got you right, you want to add bottom border to list view item? What about to try this:

android:drawableBottom="@drawable/line"

Sibilant

Nope, the line is a part of separate list item - together with time. – Behistun