Search code examples
androidandroid-layoutalignmentandroid-relativelayout

RelativeLayout inside RelativeLayout is not aligned left completely


I have a relativelayout inside another relativelayout which has 4 buttons inside. I want to align the inner relativelayout to the left of the parent relativelayout but it doesn't aligned completely, there's an empty space between the left of the inner view with the left of the parent view, here's the xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_main_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="raw4.kaw.mp2.MainActivity"
android:background="@color/background_all" >

<RelativeLayout 
    android:id="@+id/main_btn_container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    >
    
<Button
    android:id="@+id/btn_main_news"
    android:layout_width="fill_parent"
    android:layout_height="60dp"
    android:text="@string/btn_news_text"
    android:layout_marginTop="10dp"
    android:layout_alignParentTop="true"
    android:background="@color/background_btn"
    android:textColor="@color/text_color_btn" />

<Button
    android:id="@+id/btn_main_products"
    android:layout_width="fill_parent"
    android:layout_height="60dp"
    android:text="@string/btn_products_text"
    android:layout_below="@id/btn_main_news"
    android:layout_marginTop="10dp"
    android:background="@color/background_btn"
    android:textColor="@color/text_color_btn" />

<Button
    android:id="@+id/btn_main_aboutus"
    android:layout_width="fill_parent"
    android:layout_height="60dp"
    android:text="@string/btn_aboutus_text"
    android:layout_below="@id/btn_main_products"
    android:layout_marginTop="10dp"
    android:background="@color/background_btn"
    android:textColor="@color/text_color_btn" />

<Button
    android:id="@+id/btn_main_contactus"
    android:layout_width="fill_parent"
    android:layout_height="60dp"
    android:text="@string/btn_contactus_text"
    android:layout_below="@id/btn_main_aboutus"
    android:layout_marginTop="10dp"
    android:background="@color/background_btn"
    android:textColor="@color/text_color_btn" />

</RelativeLayout>

here's the code in MainActivity.java to reduce the inner layout width to 80% with the alignment rules added:

DisplayMetrics metrics = this.getResources().getDisplayMetrics();
    int dpi = metrics.widthPixels;
    int dpiPerc = (int)(dpi * 0.8);
    RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
            dpiPerc,
            RelativeLayout.LayoutParams.WRAP_CONTENT);
    params.addRule(RelativeLayout.ALIGN_PARENT_LEFT, RelativeLayout.TRUE);
    params.addRule(RelativeLayout.CENTER_VERTICAL, RelativeLayout.TRUE);
    RelativeLayout main_rl_container = (RelativeLayout)findViewById(R.id.main_btn_container);
    main_rl_container.setLayoutParams(params);

but this is the result:

as you can see there's a gap at the left side of the inner layout. thanks for help.


Solution

  • copy paste this code it will solve your problem

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main_main_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="raw4.kaw.mp2.MainActivity"
    android:background="@color/background_all" >
    
    <RelativeLayout 
        android:id="@+id/main_btn_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        >
    
    <Button
        android:id="@+id/btn_main_news"
        android:layout_width="fill_parent"
        android:layout_height="60dp"
        android:text="@string/btn_news_text"
        android:layout_marginTop="10dp"
        android:layout_alignParentTop="true"
        android:background="@color/background_btn"
        android:textColor="@color/text_color_btn" />
    
    <Button
        android:id="@+id/btn_main_products"
        android:layout_width="fill_parent"
        android:layout_height="60dp"
        android:text="@string/btn_products_text"
        android:layout_below="@id/btn_main_news"
        android:layout_marginTop="10dp"
        android:background="@color/background_btn"
        android:textColor="@color/text_color_btn" />
    
    <Button
        android:id="@+id/btn_main_aboutus"
        android:layout_width="fill_parent"
        android:layout_height="60dp"
        android:text="@string/btn_aboutus_text"
        android:layout_below="@id/btn_main_products"
        android:layout_marginTop="10dp"
        android:background="@color/background_btn"
        android:textColor="@color/text_color_btn" />
    
    <Button
        android:id="@+id/btn_main_contactus"
        android:layout_width="fill_parent"
        android:layout_height="60dp"
        android:text="@string/btn_contactus_text"
        android:layout_below="@id/btn_main_aboutus"
        android:layout_marginTop="10dp"
        android:background="@color/background_btn"
        android:textColor="@color/text_color_btn" />
    
    </RelativeLayout>
    

    your problem is your parent layout uses android:paddingLeft="@dimen/activity_horizontal_margin" that s why it is not completely to left remove this line and you will get your solution you can copy paste my above code too :)