Adjust button width according to ImageButton drawable

Question

I've two questions:

1. In the layout xml there is an ImageButton which drawable is a resource. Having drawable-ldpi to xxhdpi in different sizes for this imageButton the width varies depending on which device the app is running. At the bottom in the layout xml I've a 9-patch button which I want to have the same width as the drawable/imageButton.

2. How would I inherit the dynamic with from 1. to a second 9-patch button in a different layout xml?

My try was to make a RelativeLayout with wrap_content, which wraps around everything nicely. When I set the buttonStart width to match_parent it uses the entire screen, and not the width from the UIWrapper. Any help is appreciated. thx!

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main_activity_layout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/background"
    android:focusable="true"
    android:screenOrientation="portrait"
    tools:context=".MainActivity" >

    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/UIWrapper"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="62dp" >

        <RelativeLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/imageWrapper"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true" >

            <ImageButton
                android:id="@+id/imageButton"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="false"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:background="?android:attr/selectableItemBackground"
                android:src="@drawable/my_gfx" />

            <TextView
                android:id="@+id/textViewTest"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_centerVertical="true"
                android:layout_gravity="center_horizontal|top"
                android:clickable="false"
                android:shadowColor="@color/LightYellow"
                android:shadowDx="0.0"
                android:shadowDy="0.0"
                android:shadowRadius="24"
                android:text="Some Text"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:textColor="@color/DarkBlue"
                android:textSize="48dp" />
        </RelativeLayout>

        <TextView
            android:id="@+id/T0"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/imageWrapper"
            android:layout_below="@+id/imageWrapper"
            android:layout_marginTop="10dp"
            android:text="@string/label"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/FloralWhite" />

        <RadioGroup
            android:id="@+id/T1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/T0"
            android:layout_below="@+id/T0" >

            <RadioButton
                android:id="@+id/radioButton0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:checked="true"
                android:enabled="true"
                android:singleLine="true"
                android:text="@string/rd_0"
                android:textColor="@color/White" />

            <RadioButton
                android:id="@+id/radioButton1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:enabled="true"
                android:text="@string/rd1"
                android:textColor="@color/FloralWhite" />
        </RadioGroup>

        <Button
            android:id="@+id/buttonStart"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="14dp"
            android:background="@drawable/default_button"
            android:text="@string/btn_start"
            android:textColor="@color/FloralWhite" />
    </RelativeLayout>
</RelativeLayout>

Answer 1

First

To get the same width use:

 android:id="@+id/buttonStart"
 android:layout_alignRight="@+id/..."
 android:layout_alignLeft="@+id/..."

and set the id of the view you intend to use to size the button's width. But you need to use only one RelativeLayout to get a result. Can you post a picture of what you want to get?

1. I've to say: your're using too many nested relative layouts. It's not a clear and common.
2. you dont' need to repeat the attribute xmlns:android="http://schemas.android.com/apk/res/android", just once, at the first element.