跳转至
Structure

Ellipse

An ellipse shape, similar to a circle but with potentially different width and height.

Declaration

@frozen struct Ellipse : Shape

Overview

An Ellipse is a circular Shape that by default, aligns itself inside of the view containing it. It differs from Circle in that its width and height are not necessarily equal.

To define an Ellipse with a specific color and frame, use the fill(_:style:) and frame(width:height:alignment:) modifiers:

struct ExampleView: View {
    var body: some View {
        Ellipse()
            .fill(Color.purple)
            .frame(width: 250, height: 150)
    }
}
A view containing a purple filled ellipse with a frame of width 250 and height 150.

To add a border, use the stroke(_:lineWidth:) modifier, and use the inset(by:) modifier to inset the Ellipse by half of the border width to keep the Ellipse at its original size:

struct ExampleView: View {
    var body: some View {
        Ellipse()
            .inset(by: 10)
            .stroke(Color.purple, lineWidth: 20)
            .frame(width: 250, height: 150)
    }
}
A view containing an ellipse with an inset of 10, a purple stroke / outline of line width 20, and a frame of width 250 and height 150.

Availability

iOS 13.0+

macOS 10.15+

tvOS 13.0+

watchOS 6.0+

Topics


Instance Method

inset(by:) Returns a Ellipse insetted by the amount specified.

path(in:) Used to describe an Ellipse as a path in a CGRect.


Type Alias

AnimatableData The type defining the data to animate.

Body The type of view representing the body of this view.

InsetShape The type of the inset shape.


Initializer

init() Creates an Ellipse that aligns itself inside of the view containing it by default.