Õpetus iOS-i rakenduste loomiseks Swifti abil

Õpetus iOS-i rakenduste loomiseks Swifti abil

iOS-i rakenduste loomine pole kunagi varem olnud lihtsam tänu Apple'i terviklikule arendusökosüsteemile Xcode'i ja Swifti programmeerimiskeele kaudu. Selles artiklis saate teada iOS-i rakenduse loomise põhivoo Swifti abil, alates tööriistade seadistamisest, uue projekti loomisest, liidese kujundamisest ja rakenduse simulaatoris käitamisest. Kuigi see õpetus on sissejuhatav, peaksid sammud olema piisavad, et aidata teil luua lihtne ja toimiv rakendus.

-

1. Tööriistade ja nõuete ettevalmistamine

Enne koodi kirjutamise alustamist veenduge, et teil on olemas järgmised seadmed ja tarkvara:

1. MacBook/iMac (või macOS Apple'i seadmetes), kuna Xcode töötab ametlikult ainult macOS-is.
2. Xcode (tasuta allalaadimine Mac App Store'ist). Xcode sisaldab koodiredaktorit, iPhone'i simulaatorit ning ehitus- ja silumistööriistu.
3. Swift (kuulub Xcode'i).
4. (Valikuline) Apple'i arendajakonto füüsilistesse seadmetesse installimiseks ja App Store'is avaldamiseks.

Kui Xcode on installitud, avage rakendus ja oodake, kuni vajadusel täiendavate komponentide installiprotsess lõpeb.

-

2. Looge Xcode'is uus projekt

1. Ava Xcode.
2. Valige Loo uus Xcode'i projekt .
3. Mallide osas valige:
- iOS
- rakendus
4. Klõpsake nuppu Edasi ja seejärel täitke projekti konfiguratsioon:
– Toote nimi: näiteks `HelloSwiftApp`
– Meeskond: valige oma konto (võib olla tühi, kui te pole sisse logitud)
– Organisatsiooni identifikaator: näiteks `com.devname`
– Liides: vali SwiftUI (moodsam ja lihtsam algajatele)
Märkus. Kui soovite UIKit'i, saate valida Storyboard'i, kuid see õpetus keskendub SwiftUI-le.
– Keel: Swift
5. Klõpsake nuppu „Järgmine“ ja valige projekti salvestuskoht, seejärel klõpsake nuppu „Loo“.

Kui projekt on loodud, näete failistruktuuri nagu `HelloSwiftAppApp.swift` ja `ContentView.swift`.

-

3. SwiftUI projekti põhistruktuuri mõistmine

SwiftUI-s on rakenduse alguspunktiks tavaliselt fail `TeieRakenduseNimiRakendus.swift`. Näiteks:

"kiire
importida SwiftUI

@peamine
struktuur HelloSwiftAppApp: Rakendus {
var body: mingi stseen {
Aknagrupp {
Sisuvaade()
}
}
}
""

Lühike selgitus:
– `@main` tähistab rakenduse sisenemispunkti.
– `WindowGroup` on peamine vaatekonteiner.
– `ContentView()` on esimene kuvatav vaade.

Samal ajal sisaldab `ContentView.swift` põhivaadet:

"kiire
importida SwiftUI

struct ContentView: Vaata {
var body: some View {
Tekst("Tere, maailm!")
.padding()
}
}
""

-

4. Lihtsa kasutajaliidese loomine: rakendus „Kiirmärkmed”

Asjade huvitavamaks muutmiseks loome lihtsa rakenduse nimega „Kiirmärkmed“, mis võimaldab kasutajatel märkmeid tippida ja neid loendina kuvada.

1. samm: sisendi ja loendi olekute loomine

Muutke `ContentView.swift` järgmiselt:

"kiire
importida SwiftUI

struct ContentView: Vaata {
@State privaatne muutuja noteText: String = “”
@State privaatse muutuja märkmed: [String] = []

var body: some View {
Navigeerimisvaade {
VStack(vahe: 16) {
TextField("Kirjuta märkus...", tekst: $noteText)
.textFieldStyle(ÜmardatudÄärisegaTextFieldStyle())
.padding(.horisontaalne)

Nupp(toiming: lisaMärkus) {
Tekst("Lisa märkus")
.frame(maksimaalne laius: .infinity)
}
.buttonStyle(.borderedProminent)
.padding(.horisontaalne)

Loend {
ForEach(märkmed, id: \.self) { märkus sees
Tekst (märkus)
}
.onDelete(teosta: deleteNote)
}
}
.navigationTitle("Kiirmärkmed")
}
}

privaatne funktsioon lisaNote() {
lase trimmitud = noteText.trimmingCharacters(in: .tühikudJaRead)
valvur !trimmed.isEmpty muul juhul { return }
notes.insert(kärbitud, kell: 0)
märkuseTekst = “”
}

privaatne func deleteNote(nihketes: IndexSet) {
notes.remove(atOffsets: nihked)
}
}
""

-

5. Olulise koodi selgitus

Mõned olulised mõisted, mida mõista:

– @State: Kasutatakse andmete salvestamiseks, mis muutuvad ja käivitavad vastavalt kasutajaliidese värskenduse.
– `noteText` salvestab sisestatud teksti.
– `notes` salvestab märkmete loendi.

– TextField: tekstisisestuskomponent.
Sidumine `text: $noteText` tähendab, et TextField on otse ühendatud olekuga `noteText`.

– Nupp(action:) : Nupp funktsiooni `addNote()` käivitamiseks.

– List + ForEach : Kuvab andmed loendi kujul.
`id: \.self` kasutatakse seetõttu, et objekt on unikaalne string (lihtsaks näiteks).

– onDelete: võimaldab loendist üksusi pühkimisliigutusega kustutada.

-

6. Rakenduse käivitamine simulaatoris

Rakenduse käivitamiseks:

1. Valige Xcode'i ülaosas sihtseade, näiteks iPhone 15 (Simulator).
2. Klõpsake nuppu Käivita (kolmnurga ikoon ▶).
3. Simulaator avaneb ja seejärel käivitub rakendus automaatselt.

Proovige märkust tippida, vajutage nuppu „Lisa märkus“ ja vaadake, kuidas see loendis kuvatakse. Üksuse kustutamiseks libistage vasakule.

-

7. Lihtne silumine

Kui rakendus ei tööta ootuspäraselt, saate teha järgmist.

– Vealogide nägemiseks vaadake Xcode'i allosas asuvat silumiskonsooli paneeli.
– Muutujate väärtuste kontrollimiseks on lisatud `print()`:

"kiire
print("Märkus lisatud:", kärbitud)
""

Lisaks pakub Xcode katkestuspunkti funktsiooni programmi peatamiseks kindlal real, et saaksite muutujate sisu kontrollida.

-

8. Rakenduste täiustamine: andmete valideerimine ja salvestamine

Ülaltoodud rakendus salvestab märkmeid ajutiselt (need kaovad rakenduse sulgemisel). Järgmise arendusetapi jaoks saate lisada:

1. Kohalik salvestusruum (kasutaja vaikesätted)
Salvesta märkmete massiiv UserDefaults'i, et see säiliks ka pärast rakenduse sulgemist.
2. Andmebaas (põhiandmed/SQLite)
Sobib keerukamate andmete jaoks.
3. Märkmete muutmise funktsioon
Kirje muutmiseks looge detailvaade.
4. Atraktiivsem kasutajaliides
Lisa ikoone, värve ja puhtamat paigutust.

Lihtsa sammuna võite alustada kirjete salvestamisest kausta `UserDefaults`, kasutades `JSONEncoder` ja `JSONDecoder`.

-

9. Kesimpulan

Swift ja SwiftUI pakuvad kaasaegset ja kiiret viisi iOS-i rakenduste loomiseks. Selles õpetuses õppisite, kuidas luua uus iOS-i projekt, mõista SwiftUI rakenduse põhistruktuuri, luua lihtne kasutajaliides tekstiväljade, nuppude ja loenditega ning käivitada rakendust simulaatoris. Kuigi rakendus on endiselt lihtne, on see alus hädavajalik, et liikuda edasi keerukamate funktsioonide juurde, nagu andmesalvestus, lehel navigeerimine ja API integratsioon.

Soovi korral saan teid aidata ka selle õpetuse edasijõudnute versioonide loomisel, näiteks püsiva salvestusruumi lisamisel UserDefaults/Core Data abil, detaillehe loomisel NavigationStacki abil või rakenduse loomisel, mis hangib internetist andmeid URLSessioni abil.

Jäta kommentaar