View

Creates a view that pads this view using the specified edge instets with a specified value.

Creates a view that pads this view using the values inside of EdgeInsets.

Creates a view that pads this view along all edge insets by the amount you specify.

Creates a view that pads this view along all edges by a default amount.

Sets the frame of a view with specified width and/or height.

Pass at least one size parameter. Any nil or unspecified dimensions won’t be applied to the frame.

Specified dimensions will set the exact width or height of the view with required priority. You are responsible for making sure that the constraints don’t conflict with other views’ constraints.

Sets the frame of a view with specified max/min width and/or height.

Pass at least one size parameter. Any nil or unspecified dimensions won’t be applied to the frame.

Specify minimum or maximum dimensions when you want to constraint the frame of a view that can dynamically change it’s size because of parent, child or sibling views.

Tip: Pass .infinity to either maxWidth or maxHeight when you want the view’s dimension to stretch as far as it’s parent allows it to.

This is to inform invalid case. frame() should always be called with at least one parameter.

Adds a contextual menu to this view.

Use contextual menus to add actions that change depending on the user’s current focus and task.

Important: Only Buttons with Image or Text are allowed. The following 3 view combinations are allowed for building a contextual menu:

Text("Control Click Me")
.contextMenu {
    // First combination
    Button(Text("Add")) {}
    // Second combination
    Button(action: {}) {
        Image()
    }
    // Third combination
    Button(action: {}) {
        Text("Add")
        Image()
    }
}

Attaches a ContextMenu and its children to self.

This modifier allows for the contextual menu to be conditionally available by passing nil as the value for contextMenu.

Layers a secondary view in front of this view.

When you apply an overlay to a view, the original view continues to provide the layout characteristics for the resulting view. For example, the layout for the caption in this view fits within the width of the image:

Image(name: "artichokes")
    .overlay(
        HStack {
            Text("Artichokes"), // Text to use as a caption.
            Spacer()
        }
        .padding()
        .foregroundColor(.white)
        .background(Color.black.opacity(0.5)),

        alignment: .bottom
    )

Adds a border to this view with the specified style and width.

By default, the border appears inside the bounds of this view. In this example, the four-point border covers the text:

Text("Artichokes")
.font(.title)
.border(Color.green, width: 4)

To place a border around the outside of this view, apply padding of the same width before adding the border:

Text("Artichokes")
.font(.title)
.padding(4)
.border(Color.green, width: 4)

Sets the view’s content mode only when it’s resizable.

Image()
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 200, height: 200)

Scales this view to fit its parent.

This view’s aspect ratio is maintained as the view scales. This method is equivalent to calling aspectRatio(contentMode: .fit).

 Image()
 .resizable()
 .scaledToFit()
 .frame(width: 200, height: 200)

Scales this view to fill its parent.

This view’s aspect ratio is maintained as the view scales. This method is equivalent to calling aspectRatio(contentMode: .fill).

 Image()
 .resizable()
 .scaledToFill()
 .frame(width: 200, height: 200)

Set the foreground color within self.

Changes the constraints of this view so that it matches the window on the specified edges. Important: Don’t use this on views that don’t touch the edges of the safe area on the edges that you want to ignore.

Sets the accent color for this view and the views it contains.

The system uses the accent color for common controls and containers. For example, a button’s label might use the accent color for its text.

Adds a condition that controls whether users can interact with this view.

Disabling a view will also disable all of its children, regardless of the children being disabled or not. For example, the following button is not interactable

HStack {
    Button(Text("Action")) {}
    .disabled(true)
}
.disabled(false)

Sets the transparency of this view.

Apply opacity to reveal views that are behind another view or to de-emphasize a view.

When applying the opacity(_:) modifier to a view that already has an opacity, the modifier supplements—rather than replaces—the view’s opacity.

Clips this view to its bounding rectangular frame.

By default, a view’s bounding frame is used only for layout, so any content that extends beyond the edges of the frame is still visible. Use the clipped() modifier to hide any content that extends beyond these edges.

Clips this view to its bounding frame, with the specified corner radius.

By default, a view’s bounding frame only affects its layout, so any content that extends beyond the edges of the frame remains visible. Use the cornerRadius() modifier to hide any content that extends beyond these edges while applying a corner radius.

The following code applies a corner radius of 20 to a square image:

Image(name: "square")
    .cornerRadius(20)

Adds a shadow to this view.

Tip: If you want to apply a shadow on a clipped view, you must apply to its parent view instead. Example:

Image(name: "square")
    .cornerRadius(20)
    .padding(0)
    .shadow(radius: 2)

Sets the default font for text in this view.

Sets the keyboard type for text input controls in this view.

Hides the navigation bar for this view.

This modifier only takes effect when this view is inside of and visible within a NavigationView.

Hides the status bar for this view.

This modifier only takes effect when this view is visible.

Sets the status bar style for this view.

Note: Not available in SwiftUI.

Sets the maximum number of lines that text can occupy in this view.

The line limit applies to all Text instances within this view. For example, an HStack with multiple pieces of text longer than three lines caps each piece of text to three lines rather than capping the total number of lines across the HStack.

