Search code examples
androidlayoutlayout-inflaterdialogfragment

RelativeLayout and view wiith layout_toLeftOf attribute not working in DialogFragment


I have a layout which was used in an dialog themed activity. This rendered corectly. However, its now rendered in a dialog fragment and some of the views are stacked on top of one another. I tried adding in as a linear layout at the top level as I found a post that suggested it but this hasnt helped. It looks like the code to mark items to right or to left of something else is being skipped and I'm not sure why. Any guidance or help appreciated.

The handset layout looks like this: Mobile Render

The android studio render looks correct:

Android Studio Render

The layout file is as follows

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="match_parent">

<RelativeLayout android:layout_width="match_parent"
            android:layout_height="wrap_content">

<Button
    android:id="@+id/delete_text_overlay"
    android:layout_centerHorizontal="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/Delete_Overlay"
    android:textColor="#FF000000"
    android:onClick="btn_Delete_TextBox_Click"/>

<EditText
    android:id="@+id/text_edit_view"
    android:layout_below="@id/delete_text_overlay"
    android:layout_centerHorizontal="true"
    android:textAlignment="center"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textSize="20dp"
    android:textColor="@android:color/white"
    android:background="#00000000"/>
<Button
android:id="@+id/font_Style_Button"
android:layout_below="@id/text_edit_view"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Font @amp; Style"
android:onClick="fontStyleBtnClick"/>

<TextView
    android:id="@+id/center_point_text_edit"
    android:layout_below="@id/font_Style_Button"
    android:layout_centerHorizontal="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>
<Button
    android:id="@+id/confirm_text_edit"
    android:layout_below="@id/font_Style_Button"
    android:layout_toLeftOf="@id/center_point_text_edit"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/Confirm_Text_Edit_Changes"
    android:onClick="btn_Confirm_Changes_Click"/>
<Button
    android:id="@+id/cancel_text_edit"
    android:layout_below="@id/font_Style_Button"
    android:layout_toRightOf="@id/center_point_text_edit"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/Cancel_Text_Edit"
    android:onClick="btn_Cancel_Changes_Click"/>

 </RelativeLayout>
 </LinearLayout>

Java code that shows the layout in a dialog fragment

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.dialog_fragment_text_properties, container, false);
  }

Java code that creates the request to show the dialog

void showDialog(dialogTypeEnum dialogType, Bundle tempBundle) {
    mStackLevel++;

    FragmentTransaction ft = getFragmentManager().beginTransaction();
    Fragment prev = getFragmentManager().findFragmentByTag(dialogType.stringValue);
    if (prev != null) {
        ft.remove(prev);
    }
    ft.addToBackStack(null);

    DialogFragment newFragment;
    switch (dialogType){
        case DIALOG_FRAGMENT_FONT_PROPERTIES:
            newFragment = TextPropertiesDialogFragment.newInstance(tempBundle);
            break;
        case DIALOG_FRAGMENT_TEXT_EDIT:
            newFragment = TextEditDialogFragment.newInstance(tempBundle);
            break;
        case DIALOG_FRAGMENT_TEXT_PROPERTIES:
        //This call    
        newFragment = TextPropertiesDialogFragment.newInstance(tempBundle);
            break;
        default:
            newFragment = null;
            break;
    }

    if (newFragment != null ){
        newFragment.show(ft, dialogType.stringValue);
    }
}

Solution

  • I had to implement a work around for this as I couldn't find a reason for why it wouldn't work. The workaround was to put the two buttons in a linear layout inside the relative layout and remove the blank textview that the buttons used to align themselves against. This worked ok but it is less than ideal.

    Changed code as per below

        <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:layout_width="wrap_content"
                  android:layout_height="match_parent">
    
    <RelativeLayout android:layout_width="wrap_content"
                    android:layout_height="wrap_content">
    
        <Button
            android:id="@+id/delete_text_overlay"
            android:layout_centerHorizontal="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/Delete_Overlay"
            android:textColor="#FF000000"
            android:onClick="btn_Delete_TextBox_Click"/>
    
        <EditText
            android:id="@+id/text_edit_view"
            android:layout_below="@id/delete_text_overlay"
            android:layout_centerHorizontal="true"
            android:textAlignment="center"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:textColor="@android:color/white"
            android:background="#00000000"/>
    <Button
        android:id="@+id/font_Style_Button"
        android:layout_below="@id/text_edit_view"
        android:layout_centerHorizontal="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Font @amp; Style"
        android:onClick="fontStyleBtnClick"/>
    
        <!-- <TextView
            android:id="@+id/center_point_text_edit_df"
            android:layout_below="@id/font_Style_Button"
            android:layout_centerHorizontal="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text=" "/>
         <Button
            android:id="@+id/confirm_text_edit"
            android:layout_below="@id/font_Style_Button"
            android:layout_toStartOf="@id/center_point_text_edit_df"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/Confirm_Text_Edit_Changes"
            android:onClick="btn_Confirm_Changes_Click"/>
        <Button
            android:id="@+id/cancel_text_edit"
            android:layout_below="@id/font_Style_Button"
            android:layout_toEndOf="@id/center_point_text_edit_df"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/Cancel_Text_Edit"
            android:onClick="btn_Cancel_Changes_Click"/> -->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerInParent="true"
        android:gravity="center_horizontal"
        android:layout_below="@id/font_Style_Button"
        >
        <Button
            android:id="@+id/confirm_text_edit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Confirm"
            android:onClick="btn_Confirm_Changes_Click"/>
        <Button
            android:id="@+id/cancel_text_edit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Cancel"
            android:onClick="btn_Cancel_Changes_Click"/>
    </LinearLayout>
    </RelativeLayout>
    </LinearLayout>