Text on weighted buttons don't take same space as button

Question

I've built a button bar and want it spread like that the outer buttons taking 40% of the space and the middle button takes 20% of the space. As you can see in the screenshot this works but the text gets cropped within the button.

I found out that the text stays in the bounds of 1 weight (=20%) although the button "knows" it has more space - otherwise it wouldn't fill the background drawable properly.

Here's the setup of the button bar:

<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@id/headerbar_top"
        android:layout_width="match_parent"
        android:layout_height="@dimen/headerbar_divided_height"
        android:orientation="horizontal"
        android:gravity="center"
        android:weightSum="5"
        >

    <Button
            android:id="@id/headerbar_btn_left"
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="2"
            android:gravity="center_horizontal|bottom"
            android:paddingBottom="@dimen/headerbar_paddingBottom"
            android:textSize="@dimen/headerbar_textSize"
            android:textColor="@color/font"
            android:text="Spots"
            android:maxLines="1" android:lines="1"
            android:ellipsize="end"
            android:background="@drawable/headerbar_button_left_states"
            android:onClick="onHeaderbarBtnClick"
            android:layout_marginRight="@dimen/headerbar_divided_margin"
            />

    <Button
            android:id="@id/headerbar_btn_center"
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:gravity="center_horizontal|bottom"
            android:paddingBottom="@dimen/headerbar_paddingBottom"
            android:textSize="@dimen/headerbar_textSize"
            android:textColor="@color/font"
            android:maxLines="1" android:lines="1"
            android:ellipsize="end"
            android:background="@drawable/headerbar_button_center_states"
            android:onClick="onHeaderbarBtnClick"
            android:layout_marginRight="@dimen/headerbar_divided_margin"
            android:layout_marginLeft="@dimen/headerbar_divided_margin"
            />

    <Button
            android:id="@id/headerbar_btn_right"
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="2"
            android:gravity="center_horizontal|bottom"
            android:paddingBottom="@dimen/headerbar_paddingBottom"
            android:textSize="@dimen/headerbar_textSize"
            android:textColor="@color/font"
            android:text="Tours"
            android:maxLines="1" android:lines="1"
            android:ellipsize="end"
            android:background="@drawable/headerbar_button_right_states"
            android:onClick="onHeaderbarBtnClick"
            android:layout_marginLeft="@dimen/headerbar_divided_margin"
            />
</LinearLayout>

Does anyone have an idea why the button text behaves so strangely?

EDIT: Here's the XML-drawable for the left button:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/headerbar_button_left_on" android:state_selected="true"/>
    <item android:drawable="@drawable/headerbar_button_left_off"/>
</selector>

And here are the drawables themselves:

Answer 1

Remove android:ellipsize="end" from the button's declaration.

Also: Your 9-patch-drawables seem to be missing the content area. The bottom and right corners are used for the 9-patch contents. Here's a good simple tutorial on 9-patches.