# How to open an actions menu (ActionSheet)

> Show an iOS-style action sheet at the bottom of the screen, with buttons and a Cancel.

Source: https://crossfly.dev/docs/cookbook/ui/menu-de-acoes — CrossFly documentation. Full docs as one file: https://crossfly.dev/llms-full.txt

# How to open an actions menu (ActionSheet)

**Purpose.** Show a list of contextual actions in a rounded card at the bottom
of the screen, with a separate "Cancel" button below (iOS pattern). Use it when the user
needs to choose among several actions related to an item ("Share", "Delete"...).

## APIs used
- `new ActionSheet(String cancelText, String... buttonTexts)` — creates the sheet. **The first argument is the Cancel text**; the rest are the option buttons (index 0, 1, 2...).
- `sheet.buttonAction(int index, Component.Action action)` — callback for the option button at that index.
- `sheet.cancelAction(Component.Action action)` — callback for the Cancel button (optional; by default it just closes).
- `sheet.buttonStyle(int index, ComponentStyle style)` — per-button style (e.g., paint "Delete" red).
- `sheet.buttonStyle(ComponentStyle style)` — default style for all option buttons.
- `sheet.cancelStyle(ComponentStyle style)` / `sheet.containerStyle(ComponentStyle style)` — styles for the Cancel button and the container card.
- `sheet.maxColumns(int cols)` — maximum number of columns when there are many buttons (default 1; only takes effect above 1).
- `ActionSheet.createDefaultButtonStyle()` — a ready-made base style (white background, blue text, `pressable`) for you to copy and modify.
- `sheet.show()` — displays it (inherited from `Window`).

> Non-obvious behavior: as in `Alert`, buttons without `buttonAction` just close the
> sheet when tapped. Cancel also closes by default.

## Complete example (copy, paste and run)
```java
package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;

/** Runnable main screen. Point the launcher (classname) and run: gradlew :lwjgl3:run */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      // Trigger button: opens the ActionSheet when tapped
      Button btn = new Button("Opções");
      btn.onAction(origin ->
      {
         ActionSheet sheet = new ActionSheet(
            "Cancelar",      // text of the Cancel button (1st argument)
            "Compartilhar",  // index 0
            "Excluir");      // index 1

         sheet.buttonAction(0, o ->
         {
            compartilhar();
            sheet.hide();
         });

         // Highlight the destructive action in red
         sheet.buttonStyle(1, ActionSheet.createDefaultButtonStyle().textColor(0xFFFF0000));
         sheet.buttonAction(1, o ->
         {
            excluir();
            sheet.hide();
         });

         sheet.show();
      });
      add(LAY_FILL, btn);
   }

   private void compartilhar()
   {
      // ... your sharing logic ...
   }

   private void excluir()
   {
      // ... your deletion logic ...
   }
}
```

> The snippet below shows **just the core**. To run it, place it in the `MainWindow` skeleton above.

## Minimal snippet
```java
ActionSheet sheet = new ActionSheet(
   "Cancelar",      // text of the Cancel button (1st argument)
   "Compartilhar",  // index 0
   "Excluir");      // index 1

sheet.buttonAction(0, origin ->
{
   compartilhar();
   sheet.hide();
});

// Highlight the destructive action in red
sheet.buttonStyle(1, ActionSheet.createDefaultButtonStyle().textColor(0xFFFF0000));
sheet.buttonAction(1, origin ->
{
   excluir();
   sheet.hide();
});

sheet.show();
```

> **Verification note (2026 code).** Confirmed in source: `ActionSheet(cancelText, String... buttonTexts)`,
> `buttonAction(int, Action)`, `cancelAction(Action)`, and there are `buttonStyle(int, ComponentStyle)`,
> `buttonStyle(ComponentStyle)`, `maxColumns(int)`. The default look (iOS card) is
> applied regardless of the Skin, but `defaultStyleCreate()` uses `getSkin().actionSheet()`
> for the window. The default width is ~92% of the screen (`widthRatio ≈ .92f`).

## Dig deeper
- Widget page: [ActionSheet](/docs/ui/widgets/actionsheet) · Canonical source: Chapter 16
- Sister recipes: [Confirm with Alert](/docs/cookbook/ui/confirmar-com-alert) · [Show a Hint](/docs/cookbook/ui/mostrar-um-hint)