Android Custom Menu-Bar Icon Stretched

Question

I have a custom Android menu-bar icon layout, but it is stretching the background image. Here is a screenshot of the issue:.

You can see that the icon on the left is being stretched horizontally because it should look like the icon in the middle of the action bar. How do I fix this?

Here is my custom menu-bar layout code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <ImageButton
        android:id="@+id/myButton"
        android:layout_width="48dp"
        android:layout_height="fill_parent"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="12dp"
        android:layout_marginTop="8dp"
        android:background="@drawable/ic_menu_feeds"
        android:paddingRight="12dp" />

    <TextView
        android:id="@+id/textOne"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignRight="@id/myButton"
        android:layout_marginTop="2dp"
        android:background="@drawable/badge_circle"
        android:textColor="#FFF"
        android:textSize="12sp"
        android:textStyle="bold" />

</RelativeLayout>

Here is my code for badge_circle.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <corners android:radius="10dip" />

    <solid android:color="#F00" />

    <stroke
        android:width="2dip"
        android:color="#FFF" />

    <padding
        android:bottom="5dip"
        android:left="5dip"
        android:right="5dip"
        android:top="5dip" />

</shape>

Answer 1

Set the image to wrap_content, right now you are forcing it to be a certain width