[iOS] Overflow Actions (onto main branch)

[robin-liao]

Related Issue

ActionSet overflow flyout (... actions menu) 4715

Description

To introduce a new feature of overflow actions, the implementation follows the spec:

1. This new feature will bring as part of Schema version 1.5

2. Introduce a new property field mode to all Action type. Its value can be primary (default) or secondary. For all secondary action instances in the same actions array (either the root level actions section or ActionSet inside card elements) they'll group as overflow actions, wrap up within a "..." button and display flyout context menu when user clicks "..." button.

3. hostConfig.actions.maxActions doesn't count "..." button itself.

4. Client callbacks are added to ACRActionDelegate to control overflow button "..." and flyout menu actions rendering:

   • - (BOOL)onRenderOverflowAction:(UIButton *)button forTarget:(ACROverflowTarget *)target isAtRootLevelActions:(BOOL)isAtRootLevelActions;

     • Description: It will be called when “…” overflow button will be rendered.
     • Parameters:
       • button: the current "..." overflow button
       • target: the target to trigger popup menu or current "..." overflow button. Client can access its associated menu item actions through target.menuItems, or add this target to any UIButton to trigger the popup
       • isRootLevelActions: indicates if the current "..." overflow action belongs to root level actions array. If it's NO then it indicates it's in ActionSet as body elements.
     • Return:
       • Client callback requires to return a BOOL. Returning NO means let SDK continue to render "..." button, while returning YES informs SDK don't render the current "..." button.

   • - (BOOL)onDisplayOverflowActionMenu:(NSArray<ACROverflowMenuItem *> *)menuItems alertController:(UIAlertController *)alert;

     • Description: It will be called when overflow context menu will be shown.
     • Parameters:
       • menuItems: the action items on the overflow menu associated with the current triggered overflow "..." button
       • alert: presentable-ready alert controller. Client can just use its view controller to present this. Or client can grab menuItems to prepare its own overflow menu
     • Return:
       • Client callback requires to return aBOOL value. If client returns NO, SDK will continue to present default overflow menu in action sheet, while returning YES informs SDK don't display the popup overflow menu.

   • - (BOOL)shouldAllowMoreThanMaxActionsInOverflowMenu;

     • Client callback requires to return a BOOL value. Returning YES indicates that the actions exceeding the number defined in hostConfig.actions.maxActions will be auto wrapped up as overflow actions and "..." button for context menu will be displayed and NO indicates excess action elements will be left out.

Sample Card

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.5",
  "body": [
    {
      "type": "Image",
      "url": "https://adaptivecards.io/content/adaptive-card-50.png"
    },
    {
      "type": "TextBlock",
      "text": "Overflow Action Test Card!",
      "size": "large",
      "weight": "bolder"
    },
    {
      "type": "TextBlock",
      "text": "ActionSet **all secondary actions**"
    },
    {
      "type": "ActionSet",
      "actions": [
        {
          "type": "Action.Submit",
          "title": "Action Submit",
          "data": {
            "key": "Submit from overflow menu"
          },
          "mode": "secondary"
        },
        {
          "type": "Action.OpenUrl",
          "title": "OpenUrl",
          "url": "https://github.com/Microsoft/AdaptiveCards",
          "iconUrl": "https://www.clipartmax.com/png/full/211-2118815_file-novosel-mushroom-svg-mario-mushroom-icon.png",
          "mode": "secondary"
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "ActionSet **primary + secondary actions**"
    },
    {
      "type": "ActionSet",
      "actions": [
        {
          "type": "Action.Submit",
          "title": "Submit",
          "data": {
            "key": "Submit from overflow menu"
          },
          "mode": "Primary"
        },
        {
          "type": "Action.Submit",
          "title": "Edit",
          "data": {
            "key": "Delete from overflow menu"
          },
          "mode": "Secondary"
        },
        {
          "type": "Action.Submit",
          "title": "Delete",
          "data": {
            "key": "Delete"
          },
          "mode": "Secondary"
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "Check actions.length > maxActions"
    },
    {
      "type": "ActionSet",
      "actions": [
        {
          "type": "Action.Submit",
          "title": "Action 1",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 2",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 3",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 4",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 5",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 6",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 7",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 8",
          "mode": "primary"
        },
        {
          "type": "Action.Submit",
          "title": "Action 9",
          "mode": "primary"
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "========= I am bottom line of body ========="
    }
  ],
  "actions": [
    {
      "type": "Action.OpenUrl",
      "title": "Root - OpenUrl",
      "url": "https://adaptivecards.io"
    },
    {
      "type": "Action.Submit",
      "title": "Root - Submit",
      "data": {
        "key": "Submit from overflow menu"
      },
      "mode": "Secondary"
    },
    {
      "type": "Action.OpenUrl",
      "iconUrl": "https://adaptivecards.io/content/cats/2.png",
      "url": "https://adaptivecards.io",
      "title": "Root - OpenUrl",
      "mode": "Secondary"
    },
    {
      "type": "Action.ShowCard",
      "title": "Root - ShowCard",
      "card": {
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "TextBlock",
            "text": "What do you think?"
          }
        ],
        "actions": [
          {
            "type": "Action.Submit",
            "title": "Neat!"
          }
        ]
      },
      "mode": "Secondary"
    }
  ]
}

How Verified

Updated ADCIOSVisualizer "ViewController.m" to test the different scenarios.

Overflow	Displaying Menu

[paulcam206]

alignment here looks a bit off