Swift Academy · Ders

SwiftUI'de Haritaları Görüntüleme

Map ile haritaları ve açıklamaları gösterin.

SwiftUI'de Haritaları Görüntüleme, CoddyKit'te ücretsiz bir Swift Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Swift Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Swift Academy kursu toplamda 4 dersten oluşur.

SwiftUI Harita Görünümü

SwiftUI, UIKit kullanmadan etkileşimli haritalar görüntülemek için yerel bir Map görünümü sağlar (MapKit içinde). MapKit içe aktarın ve görünüm hiyerarşinize bir Map yerleştirin. iOS 17’den bu yana modern, bildirimsel bir programlama arayüzü kullanır.

import SwiftUI
import MapKit

struct BasicMap: View {
    var body: some View {
        Map()
    }
}

Koordinat Bölgeleri

Bir bölge, MKCoordinateRegion ile açıklanır: bir merkez koordinatı ve bir aralıktan oluşur (ne kadar enlem ve boylamın görünür olduğu). Aralıklar küçüldükçe daha yakından yakınlaştırma yapılır.

let region = MKCoordinateRegion(
    center: CLLocationCoordinate2D(latitude: 41.008, longitude: 28.978),
    span: MKCoordinateSpan(latitudeDelta: 0.05, longitudeDelta: 0.05)
)

Kamerayı Position ile Denetleme

Modern Map, MapCameraPosition türüne bir bağlama alır. Bir bölgeden veya dikdörtgenden başlayabilir ya da içeriği otomatik olarak çerçeveleyebilirsiniz. Belirli bir alan ayarlamak için .region(...) kullanın.

struct CityMap: View {
    @State private var position: MapCameraPosition = .region(
        MKCoordinateRegion(
            center: .init(latitude: 41.008, longitude: 28.978),
            span: .init(latitudeDelta: 0.1, longitudeDelta: 0.1)
        )
    )
    var body: some View {
        Map(position: $position)
    }
}

İşaretçi Ekleme

Marker, bir başlıkla birlikte bir koordinata standart bir balon iğnesi yerleştirir. İşaretçileri Map içindeki son kapanışa (harita içeriği oluşturucusuna) yerleştirin.

Map {
    Marker("Hagia Sophia",
           coordinate: .init(latitude: 41.0086, longitude: 28.9802))
}

İşaretçileri Özelleştirme

İşaretçiler, kategorileri ifade etmek için bir systemImage ve bir tint kabul eder. Bu, işaretçilerin haritada görsel olarak ayırt edilmesini sağlar.

Map {
    Marker("Cafe", systemImage: "cup.and.saucer.fill",
           coordinate: cafeCoord)
        .tint(.brown)
}

Özel Görünümlerle Açıklamalar

Bir iğne yeterli olmadığında Annotation, bir koordinatta herhangi bir SwiftUI görünümü oluşturmanıza olanak tanır. Bir başlık ve içerik kapanışı sağlayın.

Map {
    Annotation("Office", coordinate: officeCoord) {
        Image(systemName: "building.2.fill")
            .padding(6)
            .background(.blue, in: Circle())
            .foregroundStyle(.white)
    }
}

Verilerden Birden Çok İğne Görüntüleme

Çok sayıda işaretçi oluşturmak için harita içeriği oluşturucusunun içinde modeliniz üzerinde ForEach ile döngü kurun. Her öğe bir koordinat sağlar.

struct Place: Identifiable {
    let id = UUID()
    let name: String
    let coordinate: CLLocationCoordinate2D
}

Map {
    ForEach(places) { place in
        Marker(place.name, coordinate: place.coordinate)
    }
}

Kullanıcı Konumunu Görüntüleme

Tanıdık mavi noktayı göstermek için harita içeriğine UserAnnotation() ekleyin. Bunun için konum yetkilendirmesinin verilmiş olması gerekir. Bunu kendi işaretçilerinizle birleştirebilirsiniz.

Map {
    UserAnnotation()
    ForEach(places) { p in
        Marker(p.name, coordinate: p.coordinate)
    }
}

Harita Denetimleri

Standart denetimleri .mapControls değiştiricisiyle ekleyin: bir pusula, kullanıcı konumu düğmesi ve ölçek görünümü. Bunlar otomatik olarak görünür ve harita stiline uyar.

Map { UserAnnotation() }
    .mapControls {
        MapUserLocationButton()
        MapCompass()
        MapScaleView()
    }

Harita Stili

Standart, görüntü (uydu) ve hybrid görünümler arasında geçiş yapmak için .mapStyle değiştiricisini kullanın. Gerçekçi yükseltiyi ve ilgi çekici noktaları da açıp kapatabilirsiniz.

Map()
    .mapStyle(.hybrid(elevation: .realistic))

Kamera Değişikliklerine Tepki Verme

.onMapCameraChange değiştiricisi, görünür bölge değiştiğinde (örneğin kullanıcı haritayı kaydırdıktan sonra) bilgi verir. Yeni görünür alan için veri almak amacıyla bunu kullanın.

Map(position: $position)
    .onMapCameraChange { context in
        let center = context.region.center
        print("Now centered at:", center.latitude, center.longitude)
    }

Hızlı Kontrol: SwiftUI Haritaları

MapKit ile SwiftUI bilginizi sınayın.

Özet: Haritaları SwiftUI’de Görüntüleme

Artık etkileşimli haritalar oluşturabilirsiniz:

MapCameraPosition bağlamasıyla modern Map görünümünü kullanın.
Marker işaretçileri yerleştirin veya özel Annotation görünümleri oluşturun; veriler üzerinde ForEach ile döngü kurun.
UserAnnotation() ile mavi noktayı gösterin ve .mapControls ekleyin.
Haritayı stillendirin ve kamera değişikliklerine .onMapCameraChange ile tepki verin.

Sıkça Sorulan Sorular

“SwiftUI'de Haritaları Görüntüleme” dersi ücretsiz mi?

Evet — “SwiftUI'de Haritaları Görüntüleme” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Swift Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Swift Academy kursu toplamda 4 dersten oluşur.

“SwiftUI'de Haritaları Görüntüleme” dersinde ne öğreneceğim?

Map ile haritaları ve açıklamaları gösterin. Swift Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Swift Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Swift Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.

“SwiftUI'de Haritaları Görüntüleme” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Swift Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Swift Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← Swift Academy Sayfasına Dön