Create a custom pop-up dialog box

Question

I am currently trying to create a popup menu when I click the menu button, as shown in the following screen:

I tried popupwindow methods but could not reach the exact case. This is how I try:

private View.OnClickListener showPopupWindow() { return new View.OnClickListener() { @Override public void onClick(View v) { PopupWindow popUp = popupWindowsort(); popUp.showAsDropDown(v, 1, 1); // show popup like dropdown list } }; } private PopupWindow popupWindowsort() { // initialize a pop up window type popupWindow = new PopupWindow(context); ArrayList<String> sortList = new ArrayList<String>(); sortList.add("VIEW FULL"); sortList.add("REPORT"); sortList.add("ADD TO LIST"); sortList.add("ADD TO CART"); ArrayAdapter<String> adapter = new ArrayAdapter<String>(context, R.layout.drop_down_line, sortList); // the drop down list is a list view ListView listViewSort = new ListView(context); // set our adapter and pass our pop up window contents listViewSort.setAdapter(adapter); // set on item selected listViewSort.setOnItemClickListener(onItemClickListener()); // some other visual settings for popup window popupWindow.setFocusable(true); popupWindow.setWidth(300); popupWindow.setBackgroundDrawable(getResources().getDrawable(R.drawable.background)); popupWindow.setHeight(WindowManager.LayoutParams.WRAP_CONTENT); // set the listview as popup content popupWindow.setContentView(listViewSort); return popupWindow; } private AdapterView.OnItemClickListener onItemClickListener() { return new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView parent, View view, int position, long id) { if (position == 0) { // adapter.notifyDataSetChanged(); } else if (position == 1) { report_lay.setVisibility(View.VISIBLE); // adapter.notifyDataSetChanged(); } else { // adapter.notifyDataSetChanged(); Log.i(TAG, "position2 " + position); } dismissPopup(); } }; } private void dismissPopup() { if (popupWindow != null) { popupWindow.dismiss(); } } 

But I get the following result:

and it also causes a problem in marshmallows.

How to create / create such a popup menu? Any help would be appreciated

Answer 1

You should use PopupMenu instead of PopupWindow .

Code example:

 public class MainActivity extends AppCompatActivity { private Context context; private ImageView img; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); context = this; img = (ImageView) findViewById(R.id.imageView); img.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { PopupMenu popup = new PopupMenu(MainActivity.this, v); popup.getMenuInflater().inflate(R.menu.pop_up, popup.getMenu()); popup.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() { public boolean onMenuItemClick(MenuItem item) { Toast.makeText(MainActivity.this, "You Clicked : " + item.getTitle(), Toast.LENGTH_SHORT).show(); return true; } }); popup.show();//showing popup menu } }); } } 

layout:

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/base" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/white" android:orientation="horizontal"> <RelativeLayout android:layout_width="match_parent" android:layout_height="50dp" android:layout_alignParentStart="true" android:layout_alignParentTop="true" android:background="#D6D7D7"> <ImageView android:id="@+id/imageView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentEnd="true" android:layout_centerVertical="true" android:layout_marginEnd="20dp" android:gravity="center" android:src="@mipmap/more" /> </RelativeLayout> </RelativeLayout> 

menu / pop_up.xml

 <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/add" android:title="@string/one" /> <item android:id="@+id/sub" android:title="@string/two" /> <item android:id="@+id/mul" android:title="@string/three" /> <item android:id="@+id/div" android:title="@string/four" /> </menu> 

Update: Change Background Color Menu

Use this style in your theme.

 <resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> <!--Add modified themes--> <item name="android:popupMenuStyle">@style/PopupMenu</item> <item name="popupMenuStyle">@style/PopupMenu</item> <item name="android:itemTextAppearance">@style/itemTextStyle.AppTheme</item> </style> <style name="PopupMenu" parent="@android:style/Widget.PopupMenu"> <item name="android:popupBackground">#B4B52B</item> </style> <style name="itemTextStyle.AppTheme" parent="@android:style/TextAppearance.Widget.IconMenu.Item"> <item name="android:textColor">@color/white</item> </style> </resources>