The properties of a toggle instance.
When you define a custom toggle style by creating a type that conforms to
the ``ToggleStyle`` protocol, you implement the
``ToggleStyle/makeBody(configuration:)`` method. That method takes a
`ToggleStyleConfiguration` input that has the information you need
to define the behavior and appearance of a ``Toggle``.
The configuration structure's ``label-swift.property`` reflects the
toggle's content, which might be the value that you supply to the
`label` parameter of the ``Toggle/init(isOn:label:)`` initializer.
Alternatively, it could be another view that SwiftUI builds from an
initializer that takes a string input, like ``Toggle/init(_:isOn:)``.
In either case, incorporate the label into the toggle's view to help
the user understand what the toggle does. For example, the built-in
``ToggleStyle/switch`` style horizontally stacks the label with the
control element.
The structure's ``isOn`` property provides a ``Binding`` to the state
of the toggle. Adjust the appearance of the toggle based on this value.
For example, the built-in ``ToggleStyle/button`` style fills the button's
background when the property is `true`, but leaves the background empty
when the property is `false`. Change the value when the user performs
an action that's meant to change the toggle, like the button does when
tapped or clicked by the user.
Members (6)
get · iOS 13.0+
isOn
TypeScript
get isOn(): boolean
Swift declaration
@Binding var isOn: Bool { get nonmutating set }
A binding to a state property that indicates whether the toggle is on.
Because this value is a ``Binding``, you can both read and write it
in your implementation of the ``ToggleStyle/makeBody(configuration:)``
method when defining a custom ``ToggleStyle``. Access it through
that method's `configuration` parameter.
Read this value to set the appearance of the toggle. For example, you
can choose between empty and filled circles based on the `isOn` value:
Image(systemName: configuration.isOn
? "checkmark.circle.fill"
: "circle")
Write this value when the user takes an action that's meant to change
the state of the toggle. For example, you can toggle it inside the
`action` closure of a ``Button`` instance:
Button {
configuration.isOn.toggle()
} label: {
// Draw the toggle.
}
set · iOS 13.0+
isOn
TypeScript
set isOn(value: boolean)
Swift declaration
@Binding var isOn: Bool { get nonmutating set }
A binding to a state property that indicates whether the toggle is on.
Because this value is a ``Binding``, you can both read and write it
in your implementation of the ``ToggleStyle/makeBody(configuration:)``
method when defining a custom ``ToggleStyle``. Access it through
that method's `configuration` parameter.
Read this value to set the appearance of the toggle. For example, you
can choose between empty and filled circles based on the `isOn` value:
Image(systemName: configuration.isOn
? "checkmark.circle.fill"
: "circle")
Write this value when the user takes an action that's meant to change
the state of the toggle. For example, you can toggle it inside the
`action` closure of a ``Button`` instance:
Button {
configuration.isOn.toggle()
} label: {
// Draw the toggle.
}
get · iOS 13.0+
$isOn
TypeScript
get $isOn(): _SwiftUICore_Binding<boolean>
Swift declaration
var $isOn: Binding<Bool> { get }
get · iOS 13.0+
label
TypeScript
get label(): ToggleStyleConfiguration_Label
Swift declaration
let label: ToggleStyleConfiguration.Label
A view that describes the effect of switching the toggle between states.
Use this value in your implementation of the
``ToggleStyle/makeBody(configuration:)`` method when defining a custom
``ToggleStyle``. Access it through the that method's `configuration`
parameter.
Because the label is a ``View``, you can incorporate it into the
view hierarchy that you return from your style definition. For example,
you can combine the label with a circle image in an ``HStack``:
HStack {
Image(systemName: configuration.isOn
? "checkmark.circle.fill"
: "circle")
configuration.label
}
get · iOS 16.0+
isMixed
TypeScript
get isMixed(): boolean
Swift declaration
var isMixed: Bool
Whether the ``Toggle`` is currently in a mixed state.
Use this property to determine whether the toggle style should render
a mixed state presentation. A mixed state corresponds to an underlying
collection with a mix of true and false Bindings.
To toggle the state, use the ``Bool.toggle()`` method on the ``isOn``
binding.
In the following example, a custom style uses the `isMixed` property
to render the correct toggle state using symbols:
struct SymbolToggleStyle: ToggleStyle {
func makeBody(configuration: Configuration) -> some View {
Button {
configuration.isOn.toggle()
} label: {
Image(
systemName: configuration.isMixed
? "minus.circle.fill" : configuration.isOn
? "checkmark.circle.fill" : "circle.fill")
configuration.label
}
}
}
set · iOS 16.0+
isMixed
TypeScript
set isMixed(value: boolean)
Swift declaration
var isMixed: Bool
Whether the ``Toggle`` is currently in a mixed state.
Use this property to determine whether the toggle style should render
a mixed state presentation. A mixed state corresponds to an underlying
collection with a mix of true and false Bindings.
To toggle the state, use the ``Bool.toggle()`` method on the ``isOn``
binding.
In the following example, a custom style uses the `isMixed` property
to render the correct toggle state using symbols:
struct SymbolToggleStyle: ToggleStyle {
func makeBody(configuration: Configuration) -> some View {
Button {
configuration.isOn.toggle()
} label: {
Image(
systemName: configuration.isMixed
? "minus.circle.fill" : configuration.isOn
? "checkmark.circle.fill" : "circle.fill")
configuration.label
}
}
}
