Multi-Purpose Native Modals

Trigger native bottom-sheet modal overlays and contextual action sheets. Nativine embeds native iOS UISheetPresentationController and Android BottomSheetDialog viewports, allowing web view triggers to present high-performance native dialogs.

1. Overview & Native Capabilities

Contextual bottom sheets provide fluid UI transitions for filter menus, share options, and action confirmations. Nativine's Multi-Purpose Modal plugin renders OS-native bottom sheet containers:

• Native Bottom Sheets & Detents: Present resizable bottom sheets with custom height detents (medium, large).
• Action Sheets & Option Pickers: Display native iOS/Android action sheets with custom option icons and destructive action styling.
• Embedded Web View Modals: Render secondary web view sub-routes inside an isolated native modal sheet container.

2. No-Code App Builder Setup Guide

Nativine App Builder Configuration

1. Open the Nativine App Builder at /web-to-app-converter-pro.
2. Click Add-ons & Plugins in the left builder menu and locate Multi-Purpose Native Modals.
3. Toggle Multi-Purpose Native Modals to ON (or click Enable), then click Config.
4. Configure your required settings, permissions descriptors, or target web parameters.
5. Click Save Config and navigate to the Builds tab to compile your mobile application.

3. Native JS Bridge API Reference

To trigger a native bottom sheet or action list in JavaScript, call nativine.modals.showActionSheet():

nativine.modals.showActionSheet({
  title: 'Choose Action',
  message: 'Select what you would like to do with this item.',
  options: [
    { label: 'Share Item', icon: 'share', id: 'opt_share' },
    { label: 'Delete Item', icon: 'trash', isDestructive: true, id: 'opt_delete' }
  ],
  callback: 'onActionSheetOptionSelected'
});

function onActionSheetOptionSelected(selection) {
  console.log("User selected option ID:", selection.optionId);
}

Parameters

4. Frequently Asked Questions (Q&A)