Swift Academy · Lektion

Oprettelse af en WidgetKit-widget

Opret en widget på hjemmeskærmen med en tidslinje.

Lektion 1 af 413 trin

Oprettelse af en WidgetKit-widget er en gratis Swift Academy-lektion på CoddyKit. Dette er lektion 1 af 4. Du kan læse alle 3 lektioner i dette læringsspor gratis i deres fulde længde — derefter låser CoddyKit PRO alle lektioner op samt praktiske øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Den er en del af læringsforløbet i Swift Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Swift Academy-kurset indeholder 4 lektioner i alt.

Hvad er en widget

En widget er en lille, hurtigt overskuelig visning, der findes på hjemmeskærmen, låseskærmen eller i StandBy. Den er ikke en miniapp – den kan ikke rulle eller køre vilkårlig kode. Den viser et øjebliksbillede af data, som systemet opdaterer efter en tidsplan, du angiver via WidgetKit.

import WidgetKit
import SwiftUI
// A widget = configuration + timeline of entries
// + a SwiftUI view that renders one entry

Målet for Widget Extension

Widgets leveres i et separat Widget Extension-mål, ikke i hovedappen. Det har sin egen pakke og kører i sin egen proces. Du tilføjer det via Xcodes skabelon til Widget Extension, som opretter grundstrukturen for konfigurationen og udbyderen.

import WidgetKit
// File > New > Target > Widget Extension
// The extension declares one or more widgets
// in a WidgetBundle if you have several.

Widget-typen

En widget implementerer Widget-protokollen og eksponerer en body, der returnerer en konfiguration. Konfigurationen forbinder en kind-identifikator, en tidslinjeudbyder og den visning, der gengiver hver post.

import WidgetKit
import SwiftUI
struct WeatherWidget: Widget {
    var body: some WidgetConfiguration {
        StaticConfiguration(
            kind: "WeatherWidget",
            provider: WeatherProvider()) { entry in
            WeatherView(entry: entry)
        }
        .configurationDisplayName("Weather")
        .description("Shows the current forecast.")
    }
}

Statisk kontra AppIntent-konfiguration

StaticConfiguration er til widgets uden brugerindstillinger. AppIntentConfiguration lader brugere tilpasse widgetten, for eksempel vælge en by eller en konto, via en App Intent. Vælg statisk til fast indhold og intentbaseret til konfigurerbare widgets.

import WidgetKit
// StaticConfiguration     -> no user choices
// AppIntentConfiguration  -> user-editable parameters
let kinds = "static vs configurable"
_ = kinds

Tidslinjeposten

Hvert tidspunkt, widgetten kan vise, er en TimelineEntry – en struktur med en date samt de data, din visning har brug for. Udbyderen leverer en række af disse poster.

import WidgetKit
struct WeatherEntry: TimelineEntry {
    let date: Date
    let temperature: Int
    let condition: String
}

Widgetvisningen

Visningen er almindelig SwiftUI, men med begrænsninger: ingen rulning, begrænset interaktivitet, og den skal se rigtig ud i flere faste størrelser. Læs posten, og opbyg en ren og hurtigt overskuelig opsummering.

import SwiftUI
import WidgetKit
struct WeatherView: View {
    let entry: WeatherEntry
    var body: some View {
        VStack {
            Text(entry.condition)
            Text("\(entry.temperature) degrees")
                .font(.title)
        }
    }
}

Understøttede familier

Angiv, hvilke størrelser du understøtter, med supportedFamilies: .systemSmall, .systemMedium, .systemLarge, låseskærmens .accessoryRectangular/.accessoryCircular og flere andre. Tilpas layoutet for hver familie ved hjælp af miljøet for widgetfamilien.

import WidgetKit
import SwiftUI
// .configurationDisplayName(...)
// .supportedFamilies([.systemSmall, .systemMedium,
//                     .accessoryRectangular])
let families = "declare supported sizes"
_ = families

Tilpasning til familien

Læs @Environment(\.widgetFamily) i visningen for at vælge mellem forskellige layouts – en kompakt lille widget eller en mere indholdsrig mellemstor widget – uden at skrive separate widgets.

import SwiftUI
import WidgetKit
struct AdaptiveView: View {
    @Environment(\.widgetFamily) var family
    let entry: WeatherEntry
    var body: some View {
        if family == .systemSmall {
            Text("\(entry.temperature)")
        } else {
            Text("\(entry.condition) \(entry.temperature)")
        }
    }
}

Containerbaggrund

Moderne widgets skal angive deres baggrund med containerBackground(for: .widget), så systemet kan gengive dem korrekt i sammenhænge som StandBy og låseskærmen. Uden den kan widgetten blive afvist eller se forkert ud.

import SwiftUI
import WidgetKit
struct Bg: View {
    var body: some View {
        Text("Hi")
            .containerBackground(for: .widget) {
                Color.blue
            }
    }
}

Deling af data med appen

Widgetprocessen er separat, så den kan ikke læse appens tilstand i hukommelsen. Del data via en App Group – en delt container, som begge mål kan få adgang til – typisk en delt UserDefaults-suite eller en fil i gruppens container.

import Foundation
let shared = UserDefaults(
    suiteName: "group.com.example.app")
// App writes; widget reads the same suite.
_ = shared

Genindlæsning af widgetten

Når appens data ændres, kan du bede WidgetKit om at opdatere ved at kalde WidgetCenter.shared.reloadTimelines(ofKind:) (eller reloadAllTimelines()). Det får systemet til at bede din udbyder om en ny tidslinje.

import WidgetKit
func refreshWidget() {
    WidgetCenter.shared.reloadTimelines(
        ofKind: "WeatherWidget")
}

Hurtig kontrol

Husk, hvordan en widget deler data med sin værtsapp.

Opsummering

Du har opbygget en WidgetKit-widget:

  • Widgets findes i en separat udvidelse og implementerer Widget, som returnerer en WidgetConfiguration.
  • Brug StaticConfiguration eller AppIntentConfiguration, en TimelineEntry og en begrænset SwiftUI-visning.
  • Angiv supportedFamilies, tilpas via widgetFamily, og tilføj en containerBackground.
  • Del data via en App Group, og genindlæs med WidgetCenter.reloadTimelines.
Gratis at komme i gang

Lær Swift med en AI-underviser — gratis

Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.

Kurser
122
Lektioner
409

Ofte stillede spørgsmål

Er lektionen “Oprettelse af en WidgetKit-widget” gratis?

Ja — alle 3 lektioner i læringssporet Swift Academy, inklusive “Oprettelse af en WidgetKit-widget”, kan læses gratis i deres fulde længde her på webstedet. Derefter låser CoddyKit PRO alle lektioner op samt interaktive øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Swift Academy-kurset indeholder 4 lektioner i alt.

Hvad lærer jeg i “Oprettelse af en WidgetKit-widget”?

Opret en widget på hjemmeskærmen med en tidslinje. Du øver dig i Swift Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.

Skal jeg have erfaring for at begynde på Swift Academy?

Der kræves ingen tidligere erfaring. Swift Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 1 af 4.

Hvor lang tid tager lektionen “Oprettelse af en WidgetKit-widget”?

De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.

Kan jeg skrive og køre kode i denne Swift Academy-lektion?

Ja. Alle Swift Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.

Alle lektioner i dette kursus

  1. Oprettelse af en WidgetKit-widget
  2. Tidslinjeudbydere og snapshots
  3. Oversigt over appudvidelser
  4. App Intents og Shortcuts
← Tilbage til Swift Academy