Returns a version of self that will invoke action after recognizing a tap gesture.

Sets the priority by which a parent layout should apportion space to this child.

The default priority is 0. In a group of sibling views, raising a view’s layout priority encourages that view to shrink later when the group is shrunk and stretch sooner when the group is stretched.

A parent layout should offer the child(ren) with the highest layout priority all the space offered to the parent minus the minimum space required for all its lower-priority children, and so on for each lower priority value.

Hides labels for controls that contain a descriptive label by default.

Sets the tag of the view, used for selecting from a list of View options.

Sets the tab item information for the tab root view Important: You must provide both one Text and Image only.

Sets the alignment on text when spanning multiple lines.

Executes the action when the view appears on screen.

Executes the action when the view disappears from the screen.

Returns a modified version of the view, which is modified by the modifier parameter.

Masks the view with another view. The view passed as parameter will act as the mask.

Sets the coordinate space name for this view. GeometryProxy types can identify this view’s coordinate space by the name set, when resolving frames.

Attaches gesture to self such that it has higher precedence than gestures defined by self.

Attaches gesture to self such that it will be processed simultaneously with gestures defined by self.

Updates the listener with the view’s geometry proxy.

Updates in the view layout will update the value contained in the reader binding. Use this when you want to reference the view’s frame or size in any coordinate space.

Defines the edge insets of a List’s cells.

Pass an empty EdgeInsets value when you want to remove the default cell left padding. Important: You must set the listRowInsets in the topmost view element in the hierarchy of a List’s cell. Example:

List(myData) { data in
    VStack {
        Text("Element \(data.name)")
    }
    .listRowInsets(EdgeInsets())
}

Sets the semantic meaning for all text entry elements in the hierarchy. Functions such as keyboard suggestions will show up depending on the content type and user data.

DragBegan and DragEnd closures are added. Not in accordance with SwiftUI Compatibility.

Activates this view as the source of a drag and drop operation.

Applying the onDrag(_:) modifier adds the appropriate gestures for drag and drop to this view. When a drag operation begins, a rendering of this view is generated and used as the preview image.

Defines the destination for a drag and drop operation, using the same size and position as this view, handling dropped content with the given closure.

Strict updates during high performance rendering will update this view but not its children views. This should be used for collection types when you want to get a slight performance gain by preventing children from updating.

One example for using this, is if you want to modify the opacity of a collection of views. Setting this value will modify the opacity of the group, affecting all children views equally without updating them individually.

VStack {
    Text("One")
    Text("Two")
}
.opacity(offset.y)
.strictHighPerformanceUpdate()

See High Performance Updates in the documentation for more information.

Skip update rendering on this view completely during high performance rendering.

See High Performance Updates in the documentation for more information.

Sets the title of the navigation bar

Sets leading and trailing views. AltSwiftUI: Only Button<Text>, Button<Image> and HStack with data of Button type is allowed.

Sets leading view. AltSwiftUI: Only Button<Text>, Button<Image> and HStack with data of Button type is allowed.

Sets trailing view. AltSwiftUI: Only Button<Text>, Button<Image> and HStack with data of Button type is allowed.

Presents a sheet.

Presents an alert.

Presents an action sheet.

Presents a StoreKit overlay when a given condition is true.

You use appStoreOverlay to display an overlay that recommends another app. The overlay enables users to instantly view the other app’s page on the App Store.

When isPresented is true, the system will run configuration to determine how to configure the overlay. The overlay will automatically be presented over the current scene.

Sets an environment object as a global object. Views can access this object through the EnvironmentObject property wrapper and listen to changes in an ObservableObject.

Applies a transform effect to the view

Applies a location offset based on a size. Modifying a view’s offset won’t affect its layout or related views’ layout.

Applies a location offset based on a x and y. Modifying a view’s offset won’t affect its layout or related views’ layout.

Applies a rotation effect. Modifying a view’s rotation won’t affect its layout or related views’ layout.

Applies a scale effect based on a size scale. Modifying a view’s scale won’t affect its layout or related views’ layout.

Applies a scale effect based on a scale for both width and height. Modifying a view’s scale won’t affect its layout or related views’ layout.

Sets the animation to affect all previously defined view properties.

Setting a value of nil will impose impose no animation to the properties even if a value was changed inside a withAnimation closure.

Animations can be set to different subset of properties. Example:

Text("Example")
    .offset(x: 5)
    .animation(nil)
    .scale(0.5)
    .animation(.default)

Sets a transition for when a view appears and disappears.

Important: In order for transitions to be animated, either modify a property inside a withAnimation closure or set a .animation() property to the view.

Setting a custom animation as part of a custom transition definition will not trigger an animation, but will override existing withAnimation animations. This is the priority of animations applied to transitions:

.animation() -> AnyTransition.animation() -> withAnimation

Appearing events happen when a view is conditionally not included in a hierarchy, and conditionally removed from it. Example:

VStack {
    if showExample {
        Text("Example")
            .transition(.opacity)
    }
}

Uses the specified string to identify the view.