I have created a rectangle structure with a tooltip arrow using a layer list. And showing this as a popup window. But that pop-up left and right ends are cutting for Large tablets on portrait mode.
Structure :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:paddingStart="-10dp">
<item android:top="20dp" >
<shape android:shape="rectangle" >
<corners android:radius="8dp"/>
<padding android:top="20dp" android:right="10dp"/>
</shape>
</item>
<item android:top="1dp" android:bottom="1dp" >
<shape android:shape="rectangle">
<size android:width="206dp" android:height="100dp" />
<solid android:color="#FFF" />
<stroke
android:width="2dp"
android:color="#d9d9d9" />
<corners android:radius="2dp" />
</shape>
</item>
<item
android:width="20dp"
android:height="20dp"
android:end="14dp"
android:gravity="end"
android:top="-10dp">
<rotate android:fromDegrees="45"
>
<shape android:shape="rectangle" >
<solid android:color="#d9d9d9" />
<stroke
android:width="2dp"
android:color="#d9d9d9" />
</shape>
</rotate>
</item>
<item
android:width="20dp"
android:height="20dp"
android:end="14dp"
android:gravity="end"
android:top="-7dp"> //here, -12 + 3 = -9
<rotate
android:fromDegrees="45">
<shape
android:shape="rectangle">
<solid
android:color="@color/white_color" />
</shape>
</rotate>
</item>
</layer-list>
popup.xml be like :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:background="@drawable/shadow_recta">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:id="@+id/btn_logout"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:background="#FFFFFF"
android:clickable="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_weight="0.6"
android:fontFamily="@font/open_sans"
android:text="Log out"
android:textColor="#515151"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:id="@+id/btn_help"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:background="#FFFFFF"
android:clickable="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_weight="0.6"
android:fontFamily="@font/open_sans"
android:text="Help"
android:textColor="#515151"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:id="@+id/txt_report"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:clickable="true"
android:focusable="true"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_marginLeft="20dp"
android:layout_weight="1"
android:fontFamily="@font/open_sans"
android:gravity="center_vertical"
android:text="Report an issue"
android:textColor="#515151"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:id="@+id/btn_history"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:layout_marginBottom="3dp"
android:background="#f6f6f6"
android:clickable="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="@+id/history_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="20dp"
android:layout_weight="0.75"
android:fontFamily="@font/open_sans"
android:text="Unsubmitted Inspections"
android:textColor="#515151"
android:textSize="16dp" />
<RelativeLayout
android:id="@+id/relativelayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.25"
android:gravity="center">
<ImageView
android:id="@+id/myImageView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="@drawable/ic_icons_badges_gr_count_ylw" />
<TextView
android:id="@+id/ImageViewText"
android:layout_width="12dp"
android:layout_height="12dp"
android:layout_alignLeft="@id/myImageView"
android:layout_alignTop="@id/myImageView"
android:layout_alignRight="@id/myImageView"
android:layout_alignBottom="@id/myImageView"
android:fontFamily="@font/open_sans_semibold"
android:gravity="center"
android:text="0"
android:textAlignment="center"
android:textColor="#000000"
android:textSize="12sp" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
And the popup opened using below code :
LayoutInflater inflater = (LayoutInflater) getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = inflater.inflate(R.layout.popup, null);
PopupWindow mypopupWindow = new PopupWindow(view,850, RelativeLayout.LayoutParams.WRAP_CONTENT, true);
mypopupWindow.setBackgroundDrawable(new ColorDrawable(Color.WHITE));
mypopupWindow.showAsDropDown(v,0,10);
mypopupWindow.setElevation(20);
How can I make it compatible with all devices on both orientations?
You have set custom width to the layout. That's why it's getting cut in some devices. Try applying proper width according to device size.