Published on

SwiftUI Map App — Loyiha sozlash va Location modeli

Authors

Loyiha sozlash va Location modeli

Bu videoda Xcode loyihasi yaratiladi, tayyor assets import qilinadi va ilovaning asosiy ma'lumot modeli — Location struct-i quriladi.

Yangi Xcode loyihasi yaratish

Xcode → Create a new Xcode project → App → iOS

Muhim sozlamalar:

  • Product Name: SwiftUIMapApp (yoki xohlagan nom)
  • Interface: SwiftUI
  • Language: Swift
  • Core Data: o'chirilgan
  • Tests: o'chirilgan

MVVM papka tuzilmasi

Navigator-da to'rtta yangi guruh yaratiladi:

Models/
Views/
ViewModels/
DataServices/

Assets import qilish

Dars resurslari zip fayli ikkita narsani o'z ichiga oladi:

  1. Assets.xcassets papkasi — accent rang, app icon, joy rasmlari, logotip
  2. LocationsDataService.swift fayli — tayyor ma'lumotlar massivi

Assets-ni almashtirish

  1. Navigator-da mavjud Assets.xcassets-ni o'ng tugma → Delete → Move to Trash
  2. Yuklab olingan Assets.xcassets papkasini loyihaga sudrab tashlang
  3. Dialog oynasida:
    • ✅ Copy items if needed
    • ✅ Add to targets — belgilanishi shart, aks holda rasm ilovaga qo'shilmaydi

Assets tarkibi

  • AccentColor — ilova bo'yicha asosiy rang (qizil — Maraschino)
  • AppIcon — asosiy ilova ikonkasi
  • Locations/ — joy rasmlari, papkalar bo'yicha guruhlangan:
    • paris/ — paris_eiffel_tower_1, paris_eiffel_tower_2, paris_eiffel_tower_3
    • rome/ — rome_coliseum_1, rome_coliseum_2, rome_coliseum_3
  • Logos/ — ilova logotipi va launch screen rasmi

Rasm nomlari aniq muhim — kod ichida shu nomlar bilan murojaat qilinadi.

Accent rangni sozlash

Light va Dark mode uchun bir xil rang bo'lsa:

  • Appearances: None → bitta rang barcha rejimlarda ishlatiladi

Har ikki rejim uchun alohida rang kerak bo'lsa:

  • Appearances: Any, Dark → ikkita rang alohida belgilanadi

Location modeli

Models/ papkasida yangi Swift File yaratiladi (SwiftUI View emas) — Location.swift.

import Foundation
import MapKit

struct Location {
    let name: String
    let cityName: String
    let coordinates: CLLocationCoordinate2D
    let description: String
    let imageNames: [String]
    let link: String
}

Muhim tafsilotlar

import MapKit — CLLocationCoordinate2D turi MapKit ichida joylashgan, shuning uchun qo'shimcha import zarur.

imageNames: [String] — bu [UIImage] emas, balki rasm nomlarining massivi. Shu yo'l bilan rasm faqat ekranda ko'rsatilishi kerak bo'lganda yuklanadi, dastlabki yuklashda barcha rasmlar xotiraga o'tirtirilmaydi.

LocationsDataService — tayyor ma'lumotlar

DataServices/ papkasiga yuklab olingan LocationsDataService.swift fayli sudrab tashlanadi (xuddi assets kabi sozlamalar bilan).

import Foundation
import MapKit

class LocationsDataService {

    static let locations: [Location] = [
        Location(
            name: "Colosseum",
            cityName: "Rome",
            coordinates: CLLocationCoordinate2D(latitude: 41.8902, longitude: 12.4922),
            description: "The Colosseum is an oval amphitheatre...",
            imageNames: ["rome_coliseum_1", "rome_coliseum_2", "rome_coliseum_3"],
            link: "https://en.wikipedia.org/wiki/Colosseum"
        ),
        Location(
            name: "Eiffel Tower",
            cityName: "Paris",
            coordinates: CLLocationCoordinate2D(latitude: 48.8584, longitude: 2.2945),
            description: "The Eiffel Tower is a wrought-iron lattice tower...",
            imageNames: ["paris_eiffel_tower_1", "paris_eiffel_tower_2", "paris_eiffel_tower_3"],
            link: "https://en.wikipedia.org/wiki/Eiffel_Tower"
        )
        // ... qolgan joylar
    ]
}

Fayl import qilinganida Location so'zi yashil rangga bo'yaladi — bu Location modeli to'g'ri tanilayotganligining belgisi. Agar xato ko'rsatsa, Location struct-ining maydonlari DataService-dagi qiymatlar bilan mos kelmasligi mumkin.

Yangi joy qo'shish

Keyinchalik ilovaga yangi joy qo'shish uchun:

  1. Assets.xcassets ichiga yangi papka yarating (masalan, london/)
  2. Rasmlarni joylashtiring va nomlang: london_big_ben_1, london_big_ben_2...
  3. LocationsDataService.swift-dagi locations massiviga yangi Location ob'ekti qo'shing
  4. imageNames-dagi nomlar asset nomlariga to'liq mos kelishini tekshiring

Loyiha holati

Bu video oxirida loyiha tuzilmasi:

SwiftUIMapApp/
├── Models/
│   └── Location.swift
├── Views/
├── ViewModels/
├── DataServices/
│   └── LocationsDataService.swift
├── Assets.xcassets/
│   ├── AccentColor
│   ├── AppIcon
│   ├── Locations/
│   └── Logos/
└── ContentView.swift

Xcode-da Build (⌘B) bajarish muvaffaqiyatli bo'lishi kerak — hozircha hech qanday UI qurilmagan, lekin ma'lumot qatlami tayyor.

Keyingi videoda LocationsViewModel qurilib, xarita va navigatsiya uchun zarur holat boshqaruvi tashkil etiladi.

Buy mea coffee