CODEWITHSUNDEEP
androidandroid-layout
Allen Edwards
Allen Edwards

Reputation: 1552

How to scale a drawable inside a button with text with XML

I have set up some buttons with icons on the left and text on the right. Everything scales with screen size (phone tablet) but the problem is that the button is just the text. I want the button to be the entire line so that the button that has focus lights up correctly (I use a remote).

This code works except for the button is just the text

        <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:onClick="onSetTargets">

    <ImageView
            android:id="@+id/imageView1"
            android:layout_width="@dimen/menu"
            android:layout_height="@dimen/menu"
            android:layout_marginTop="@dimen/padding_small"
            android:src="@raw/target" 
            android:onClick="onSetTargets"/>

    <Button
        android:id="@+id/set_Targets"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/buttonselector"
        android:ellipsize="none"
        android:gravity="left"
        android:onClick="onSetTargets"
        android:singleLine="true"
        android:text=" Targets "
        android:textColor="@android:color/white"
        android:textSize="@dimen/menu" />

    </LinearLayout>

This is just a section within a linear layout and there are then several buttons in a row.

Following is what I would like to get working but I can't figure out how to scale the drawable. I know there is a scaleDrawable command but I can't find any posts on how to make it work in the XML other than people complaining that it doesn't work and getting solutions for dealing with it in java.

        <Button
        android:id="@+id/set_start_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/buttonselector"
        android:gravity="left"
        android:onClick="onStartTime"
        android:text=" Timer"
        android:textColor="@android:color/white"
        android:textSize="@dimen/menu" 
        android:drawableLeft="@raw/hourglass"/>

Upvotes: 1

Views: 5806

Answers (1)

Allen Edwards
Allen Edwards

Reputation: 1552

This is what I came up with that worked. The overall page is a linear layout with buttons arranged vertically on the page. Each button is a vertical linear layout consisting of an image and some text. All elements of the vertical layout are clickable so clicking on the image or the text does the same thing. Here is an example for a single button. The size @dimen/menu is defined for both phone and tablet sizes and the image will scale to match the specification.

        <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:onClick="onSetTargets">

    <ImageView
            android:id="@+id/imageView1"
            android:layout_width="@dimen/menu"
            android:layout_height="@dimen/menu"
            android:layout_marginTop="@dimen/padding_small"
            android:src="@raw/target" 
            android:onClick="onSetTargets"/>

    <Button
        android:id="@+id/set_Targets"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/buttonselector"
        android:ellipsize="none"
        android:gravity="left"
        android:onClick="onSetTargets"
        android:singleLine="true"
        android:text=" Targets "
        android:textColor="@android:color/white"
        android:textSize="@dimen/menu" />

    </LinearLayout>

Upvotes: 2

Related Questions