UI
Overview
Present temporary content with sheet, alert, and related modifiers.
Presentation modifiers are methods of Modifier from onescript/views and work in App and Action views. Widgets do not support them.
| Modifier | Purpose |
|---|---|
sheet | Slide a card up from the bottom that can be swiped away. |
fullScreenCover | Cover the whole screen; you provide the close button. |
popover | Show a bubble next to a view. |
alert | Show an alert, optionally with text fields. |
confirmationDialog | Show a set of actions to choose from. |
presentationDetents | Set the heights a sheet can rest at. |
presentationDragIndicator | Show or hide the sheet's drag indicator. |
presentationContentInteraction | Choose whether swiping resizes the sheet or scrolls its content. |
presentationBackgroundInteraction | Choose whether the page behind a sheet can be used. |
interactiveDismissDisabled | Prevent swipe to dismiss. |
Controlled state
The script owns the presentation state: isPresented decides whether it shows, and onDismiss is required.
- When the user dismisses natively (swiping a sheet down, tapping an alert button, tapping outside a popover), OneScript calls
onDismiss, where you setisPresentedtofalse. - When the script sets
isPresentedtofalseitself, the presentation closes without callingonDismiss. - If
onDismissleaves the statetrue, the content is presented again. To stop the user from dismissing, useinteractiveDismissDisabled.
import { app } from "onescript"
import { Button, Modifier, Text, useState } from "onescript/views"
function Screen() {
const [shown, setShown] = useState(false)
return (
<Button
action={() => setShown(true)}
modifier={Modifier.sheet({
isPresented: shown,
onDismiss: () => setShown(false),
content: <Text>Hello</Text>,
})}
>
Show
</Button>
)
}
await app.show(<Screen />)Behavior
- Modifiers chained before a presentation modifier apply to the modified view, and modifiers chained after it apply to the whole result, matching SwiftUI's modifier order.
- Keep presentation modifiers attached and only toggle
isPresented. Adding or removing one between renders recreates the modified view and loses the component state inside it. - Presentation modifiers also work on a root
NavigationStackorTabView.
How is this guide?
Last updated on