Published on

Swift va Xcode-da Markup va Dokumentatsiya qo'shish

Authors

Bu videoda biz Markup va Dokumentatsiya haqida gaplashamiz. SwiftUI kodi yozmaymiz β€” lekin professional dasturchi bo'lish uchun bu ko'nikmalar juda muhim.

Agar siz faqat o'zingiz uchun ilova yasayotgan bo'lsangiz, ba'zi izohlarsiz ham ishlashingiz mumkin. Lekin ish qidirayotgan bo'lsangiz yoki jamoada ishlayotgan bo'lsangiz, yaxshi yozilgan dokumentatsiya β€” katta afzallik va ko'p joylarda majburiy talab.

Asosiy ekran sozlamasi

struct DocumentationBootcamp: View {

    // MARK: - PROPERTIES
    @State var data: [String] = ["Olma", "Apelsin", "Banan"]
    @State var showAlert: Bool = false

    // MARK: - BODY
    var body: some View {
        NavigationView {
            ZStack {
                // Fon qatlami
                Color.red
                    .ignoresSafeArea()

                // Old qatlam
                foregroundLayer
            }
            .navigationTitle("Dokumentatsiya")
            .navigationBarItems(trailing: Button("Xabar") {
                showAlert.toggle()
            })
            .alert(isPresented: $showAlert) {
                getAlert(text: "Bu xabar matni")
            }
        }
    }

    // MARK: - FUNCTIONS

    func getAlert(text: String) -> Alert {
        return Alert(title: Text(text))
    }

    // MARK: - PREVIEW

}

MARK β€” Minimap navigatsiyasi

// MARK: yoki // MARK: - β€” bu izoh emas, navigatsiya vositasi. Xcode-ning minimap panelida bo'limlar sifatida ko'rinadi va uzun fayllarda tezda u-bu yerga o'tish imkonini beradi.

// MARK: - PROPERTIES
// MARK: - BODY
// MARK: - FUNCTIONS
// MARK: - PREVIEW

Minimap-ni yoqish: Xcode β†’ Editor Options (yuqori o'ngdagi tugma) β†’ Show Minimap.

Bo'limlar minimap-da ko'rinadi β€” o'sha bo'limga bosib o'tish mumkin. Fayl qancha uzun bo'lsa, bu shuncha foydali.

Bir qatorli izoh

// Bu oddiy bir qatorli izoh
// Faqat o'zingiz uchun eslatma qoldirish qulay

// TODO: sarlavhani tuzatish
// FIXME: xabar funksiyasini tuzatish

Ko'p qatorli izoh va Code Folding

Ko'p qatorga izoh yozish uchun har qatorga // yozishning hojati yo'q β€” /* */ ishlatiladi:

/*
 Nick β€” Amalga oshiriladigan ishlar:
 1. Sarlavhani tuzatish
 2. Xabar funksiyasini yaxshilash
 3. Yangi ekran qo'shish
 */

Bu izohni yig'ish (fold) mumkin:

  • Menyu: Editor β†’ Code Folding β†’ Fold
  • Klaviatura: Option + Command + ←

Yig'ilganda bitta qator sifatida ko'rinadi, ikki marta bosish orqali ochiladi. Uzoq izohlar yoki katta kod bloklari uchun juda qulay.

Body ichida qatlam izohlari

ZStack ichida fon va old qatlam bo'lganda, ularni belgilash kodni o'qishni osonlashtiradi:

var body: some View {
    NavigationView {
        ZStack {
            // Fon qatlami
            Color.red
                .ignoresSafeArea()

            // Old qatlam
            foregroundLayer
        }
    }
}

Ba'zi dasturchilar container-larning boshlanishi va tugashini ham belgilaydi:

var body: some View {
    // START: NavigationView
    NavigationView {
        // START: ScrollView
        ScrollView {
            Text("Salom")
        }
        // END: ScrollView
    }
    // END: NavigationView
}

Bu uslub majburiy emas, lekin yangi dasturchilar uchun qaysi qavsning qaysi containerkini ekanini tushunishga yordam beradi.

Sub-view ajratish β€” body-ni tartibli saqlash

Uzun body o'rniga qismlarni alohida computed variable sifatida ajratish afzalroq:

// MARK: - BODY
var body: some View {
    NavigationView {
        ZStack {
            backgroundLayer  // faqat bir qator
            foregroundLayer  // faqat bir qator
        }
    }
}

// Alohida computed variable-lar
private var backgroundLayer: some View {
    Color.red.ignoresSafeArea()
}

private var foregroundLayer: some View {
    ScrollView {
        ForEach(data, id: \.self) { name in
            Text(name)
                .font(.headline)
        }
    }
}

Uch chiziq /// β€” Summary qo'shish

Istalgan o'zgaruvchi yoki funksiya oldiga /// qo'yib qisqacha tavsif yozish mumkin. Boshqa dasturchi Option tugmasini bosib, o'sha elementni bossا, shu tavsif ko'rinadi:

/// Bu old qatlam bo'lib, ScrollView-ni o'z ichiga oladi
private var foregroundLayer: some View {
    ScrollView {
        // ...
    }
}

Tekshirish: Option + klik β†’ "This is the foreground layer that holds the scroll view" yozuvi chiqadi.

Funksiyaga to'liq dokumentatsiya

Funksiya ustida Command + klik β†’ Add Documentation β€” Xcode avtomatik shablon yaratadi:

/// Berilgan sarlavha bilan xabar oynasini yaratadi va qaytaradi.
///
/// Bu funksiya faqat sarlavhali xabar yaratadi.
/// Qo'shimcha xabar (message) qo'shilmagan.
///
/// ```swift
/// getAlert(text: "Salom")
/// // qaytaradi: Alert(title: Text("Salom"))
/// ```
///
/// - Warning: Bu xabarda qo'shimcha message yo'q.
///
/// - Parameter text: Xabar oynasining sarlavhasi
/// - Returns: Berilgan sarlavhali Alert
func getAlert(text: String) -> Alert {
    return Alert(title: Text(text))
}

Option + klik β†’ getAlert ustida bosganingizda quyidagilar ko'rinadi:

  • Summary β€” qisqacha tavsif
  • Declaration β€” funksiya imzosi
  • Discussion β€” batafsil tushuntirish
  • Parameters β€” parametrlar tavsifi
  • Returns β€” qaytarilayotgan qiymat
  • Warning β€” ogohlantirish
  • Kod namunasi β€” ishlatish misoli

Barcha markup usullari β€” qisqacha

UsulYozilishiMaqsadi
Bir qatorli izoh// matnShaxsiy eslatma
Ko'p qatorli izoh/* matn */Uzun izoh, fold mumkin
MARK// MARK: - Bo'limMinimap navigatsiyasi
Summary/// tavsifOption+klik dokumentatsiyasi
To'liq hujjat/// + - Parameter + - ReturnsFunksiya dokumentatsiyasi
Kod namunasi``` kod ```Hujjat ichida misol
Warning- Warning: matnHujjat ichida ogohlantirish

Xulosa

Kichik loyihalarda barcha izohlarsiz ishlashingiz mumkin. Lekin kod ularga o'sganda, jamoada ishlashda yoki ish uchun portfolio to'plashda β€” yaxshi yozilgan dokumentatsiya siz haqingizda professional taassurot qoldiradi va kodni saqlash, yangilashni ancha osonlashtiradi.

Rahmat, men Nick, bu Swiftful Thinking va keyingi videoda ko'rishguncha!

Buy mea coffee