All Products
Search
Document Center

Extend upper-right pop-up menu

Last Updated: Mar 11, 2021

This section describes how to extend custom options in the pop-up menu and respond user’s tapping event.

Procedure

  1. Ensure that mp_ta_showOptionMenu configuration is enabled. See HTML5 container configuration for more information.
  2. Use TinyPopMenuItem.Builder class to create TinyPopMenuItem object.
    • Builder class supports setting option name, icon (URL and drawable supported), and event callback event.
    • To call setId method of Builder class, you need to guarantee the uniqueness of ID.
  3. The appId of the mini program and the path of the pop-up menu’s page are carried in the second parameter of onClick method of the event callback object.
  4. Set TinyPopMenuProvider instance object to the container before opening the mini program.

Code sample

 
  1. H5Utils.setProvider(TinyPopMenuProvider.class.getName(), new TinyPopMenuProvider() {
  2. @Override
  3. public List<TinyPopMenuItem> fetchMenuItems(String appId) {
  4. List<TinyPopMenuItem> items = new ArrayList<>();
  5. TinyPopMenuItem urlItem = new TinyPopMenuItem.Builder()
  6. .setId("1000")
  7. .setIconUrl("https://gw-office.alipayobjects.com/basement_prod/3d46378a-6e4f-4aa1-820e-fd16da76b457.png")
  8. .setName("About")
  9. .setCallback(new TinyPopMenuItem.TinyPopMenuItemClickListener() {
  10. @Override
  11. public void onClick(Context context, Bundle bundle) {
  12. String appId = bundle.getString("appId");
  13. String path = bundle.getString("page");
  14. Toast.makeText(context, "application ID=" + appId + ",page=" + path, Toast.LENGTH_LONG).show();
  15. }
  16. })
  17. .build();
  18. items.add(urlItem);
  19. TinyPopMenuItem localItem = new TinyPopMenuItem.Builder()
  20. .setId("1001")
  21. .setIcon(getResources().getDrawable(R.drawable.smile))
  22. .setName("Start")
  23. .setCallback(new TinyPopMenuItem.TinyPopMenuItemClickListener() {
  24. @Override
  25. public void onClick(Context context, Bundle bundle) {
  26. Toast.makeText(context, "Start" + bundle.toString(), Toast.LENGTH_LONG).show();
  27. }
  28. })
  29. .build();
  30. items.add(localItem);
  31. return items;
  32. }
  33. });