Vejledning i oprettelse af iOS-apps ved hjælp af Swift
Det har aldrig været nemmere at bygge iOS-apps takket være Apples omfattende udviklingsøkosystem gennem Xcode og programmeringssproget Swift. I denne artikel lærer du det grundlæggende flow i at bygge en iOS-app ved hjælp af Swift, lige fra opsætning af værktøjerne, oprettelse af et nyt projekt, design af brugerfladen og kørsel af appen i simulatoren. Selvom denne vejledning er introducerende, burde trinnene være tilstrækkelige til at hjælpe dig med at oprette en simpel, fungerende app.
—
1. Forberedelse af værktøjer og krav
Før du begynder at skrive kode , skal du sørge for at have følgende enheder og software:
1. MacBook/iMac (eller macOS på Apple-enheder), da Xcode officielt kun kører på macOS.
2. Xcode (gratis download fra Mac App Store). Xcode indeholder en kodeeditor, en iPhone-simulator og bygge- og fejlfindingsværktøjer.
3. Swift (inkluderet i Xcode).
4. (Opsional) Akun Apple Developer untuk instalasi ke perangkat fisik dan publikasi ke App Store.
Når Xcode er installeret, skal du åbne applikationen og vente på, at installationsprocessen for yderligere komponenter er færdig, hvis det er nødvendigt.
—
2. Opret et nyt projekt i Xcode
1. Åbn Xcode.
2. Vælg Opret et nyt Xcode-projekt.
3. I skabelonsektionen skal du vælge:
- iOS
- App
4. Klik på Næste, og udfyld derefter projektkonfigurationen:
– Produktnavn: for eksempel `HelloSwiftApp`
– Hold: vælg din konto (kan være tom, hvis du ikke er logget ind)
– Organisationsidentifikator: for eksempel `com.devname`
– Interface : pilih SwiftUI (lebih modern dan sederhana untuk pemula)
Bemærk: Hvis du vil have UIKit, kan du vælge Storyboard, men denne vejledning fokuserer på SwiftUI.
– Sprog: Hurtigt
5. Klik på Næste, og vælg projektets lagringsplacering, og klik derefter på Opret.
Når projektet er oprettet, vil du se en filstruktur som `HelloSwiftAppApp.swift` og `ContentView.swift`.
—
3. Forstå den grundlæggende struktur i et SwiftUI-projekt
I SwiftUI er udgangspunktet for en applikation normalt filen `YourAppNameApp.swift`. For eksempel:
"'hurtig
importer SwiftUI
@hoved
struktur HelloSwiftAppApp: App {
var body: en scene {
Vinduegruppe {
Indholdsvisning()
}
}
}
”`
Kort forklaring:
– `@main` markerer programmets startpunkt.
– `WindowGroup` er den primære visningscontainer.
– `ContentView()` er den første visning, der vises.
I mellemtiden indeholder `ContentView.swift` hovedvisningen:
"'hurtig
importer SwiftUI
struct ContentView: Vis {
var body: some View {
Tekst ("Hej verden!")
.padding()
}
}
”`
—
4. Oprettelse af en simpel brugergrænseflade: Appen "Hurtige noter"
For at gøre tingene mere interessante, vil vi oprette en simpel applikation kaldet "Hurtige noter", der giver brugerne mulighed for at skrive noter og vise dem som en liste.
Trin 1: Oprettelse af tilstande til input og liste
Ændr `ContentView.swift` til:
"'hurtig
importer SwiftUI
struct ContentView: Vis {
@State privat variabel noteTekst: String = “”
@State private var noter: [String] = []
var body: some View {
Navigationsvisning {
VStack(afstand: 16) {
TextField(“Skriv en note…”, tekst: $noteText)
.textFieldStyle(AfrundetKanttekstFieldStyle())
.padding(.horizontal)
Knap(handling: tilføjNote) {
Tekst("Tilføj note")
.frame(maxWidth: .infinity)
}
.buttonStyle(.borderedProminent)
.padding(.horizontal)
Liste {
ForEach(noter, id: \.self) { note i
Tekst (note)
}
.onDelete(perform: sletNote)
}
}
.navigationTitel("Hurtige noter")
}
}
privat func addNote() {
lad trimmet = noteText.trimmingCharacters(in: .whitespacesAndNewlines)
guard !trimmet.erTom ellers { return }
notes.insert(trimmet, ved: 0)
noteTekst = “”
}
private func deleteNote(ved offsets: IndexSet) {
notes.remove(atOffsets: forskydninger)
}
}
”`
—
5. Vigtig kodeforklaring
Nogle nøglebegreber at forstå:
– @State : Digunakan untuk menyimpan data yang akan berubah dan memicu UI untuk ikut diperbarui.
– `noteText` gemmer den indtastede tekst.
– `noter` gemmer en liste over noter.
– TextField: Tekstinputkomponent.
Bindende `text: $noteText` betyder, at TextField er direkte forbundet med `noteText`-tilstanden.
– Button(action:): Knap til at køre `addNote()`-funktionen.
– Liste + ForEach: Viser data i listeform.
`id: \.self` bruges fordi elementet er en unik streng (for et simpelt eksempel).
– onDelete: Tillader sletning af elementer fra listen med en swipe-bevægelse.
—
6. Kørsel af applikationen i simulatoren
Sådan kører du applikationen:
1. Di bagian atas Xcode, pilih target device misalnya iPhone 15 (Simulator).
2. Klik på knappen Kør (trekantikon ▶).
3. Simulatoren åbnes, og derefter kører applikationen automatisk.
Prøv at skrive en note, tryk på knappen "Tilføj note", og se den vises på listen. Stryg et element til venstre for at slette det.
—
7. Simpel fejlfinding
Når en applikation ikke fungerer som forventet, kan du:
– Se fejllogfilerne i Debug Console-panelet nederst i Xcode.
– Tilføjet `print()` for at kontrollere variabelværdier:
"'hurtig
print(“Note tilføjet:”, trimmet)
”`
Derudover har Xcode en breakpoint-funktion til at stoppe programmet på en bestemt linje, så du kan inspicere indholdet af variabler.
—
8. Forbedring af applikationer: Datavalidering og lagring
Ovenstående applikation gemmer stadig noter midlertidigt (de forsvinder, når applikationen lukkes). Til næste udviklingstrin kan du tilføje:
1. Lokal lagring (brugerstandarder)
Gem en række noter i UserDefaults, så de bevares, efter at applikationen er lukket.
2. Database (Kernedata/SQLite)
Velegnet til mere komplekse data.
3. Funktionen Rediger noter
Opret en detaljeret visning for at ændre posten.
4. Mere attraktiv brugergrænseflade
Tilføj ikoner, farver og et renere layout.
Som et nemt trin kan du starte med at gemme poster i `UserDefaults` ved hjælp af `JSONEncoder` og `JSONDecoder`.
—
9. Kesimpulan
Swift og SwiftUI tilbyder en moderne og hurtig måde at bygge iOS-apps på. I denne vejledning lærte du, hvordan du opretter et nyt iOS-projekt, forstår den grundlæggende struktur i en SwiftUI-app, bygger en simpel brugergrænseflade med tekstfelter, knapper og lister, og kører appen i simulatoren. Selvom appen stadig er enkel, er dette fundament afgørende for at gå videre til mere komplekse funktioner som datalagring, sidenavigation og API-integration.
Hvis du ønsker det, kan jeg også hjælpe dig med at oprette mere avancerede versioner af denne vejledning, f.eks. med at tilføje permanent lagring med UserDefaults/Core Data, oprette en detaljeside med NavigationStack eller oprette en app, der henter data fra internettet ved hjælp af URLSession.