Tutoriaal oor die skep van iOS-programme met behulp van Swift
Die bou van iOS-programme was nog nooit makliker nie, danksy Apple se omvattende ontwikkelingsekosisteem deur Xcode en die Swift-programmeertaal. In hierdie artikel leer jy die basiese vloei van die bou van 'n iOS-program met behulp van Swift, van die opstel van die gereedskap, die skep van 'n nuwe projek, die ontwerp van die koppelvlak en die uitvoer van die program in die simulator. Alhoewel hierdie tutoriaal inleidend is, behoort die stappe genoeg te wees om jou te help om 'n eenvoudige, werkende program te skep.
-
1. Voorbereiding van gereedskap en vereistes
Voordat jy kode begin skryf, maak seker dat jy die volgende toestelle en sagteware het:
1. MacBook/iMac (of macOS op Apple-toestelle), aangesien Xcode amptelik slegs op macOS loop.
2. Xcode (gratis aflaai vanaf die Mac App Store). Xcode sluit 'n kode-redigeerder, 'n iPhone-simulator en bou- en ontfoutingsinstrumente in.
3. Swift (ingesluit in Xcode).
4. (Opsioneel) Apple-ontwikkelaarrekening vir installasie op fisiese toestelle en publikasie na die App Store.
Sodra Xcode geïnstalleer is, maak die toepassing oop en wag totdat die installasieproses van bykomende komponente voltooi is indien nodig.
-
2. Skep 'n Nuwe Projek in Xcode
1. Maak Xcode oop.
2. Kies Skep 'n nuwe Xcode-projek.
3. Kies in die sjabloonafdeling:
– iOS
– Toepassing
4. Klik Volgende en vul dan die projekkonfigurasie in:
– Produknaam: byvoorbeeld `HelloSwiftApp`
– Span: kies jou rekening (kan leeg wees as jy nie aangemeld is nie)
– Organisasie-identifiseerder: byvoorbeeld `com.devname`
– Koppelvlak: kies SwiftUI (meer modern en eenvoudiger vir beginners)
Let wel: As jy UIKit wil hê, kan jy Storyboard kies, maar hierdie tutoriaal fokus op SwiftUI.
– Taal: Vinnig
5. Klik Volgende en kies die projekbergingsligging, en klik dan Skep.
Sodra die projek geskep is, sal jy 'n lêerstruktuur soos `HelloSwiftAppApp.swift` en `ContentView.swift` sien.
-
3. Verstaan die basiese struktuur van 'n SwiftUI-projek
In SwiftUI is die beginpunt van 'n toepassing gewoonlik die `YourAppNameApp.swift`-lêer. Byvoorbeeld:
"` vinnig
invoer SwiftUI
@hoof
struct HelloSwiftAppApp: App {
var liggaam: sommige toneel {
Venstergroep {
Inhoudaansig()
}
}
}
''
Kort verduideliking:
– `@main` dui die toepassing se toegangspunt aan.
– `Venstergroep` is die hoofaansighouer.
– `ContentView()` is die eerste aansig wat vertoon word.
Intussen bevat `ContentView.swift` die hoofaansig:
"` vinnig
invoer SwiftUI
struct Inhoudaansig: Aansig {
var liggaam: sommige View {
Teks ("Hallo, wêreld!")
.opvulling()
}
}
''
-
4. Skep 'n eenvoudige gebruikerskoppelvlak: "Vinnige notas"-toepassing
Om dinge interessanter te maak, gaan ons 'n eenvoudige toepassing genaamd "Vinnige Notas" skep wat gebruikers toelaat om notas te tik en dit as 'n lys te vertoon.
Stap 1: Skep toestande vir invoer en lys
Verander `ContentView.swift` na:
"` vinnig
invoer SwiftUI
struct Inhoudaansig: Aansig {
@State private var notaTeks: String = “”
@State private var notas: [String] = []
var liggaam: sommige View {
Navigasieaansig {
VStack(spasiëring: 16) {
TextField(“Skryf ’n nota…”, teks: $notaTeks)
.teksVeldStyl(AfgerondeRandTeksVeldStyl())
.padding(.horisontaal)
Knoppie(aksie: voegNota by) {
Teks(“Voeg Nota By”)
.raam(maksBreedte: .oneindig)
}
.buttonStyle(.borderedProminent)
.padding(.horisontaal)
Lys {
VirElk(notas, id: \.self) { nota in
Teks (nota)
}
.onDelete(uitvoer: deleteNota)
}
}
.navigasieTitel(“Vinnige Notas”)
}
}
private funksie addNote() {
laat gesny = notaTeks.snyKarakters(in: .witspasiesEnNuweLyne)
wag !gesny.isLeeg anders { terugkeer }
notas.insert(gesny, by: 0)
notaTeks = “”
}
privaat funksie deleteNote (by offsets: IndexSet) {
notas.verwyder(byVerrekeninge: verrekeninge)
}
}
''
-
5. Belangrike Kode Verduideliking
'n Paar sleutelkonsepte om te verstaan:
– @State: Word gebruik om data te stoor wat sal verander en die gebruikerskoppelvlak te aktiveer om dienooreenkomstig op te dateer.
– `noteText` stoor die invoerteks.
– `notas` stoor 'n lys van notas.
– Teksveld: Teksinvoerkomponent.
Bindende `teks: $noteTeks` beteken dat die TextField direk aan die `noteTeks`-toestand gekoppel is.
– Knoppie(aksie:): Knoppie om die `addNote()`-funksie uit te voer.
– Lys + VirElk: Vertoon data in lysvorm.
`id: \.self` word gebruik omdat die item 'n unieke string is (vir 'n eenvoudige voorbeeld).
– onDelete: Laat toe om items van die lys met 'n swiepgebaar te verwyder.
-
6. Die toepassing in die simulator uitvoer
Om die toepassing te laat loop:
1. Kies die teikentoestel bo-aan Xcode, byvoorbeeld iPhone 15 (Simulator).
2. Klik die "Run"-knoppie (driehoekikoon ▶).
3. Die simulator sal oopmaak, en dan sal die toepassing outomaties loop.
Probeer om 'n nota te tik, druk die "Voeg nota by"-knoppie en sien dit verskyn in die lys. Vee enige item na links om dit te verwyder.
-
7. Eenvoudige Ontfouting
Wanneer 'n toepassing nie soos verwag werk nie, kan jy:
– Kyk na die Debug Console-paneel onderaan Xcode vir foutlogboeke.
– Het `print()` bygevoeg om veranderlike waardes na te gaan:
"` vinnig
druk ("Nota bygevoeg:", afgesny)
''
Daarbenewens bied Xcode 'n breekpuntfunksie om die program by 'n spesifieke lyn te stop sodat jy die inhoud van veranderlikes kan inspekteer.
-
8. Verbetering van toepassings: Datavalidering en -berging
Die bogenoemde toepassing stoor steeds notas tydelik (hulle sal verdwyn wanneer die toepassing gesluit word). Vir die volgende ontwikkelingsfase kan jy byvoeg:
1. Plaaslike berging (Gebruikersverstekke)
Stoor 'n skikking van notas na UserDefaults om te bly nadat die toepassing gesluit is.
2. Databasis (Kerndata/SQLite)
Geskik vir meer komplekse data.
3. Wysig Notas-funksie
Skep 'n detailaansig om die rekord te wysig.
4. Meer aantreklike gebruikerskoppelvlak
Voeg ikone, kleure en 'n skoner uitleg by.
As 'n maklike stap kan jy begin deur rekords te stoor na `UserDefaults` deur `JSONEncoder` en `JSONDecoder` te gebruik.
-
9. Gevolgtrekking
Swift en SwiftUI bied 'n moderne en vinnige manier om iOS-programme te bou. In hierdie tutoriaal het jy geleer hoe om 'n nuwe iOS-projek te skep, die basiese struktuur van 'n SwiftUI-program te verstaan, 'n eenvoudige gebruikerskoppelvlak met TextFields, Buttons en Lists te bou, en die program in die simulator te laat loop. Alhoewel die program steeds eenvoudig is, is hierdie fondament noodsaaklik om aan te beweeg na meer komplekse funksies soos databerging, bladsynavigasie en API-integrasie.
As jy wil, kan ek jou ook help om meer gevorderde weergawes van hierdie tutoriaal te skep, soos om volgehoue berging met UserDefaults/Core Data by te voeg, 'n detailbladsy met NavigationStack te skep, of 'n toepassing te skep wat data van die internet afhaal met behulp van URLSession.
