Search code examples
androidlayoutandroid-dialogfragmentandroid-framelayout

How to show the image outside the dialog in android?


I trying to show the profile image in topside of the dialog fragment with half outside the image.and i attach the sample dialog in below, like that.And tried all FrameLayout collaboration from old Stackoverflow solutions, But i cant able to archive this. Please give me correct solution. Thankyou.

enter image description here

Updated I also tried to make transparent the ImageView parent layout but it's not working in after dialog show. i attach my xml and result screen shot below.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_item"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<RelativeLayout
    android:id="@+id/imageshow"
    android:layout_width="match_parent"
    android:layout_height="100dp">

    <View
        android:id="@+id/imagePadding"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@android:color/transparent" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/imagePadding"
        android:background="#ff0000"></LinearLayout>

    <ImageView
        android:id="@+id/info_profile"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerHorizontal="true"
        android:src="@drawable/technician_pitcher" />
</RelativeLayout>

enter image description here


Solution

  • Try the below xml

    custom_dialog_layout.xml

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rl_dialog_container"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:padding="16dp">
    
    <View
        android:id="@+id/imagePadding"
        android:layout_width="match_parent"
        android:layout_height="70dp" />
    
    <LinearLayout
        android:id="@+id/round_dialog_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/imagePadding"
        android:background="#ffffff"
        android:gravity="bottom"
        android:orientation="vertical">
    
        <View
            android:id="@+id/imagePadding2"
            android:layout_width="match_parent"
            android:layout_height="70dp" />
    
    </LinearLayout>
    
    <ImageView
        android:id="@+id/dialog_image"
        android:layout_width="140dp"
        android:layout_height="140dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:src="@mipmap/ic_launcher" />
    
    </RelativeLayout>
    

    And when you are displaying your dialog, follow the code below:

         Dialog dialog = new Dialog(MainActivity.this);
                dialog.setContentView(R.layout.custom_dialog_layout);
                //The line below is important
                dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
                dialog.show();