navigateModalScreen
navigateModalScreen action enables users to open a specific screen or page as a modal overlay, creating a temporary and focused view to capture user input or display additional content without losing context of the main app flow.
Properties
Property | Type | Description |
---|---|---|
name | string | Enter the Name or ID of your screen |
inputs | object | Specify the key/value pairs to pass into the next Screen |
onModalDismiss | action | Execute an Action when the modal screen is dismissed |
properties-options
Property | Type | Description |
---|---|---|
closeToasts | boolean | Determines whether toasts (temporary messages) should be closed automatically. Default is true . |
Note: To close the modal from within the modal screen, just call the navigateBack action
Example
View:
title: "Action: navigateModalScreen"
styles:
scrollableView: true
body:
Column:
styles: { gap: 16, padding: 24 }
children:
- Markdown:
text: You can open new screen on above the main screen using action `navigateModalScreen`
- Button:
label: Show Modal
onTap:
navigateModalScreen:
name: Actions & events
- Markdown:
text: You can navigateModalScreen from code blocks using `ensemble.navigateModalScreen('ScreenName');`.
- Button:
label: Show Modal Using Code
onTap:
executeCode:
body: |
//@code
// no inputs
ensemble.navigateModalScreen('Actions & events');
//with inputs
//ensemble.navigateModalScreen({name: 'Actions & events',inputs:{input1: 'abc', input2: 'ced'}} );
You can try complete example here (opens in a new tab)