Docs
BlogChangelogStar Us on GitHub
HomeGuidesEASReferenceLearn

Reference version

ArchiveExpo SnackDiscord and ForumsNewsletter

SwiftUI

SwiftUI components for building native iOS interfaces with @expo/ui.

iOS
tvOS
Included in Expo Go

GitHub

npm

Changelog

Bundled version:
~56.0.18

The SwiftUI components in @expo/ui/swift-ui allow you to build fully native iOS interfaces using SwiftUI from React Native.

Installation

Terminal
- npx expo install @expo/ui

If you are installing this in an existing React Native app, make sure to install expo in your project.

Usage

Using a component from @expo/ui/swift-ui requires wrapping it in a Host component. The Host is a container for SwiftUI views.

import { Host, Button } from '@expo/ui/swift-ui';

export function SaveButton() {
  return (
    <Host style={{ flex: 1 }}>
      <Button label="Save changes" />
    </Host>
  );
}

For more information, see the following resources:

Expo UI guide for Swift UI

Learn about the basics of @expo/ui/swift-ui
Extending with SwiftUI

Create custom SwiftUI components and modifiers that integrate with Expo UI.
Expo UI iOS Liquid Glass Tutorial
Expo UI iOS Liquid Glass Tutorial

Learn how to build real SwiftUI views in your React Native app with the new Expo UI.

Available components

ComponentDescription
AccessoryWidgetBackgroundAdaptive background view that provides a standard appearance based on the the widget's environment.
AlertAlert component for presenting native iOS alert dialogs.
BottomSheetBottomSheet component that presents content from the bottom of the screen.
ButtonButton component for displaying native buttons.
ColorPickerColorPicker component for selecting colors.
ConfirmationDialogConfirmationDialog component for presenting confirmation prompts.
ContextMenuContextMenu component for displaying context menus.
ControlGroupControlGroup component for grouping interactive controls.
DatePickerDatePicker component for selecting dates and times.
DisclosureGroupDisclosureGroup component for displaying expandable content.
DividerDivider component for creating visual separators.
FormForm component for collecting user input in a structured layout.
GaugeGauge component for displaying progress with visual indicators.
GroupGroup component for grouping views without affecting layout.
HostHost component that enables SwiftUI components in React Native.
HStackHStack component for horizontal layouts.
ImageImage component for displaying SF Symbols.
LabelLabel component for displaying text with an icon.
LazyHStackLazyHStack component for lazy horizontal layouts.
LazyVStackLazyVStack component for lazy vertical layouts.
LinkLink component for displaying clickable links.
ListList component for displaying scrollable lists of items.
MenuMenu component for displaying dropdown menus.
NamespaceA Namespace component that allows you create Namespaces in SwiftUI
OverlayOverlay component for layering content on top of another view.
PickerPicker component for selecting options from a list.
PopoverPopover component for displaying content in a floating overlay.
ProgressViewProgressView component for displaying progress indicators.
RNHostViewA component that enables React Native views inside SwiftUI.
ScrollViewScrollView component for scrollable content.
SectionSection component for grouping content within lists and forms.
SecureFieldSecureField component for password input.
SliderSlider component for selecting values from a range.
SpacerSpacer component for flexible spacing.
SwipeActionsSwipeActions component for adding leading and trailing swipe actions to row content.
TabViewTabView component for paged or tabbed content.
TextText component for displaying styled text with support for nested texts.
TextFieldTextField component for text input.
ToggleToggle component for displaying native toggles.
VStackVStack component for vertical layouts.
ZStackZStack component for overlapping layouts.