Q:

RelativeLayout pushes centered View to right

I hope you can help me since this is driving me nuts...
I have a simple RelativeLayout with two child Views as you can see in the code sample. The TextView should be centered and the ProgressBar left aligned.
In the layout editor this is rendered correctly, but on the device/emulator the TextView gets pushed to the right and also the ProgressBar has a random offset.
You can ignore the fact that the text and button color is different, I already checked that that doesn't make any difference.
    <RelativeLayout
    android:id="@+id/popup_redeem_button"
    android:layout_margin="@dimen/margin_outer"
    android:background="@drawable/button_rounded_yellow"
    android:clickable="true"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <de.fireflow.milebox.ui.views.TypefaceTextView
        android:id="@+id/popup_redeem_text"
        style="@style/ButtonHeadlineMenu_Font"
        app:richText="true"
        android:padding="@dimen/margin_normal"
        android:text="@string/voucher_redeem"
        android:layout_centerInParent="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:indeterminate="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="@dimen/margin_normal"
        android:indeterminateBehavior="cycle"
        android:layout_gravity="center_horizontal"/>
   </RelativeLayout>

Shape for the button background:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle">
   <corners
     android:radius="6dp"
   />

   <solid
     android:color="@color/btn_yellow_pressed"
   />
</shape>

I don´t measure or change any layout bounds in code, so I really cannot think of the problem. Any ideas?

A:

I would suggest that you try changing the custom TextView's layout_width to match_parent, and setting its gravity to center_horizontal. This will stretch the TextView to cover its parent horizontally, and then it can take care of centering its own text in itself. Since you've the ProgressBar listed after the TextView, the z-ordering will be correct, and the ProgressBar will appear on top of the TextView.

