Search code examples
javaandroidwidthdialogfragment

Android - Adjust Custom DialogFragment Width


I'm trying to display a custom DialogFragment flush left on the screen, with a wrap_content width. I've got it almost there, but not quite.

enter image description here

Notice that the right of the dialog is extended out beyond the width of the content. I added a red color to the back of the main content area to distinguish the two. This leads me to believe that the main content area is actually sitting on another layer who has a min-width that I cannot get to. In the DialogFragment's onResume(), if I call...

    Resources r = getActivity().getResources();
    int pixels = (int)TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 72, r.getDisplayMetrics());
    LayoutParams params = getDialog().getWindow().getAttributes();
    params.width = pixels;
    params.x = 0;
    getDialog().getWindow().setAttributes(params);

... this adjusts the width to the proper size, but I'm worried that this will not be correct on all devices due to pixel differences. Note I am converting the 72 based on display metrics, but I wasn't sure why 72 was the proper width, because the smallest icon version I provided was 48x48px in the drawable-mdip folder. 72x72px is in the drawable-hdip folder, which I'm assuming is specific to the device I'm using... so other devices may need this value set to 48, 96, 144, etc depending on display metrics.

So my question is: Why is the right side of this dialog extended? How do I get rid of it without shrinking the window by a static value (i.e., 72) programmatically?

... here is the custom dialog xml:

<?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="wrap_content"
    android:padding="5dip"
    android:background="@color/red"
    android:orientation="vertical" >

    <ImageButton 
        android:id="@+id/sharing_dialog_button_facebook"
        android:contentDescription="@string/facebook_option"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@color/transparent"
        android:src="@drawable/facebook_icon"/>

    <ImageButton 
        android:id="@+id/sharing_dialog_button_twitter"
        android:contentDescription="@string/twitter_option"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:layout_gravity="center"
        android:background="@color/transparent"
        android:src="@drawable/twitter_icon"/>

    <ImageButton 
        android:id="@+id/sharing_dialog_button_tumblr"
        android:contentDescription="@string/tumblr_option"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:layout_gravity="center"
        android:background="@color/transparent"
        android:src="@drawable/tumblr_icon"/>

    <ImageButton 
        android:id="@+id/sharing_dialog_button_foursquare"
        android:contentDescription="@string/foursquare_option"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:layout_gravity="center"
        android:background="@color/transparent"
        android:src="@drawable/foursquare_icon"/>

    <ImageButton 
        android:id="@+id/sharing_dialog_button_email"
        android:contentDescription="@string/email_option"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:layout_gravity="center"
        android:background="@color/transparent"
        android:src="@drawable/mail_icon"/>

</LinearLayout>

Solution

  • I've had a similar problem, only that I had the Dialog too small at times, and wanted it to fill most of the screen. I resolved it by setting the minWidth of the content:

    Window window = getDialog().getWindow();
    FrameLayout content = (FrameLayout) window.findViewById(android.R.id.content);
    
    // Make the popup fill at least 4/5 of the screen's width
    int minWidth = width*4/5;
    content.setMinimumWidth(minWidth);
    

    I don't quite remember why but in my code, afterwards I re-check the windows width and manually set it to the window. Probably setMinimumWidth didn't work always. So I did this:

    WindowManager.LayoutParams lp = new WindowManager.LayoutParams();
    lp.copyFrom(window.getAttributes());
    lp.width = WindowManager.LayoutParams.MATCH_PARENT;
    lp.height = WindowManager.LayoutParams.WRAP_CONTENT;
    window.setAttributes(lp);
    

    Note: may need to delay the latter code until the content is drawn.