PopMenu_en

🌐 View 简体中文文档 | 繁體中文文檔

📜 Context Menu PopMenu

Provides a lightweight menu that can attach to a View to expand or be displayed directly in the center of the screen for simple selection.

You can also use other themes to enrich the menu's style:

Displaying a Simple PopMenu

Use the following code to display a PopMenu

PopMenu.show("Add", "Edit", "Delete", "Share");

You can also use List<CharSequence> to set the menu content.

Setting Icons for PopMenu

To set a menu icon, you can specify it directly, or pass 0 if you don't want an icon for a menu item:

.setIconResIds(R.mipmap.img_dialogx_demo_add, R.mipmap.img_dialogx_demo_edit...)

Whether the icon is colored according to the light/dark color theme can be adjusted with the following method:

.setAutoTintIconInLightOrDarkMode(boolean)

(optional) Set the icon using a callback:

PopMenu.show("Add", "Edit", "Delete", "Share")
        .setOnIconChangeCallBack(new OnIconChangeCallBack<PopMenu>(true) {  //Parameter represents whether to color the icon according to the light/dark mode.
    @Override
    public int getIcon(PopMenu dialog, int index, String menuText) {
        switch (index) {
            case 0:
                return R.mipmap.img_dialogx_demo_add;
            case 1:
                return R.mipmap.img_dialogx_demo_edit;
            case 2:
                return R.mipmap.img_dialogx_demo_delete;
            case 3:
                return R.mipmap.img_dialogx_demo_share;
            default:
                return 0;    //Return 0 for no icon
        }
    }
});

Asynchronously Loading Menu Icons

Since version 0.0.50.beta27, you can also asynchronously load menu icons from the network. This feature requires the use of the new MenuIconAdapter. Here's how you can implement it:

.setOnIconChangeCallBack(new MenuIconAdapter<PopMenu>(false) {
    String[] urls = {
            "http://www.kongzue.com/test/res/dialogx/ic_menu_add.png",
            "http://www.kongzue.com/test/res/dialogx/ic_menu_read_later.png",
            "http://www.kongzue.com/test/res/dialogx/ic_menu_link.png"
    };
    @Override
    public boolean applyIcon(PopMenu dialog, int index, String menuText, ImageView iconImageView) {
        Glide.with(MainActivity.this).load(urls[index]).into(iconImageView); // Example of loading network resources into menu icons using Glide
        return true;
    }
});

In the applyIcon callback method, the ImageView iconImageView for the menu icon is exposed, allowing you to use any asynchronous framework to load the icon resource. The return value of true indicates that the icon for this menu item should be displayed, while returning false will hide the icon for that menu item.

Displaying a PopMenu and Making it Attach to a View to Expand

PopMenu.show(view, new String[]{"Option 1", "Option 2", "Option 3"})
    .setOverlayBaseView(true);

To Adjust the Attachment Position, Refer to the Image Below

Example code:

PopMenu.show(view, new String[]{"Option 1", "Option 2", "Option 3"})
        .setOverlayBaseView(false)
        .setAlignGravity(Gravity.BOTTOM | Gravity.CENTER_HORIZONTAL);

Whether the menu overrides the bound view：

Example code:

.setOverlayBaseView(false)

Menu Click Callback

PopMenu.show("Option 1", "Option 2", "Option 3")
        .setOnMenuItemClickListener(new OnMenuItemClickListener<PopMenu>() {
            @Override
            public boolean onClick(PopMenu dialog, CharSequence text, int index) {
                btnSelectMenu.setText(text);
                return false;
            }
        });

You can also use the getSelectIndex() method to get the index of the selected menu item, or getSelectMenuText() to get the text of the selected menu item.

Setting a Selected Item

Set a menu item as selected (the menu background will show a selected state).

.setPressedIndex(index)

After setting, the menu item at the specified index will show a selected state (background color) when the menu is displayed.

Lifecycle Callbacks

To monitor the lifecycle of a dialog, you can implement the .setDialogLifecycleCallback(...) interface. It's recommended to use the build() method to construct the dialog:

PopMenu.build()
        .setMenuList(new String[]{"Option 1", "Option 2", "Option 3"})
        .setDialogLifecycleCallback(new DialogLifecycleCallback<PopMenu>() {
            @Override
            public void onShow(PopMenu dialog) {
                super.onShow(dialog);
            }
            
            @Override
            public void onDismiss(PopMenu dialog) {
                super.onDismiss(dialog);
            }
        })
        .show();

PopMenu also supports Lifecycle. You can get the Lifecycle object using .getLifecycle().

You can also handle lifecycle events by overriding them when creating an instance using new, for example:

// Event overriding demonstration
new PopMenu() {
    @Override
    public void onShow(PopMenu dialog) {
        //...
        tip("onShow");
    }
    @Override
    public void onDismiss(PopMenu dialog) {
        //...
        tip("onDismiss");
    }
}

You can also use the methods .onShow(DialogXRunnable) and .onDismiss(DialogXRunnable) to handle lifecycle transactions, for example:

PopMenu.show(...)
        .onShow(new DialogXRunnable<PopMenu>() {
            @Override
            public void run(PopMenu dialog) {
                //PopMenu show!
            }
        })
        .onDismiss(new DialogXRunnable<PopMenu>() {
            @Override
            public void run(PopMenu dialog) {
                //PopMenu dismiss!
            }
        });

Custom Layout

To implement a custom layout in the dialog, first prepare your custom layout file, then build using the following method:

PopMenu.build()
        .setCustomView(new OnBindView<PopMenu>(R.layout.layout_custom_view) {
            @Override
            public void onBind(PopMenu dialog, View v) {
                
            }
        })
        .setMenuList(new String[]{"Option 1", "Option 2", "Option 3"})
        .show();

In the callback parameters, v is the instantiated component of your given layout file. You can instantiate other sub-layout components using v.findViewById(resId) and set their functionality and event callbacks in the onBind method.

Custom Enter and Exit Animations

Global Animation Modifications for PopMenu:

You can directly modify the global animations of PopMenu through static properties:

// Set global PopMenu enter animation duration
PopMenu.overrideEnterDuration = 1000;
// Set global PopMenu exit animation duration
PopMenu.overrideExitDuration = 1000;

Additional Methods

// Set menu content (List<CharSequence>, String[] or CharSequence[])
.setMenuList(...)

// set menu items
.setMenus("Add", "Edit", "Delete", "Share"...) ;)

// set icons
.setIconResIds(R.mipmap.img_dialogx_demo_add, R.mipmap.img_dialogx_demo_edit...)

// Close the dialog
.dismiss();

// Set menu height
.setHeight(int);

// Set menu width
.setWidth(int);

// Set menu text style
.setMenuTextInfo(TextInfo);

// Allow display beyond the screen
.setOffScreen(boolean);

// Overlay (attach) on the bound View
.setOverlayBaseView(boolean)

// Get the instantiated dialog object, you can use this method for deeper customization of the Dialog's functionality
.getDialogImpl()

// Get custom layout instance
.getCustomView()

// Set dialog corner radius (will clip the content display)
.setRadius(float px)

// Check if it is currently showing
.isShow()

// Front dialog box display hierarchy
.bringToFront()

// Specify the level of dialog display
.setThisOrderIndex(int)

Additional Components

TextInfo

TextInfo is used to store basic text style settings, containing a series of properties and their corresponding get/set methods, explained as follows:

Property	Explanation	Default Value
fontSize	Font size, use default style when value is -1, unit: dp	-1
gravity	Alignment, use default style when value is -1, values like Gravity.CENTER can be used	-1
fontColor	Text color, use default style when value is 1, values can be obtained with Color.rgb(r,g,b)	1
bold	Bold style	false

Please note, fontColor is a ColorInt value, you can set a HEX color with Color.parseColor("#4D000000"), or set a color resource with getResources().getColor(R.color.black30). Do not directly pass in a resource ID as it may be ineffective.

Specifying Style Individually

If your App incorporates multiple themes and you need a dialog to display in a specific non-global theme style in certain scenarios, you can use .build() to construct the dialog. Then, apply .setStyle(style) to specify the theme style, and finally execute .show() to display the dialog. For example:

PopMenu.build()
        // or directly use .build(IOSStyle.style())
        .setStyle(IOSStyle.style())
        .setMenuList(new String[]{"Menu 1", "Menu 2", "Menu 3"})
        .show();