How to center an FrameLayout in a RelativeLayout

Question

I've a problem with my layout and it would be great, if some Android experts could check it and help me :)

I have a FragmentA which contains another FragmentB.

FragmentA contains 3 FrameLayouts:
- 1. FrameLayout: Should be at the top
- 1. FrameLayout: Should be below the first an contains FragmentB (id= frame2)
- 1. FrameLayout: Should be at the bottom
FragmentB contains also 1 FrameLayout:
- I'm adding programmatically a view (e.g. an image) to this FrameLayout in this way:

frameLayout.addView(new ImageClass(id);

The problem is, that the image is not centered horizontally in the middle.

This is the layout file of the first fragmentA:

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

    <FrameLayout
        android:id="@+id/frame1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <FrameLayout
        android:id="@+id/frame2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/frame1" />

    <FrameLayout
        android:id="@+id/frame3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true" />

</RelativeLayout>

And this is the layout file of the fragmentB (included in FragmentA -> FrameLayout 2 with the ID frame2)

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/imageClass"
    android:background="#0000FF"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
</FrameLayout>

And the image will be insert in the view by canvas with this code:

Bitmap image= BitmapFactory.decodeResource(getResources(), id);
canvas.drawBitmap(image, 0, 0, null);

I thought that with android:gravity="center_horizontal" in the RelativeLayout and with android:layout_width="wrap_content" in both FrameLayouts of the FragmentA und FragmentB, the image should be centered. But it is on the left side.

There are two screenshots how it looks (first) and how it should look (second):

How it looks

How it should look

Sorry for the links, but I cannot post pictures (not enought reputation)

Did you try `android:layout_centerHorizontal="true"`inside `RelativeLayout`? — Abhishek V, Jun 26 '15 at 18:14
Yes, I've tried that inside the RelativeLayout and inside the FrameLayout — , Jun 26 '15 at 18:20
Is there any specific reason to use `canvas.drawBitmap`. you could just use an `ImageView` and set bitmap as source to it. Make sure the ImageView is `wrap_content`. — Abhishek V, Jun 26 '15 at 18:24
Yes, I've to use cancas because I'm drawing some lines over the image — , Jun 26 '15 at 18:29
If you are using canvas then you need to set the proper size of the custom View in `onMeasure` function. otherwise it would occupy the full length of the screen. refer this : http://stackoverflow.com/questions/5042197/android-set-height-and-width-of-custom-view-programmatically — Abhishek V, Jun 26 '15 at 18:33
@AbhishekV Can you show me how to do that? And not only lines, also paths :) — , Jun 26 '15 at 18:38
Can you post the code of your custom View where you are drawing the bitmap and line? — Abhishek V, Jun 26 '15 at 18:50

score 0 · Answer 1 · edited May 23 '17 at 12:22

RelativeLayouts handle gravity differently than you may expect (link):

Note that since RelativeLayout considers the positioning of each child relative to one another to be significant, setting gravity will affect the positioning of all children as a single unit within the parent. This happens after children have been relatively positioned.

A quick fix is to change frame2 from a FrameLayout to a RelativeLayout, add match_parent width and put your center gravity on that.

    <RelativeLayout
        android:id="@+id/frame2"
        android:gravity="center_horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/frame1"/>

There are a number of other approaches you could take depending on the requirements for the view. It's generally better to avoid nesting RelativeLayouts but in your case it may be necessary.

Possible duplicate here.

How to center an FrameLayout in a RelativeLayout

1 Answers1