Swift Academy · Pelajaran

Membina Widget WidgetKit

Cipta widget skrin utama dengan garis masa.

Pelajaran 1 daripada 413 langkah

Membina Widget WidgetKit ialah pelajaran Swift Academy percuma di CoddyKit. Ini ialah pelajaran 1 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Swift Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Swift Academy merangkumi sejumlah 4 pelajaran.

Apakah Widget

Widget ialah paparan kecil yang boleh dilihat sepintas lalu pada Skrin Utama, Skrin Kunci atau dalam StandBy. Ia bukan aplikasi mini — widget tidak boleh menatal atau menjalankan kod sewenang-wenangnya. Widget memaparkan syot data yang disegarkan oleh sistem mengikut jadual yang anda berikan melalui WidgetKit.

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

Sasaran Sambungan Widget

Widget dihantar dalam sasaran sambungan widget yang berasingan, bukannya dalam aplikasi utama. Sasaran ini mempunyai bundle sendiri dan berjalan dalam prosesnya sendiri. Anda menambahkannya melalui templat Sambungan Widget Xcode, yang menyediakan rangka asas konfigurasi dan pembekal.

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

Jenis Widget

Widget mematuhi protokol Widget dan mendedahkan body yang mengembalikan konfigurasi. Konfigurasi ini menggabungkan pengecam jenis, pembekal timeline dan paparan yang memaparkan setiap entry.

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.")
    }
}

Konfigurasi Statik berbanding AppIntent

StaticConfiguration adalah untuk widget tanpa pilihan pengguna. AppIntentConfiguration membolehkan pengguna menyesuaikan widget, seperti memilih bandar atau akaun, melalui niat aplikasi. Pilih konfigurasi statik untuk kandungan tetap dan konfigurasi berasaskan niat untuk widget yang boleh dikonfigurasikan.

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

Entri Timeline

Setiap titik masa yang boleh dipaparkan oleh widget ialah TimelineEntry — struktur yang mempunyai date serta apa-apa data yang diperlukan oleh paparan anda. Pembekal menyediakan urutan entry ini.

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

Paparan Widget

Paparan ini menggunakan SwiftUI biasa tetapi mempunyai batasan: tiada penatalan, interaksi yang terhad dan paparan mesti kelihatan betul pada beberapa saiz tetap. Baca entry dan susun ringkasan yang kemas serta mudah dilihat sepintas lalu.

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

Family yang Disokong

Nyatakan saiz yang disokong dengan supportedFamilies: .systemSmall, .systemMedium, .systemLarge, .accessoryRectangular/.accessoryCircular Skrin Kunci dan banyak lagi. Sesuaikan susun atur mengikut setiap family menggunakan persekitaran family widget.

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

Menyesuaikan dengan Family

Baca @Environment(\.widgetFamily) di dalam paparan untuk memilih susun atur yang berbeza — widget kecil yang padat berbanding widget sederhana yang lebih lengkap — tanpa menulis widget berasingan.

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)")
        }
    }
}

Latar Belakang Bekas

Widget moden mesti mengisytiharkan latarnya dengan containerBackground(for: .widget) supaya sistem dapat memaparkannya dengan betul dalam konteks seperti StandBy dan Skrin Kunci. Tanpa pengisytiharan ini, widget mungkin ditolak atau kelihatan tidak betul.

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

Berkongsi Data dengan Aplikasi

Proses widget adalah berasingan, jadi widget tidak boleh membaca keadaan aplikasi yang berada dalam memori. Kongsi data melalui Kumpulan Aplikasi — bekas dikongsi yang boleh dicapai oleh kedua-dua sasaran — biasanya melalui suite UserDefaults dikongsi atau fail dalam bekas kumpulan.

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

Memuat Semula Widget

Apabila data aplikasi berubah, beritahu WidgetKit supaya memuat semula dengan memanggil WidgetCenter.shared.reloadTimelines(ofKind:) atau reloadAllTimelines(). Tindakan ini meminta sistem mendapatkan timeline baharu daripada pembekal anda.

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

Semakan Pantas

Ingat semula cara widget berkongsi data dengan aplikasi hosnya.

Ringkasan

Anda telah membina widget WidgetKit:

  • Widget berada dalam sambungan berasingan dan mematuhi Widget, lalu mengembalikan WidgetConfiguration.
  • Gunakan StaticConfiguration atau AppIntentConfiguration, TimelineEntry dan paparan SwiftUI yang mempunyai batasan.
  • Isytiharkan supportedFamilies, sesuaikan melalui widgetFamily dan tambahkan containerBackground.
  • Kongsi data melalui Kumpulan Aplikasi dan muat semula dengan WidgetCenter.reloadTimelines.
Percuma untuk bermula

Pelajari Swift dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
122
Pelajaran
409

Soalan Lazim

Adakah pelajaran “Membina Widget WidgetKit” percuma?

Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Swift Academy, termasuk “Membina Widget WidgetKit”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Swift Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Membina Widget WidgetKit”?

Cipta widget skrin utama dengan garis masa. Anda berlatih Swift Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Swift Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Swift Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 1 daripada 4.

Berapa lamakah pelajaran “Membina Widget WidgetKit” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Swift Academy ini?

Ya. Setiap pelajaran Swift Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Membina Widget WidgetKit
  2. Penyedia Garis Masa dan Syot Kilat
  3. Gambaran Keseluruhan Sambungan Aplikasi
  4. App Intents dan Shortcuts
← Kembali ke Swift Academy