yakimvanzuijlen/labeledcontentinteractivefocus

Installation

Swift Package Manager

LabeledContentInteractiveFocus can be installed using Swift Package Manager

1. Go to File > Add Package Dependencies
2. Enter the repository URL: https://github.com/yakimvanzuijlen/LabeledContentInteractiveFocus.git
3. Click Add Package

Or add it to your Package.swift file:

dependencies: [
    .package(url: "[https://github.com/yakimvanzuijlen/LabeledContentInteractiveFocus.git]", from: "1.0.0")
]

Usage

First, import the library.

import LabeledContentInteractiveFocus

You can either apply the interaction using the labeledContentInteractiveFocus() view modifier or as a LabeledContentStyle. They have the same effect.

Use as a view modifier

struct ContentView: View {
    @State private var name = ""
    @State private var password = ""
    var body: some View {
        Form {
            LabeledContent("Name") {
                TextField("", text: $name)
                    .textContentType(.name)
            }
            LabeledContent("Password") {
                SecureField("", text: $password)
                    .textContentType(.newPassword)
            }
        }
        .labeledContentInteractiveFocus()
    }
}

On macOS you can also use it with standard text field labels. There is no need to wrap the text field in a LabeledContent since on macOS the text field label is already visible.

struct Example: View {
    @State private var animal = ""
    var body: some View {
        Form {
            #if os(macOS)
            // On macOS the label is always visible, so LabeledContent is not necessary.
            TextField("Animal", text: $animal)
            #else
            // Wrap in a labeled content to provide a label that is always visible.
            LabeledContent("Animal") {
                TextField("", text: $animal)
            }
            #endif
        }
        #if os(macOS)
        .formStyle(.grouped)
        #endif
        .labeledContentInteractiveFocus()
    }
}

Use as a LabeledContentStyle

You can use interactiveFocus as a shorthand for InteractiveFocusLabeledContentStyle().

struct ContentView: View {
    @State private var productMaterial = ""
    var body: some View {
        LabeledContent {
            TextField("", text: $productMaterial)
        } label: {
            Text("Product Material").bold()
        }
        .labeledContentStyle(.interactiveFocus)
    }
}

Requirements

• iOS 16+
• macOS 13+
• Swift 5.7+

Package Metadata

Repository: yakimvanzuijlen/labeledcontentinteractivefocus

Default branch: main

README: README.md