Gelişmiş Yer Ayrıntıları bileşeni

Yer Ayrıntıları bileşeninin Advanced sürümü, Yer Ayrıntıları Essentials ile aynı özellikleri sunar. Ayrıca, yer adının gösterilip gösterilmeyeceğini seçmenize, bileşenin işlem düğmelerini yapılandırmanıza ve gösterilen yorumlara ve medyaya arama ve filtreleme seçenekleri uygulamanıza olanak tanır.

Gelişmiş yer ayrıntıları yapılandırması

İleri seviye özelliklere erişmek için AdvancedPlaceDetailsView veya AdvancedPlaceDetailsCompactView'ı kullanın.

İçerik görüntüleme seçenekleri

AdvancedPlaceDetailsContent içindeki numaralandırmaları kullanarak hangi içeriğin gösterileceğini belirtebilirsiniz. Yer Ayrıntıları Temel Bilgileri ile aynı içeriğin tümünü yapılandırabilir ve yer adının gösterilip gösterilmeyeceğini seçebilirsiniz.

İşlem düğmelerini yapılandırma

İşlem düğmelerini kaldırmak veya özelleştirmek için AdvancedPlaceDetailsView veya AdvancedPlaceDetailsCompactView .cornerActions.mainActionsyöntemlerini kullanın.

Görsel ilişkilendirme koşulları

Özelleştirilmiş düğmelerle yer ayrıntıları kompakt görünümü
Özelleştirilmiş düğmeyle gelişmiş yer ayrıntılarının küçük görünümü

Önemli: Özel işlem düğmesinin, kullanıcı bilgilerini Google dışında bir üçüncü tarafla ne zaman paylaşacağını son kullanıcılara açıkça belirtmeniz gerekir. Görsel ilişkilendirme koşullarını inceleyin.

Sağdaki örnekte, kullanıcı bilgilerinin "Altostrat"a gönderileceğini açıkça belirten özel bir resim gösterilmektedir.

Arama ve filtreleme seçeneklerini uygulama

Medya veya yorumlarda arama ve filtrelemeyi etkinleştirmek için AdvancedPlaceDetailsView ya da AdvancedPlaceDetailsCompactView'ün .searchMediaOptions ve .searchReviewOptions yöntemlerini kullanın.

Özel içerik alanları oluşturma

Özel içerik alanı yerleşim seçenekleri

Özel içerik alanları, kendi içeriğinizi (ör. yapay zekayla üretilmiş özetler, seyahat planı zaman damgaları veya özel rozetler) doğrudan önceden tanımlanmış düzen bölgelerine eklemenize olanak tanır.

Özel içerik eklemek için .placeDetailsCompactContentSlot AdvancedPlaceDetailsCompactView yöntemini kullanın. Kullanılabilir pozisyonlar .basicSectionTop ve .basicSectionBottom'dır.

İçerik alanları için atıf koşulları ve içerik önerileri

Özel içerik alanı yerleştirildiğinde, hangi içeriğin Google tarafından sağlandığını ve bazı içeriklerin üçüncü taraflarca sağlandığını netleştirmek için açıklama otomatik olarak güncellenir.

Yapılması gerekenler

Bilgi kaynağıyla ilgili herhangi bir belirsizliği önlemek için Google Yeri ayrıntıları ile özel içerik arasında net bir görsel hiyerarşi oluşturun.

Bilgi kaynağıyla ilgili belirsizliği önleme

Yapılması gerekenler

Kullanıcılarınızın acil hedeflerine göre uyarlanmış, yerelleştirilmiş ve değerli analizler sunun. Anlık rezervasyon aralıkları veya mevcut müsaitlik durumu gibi uyarlanmış içerikler, kullanıcıların daha hızlı ve bilinçli kararlar vermesine yardımcı olur.

Yüksek değerli analizler sunma

Yapılmamalı

Google tarafından sağlanan içeriği gizlemiş olsanız bile puanlar, yorumlar veya çalışma saatleri gibi mevcut Google Yeri ayrıntılarını kopyalamayın. Bu durum, kullanıcıların içeriğin kaynağı ve Google'dan mı yoksa üçüncü bir taraftan mı geldiği konusunda kafasını karıştırabilir.

Mevcut Google Yeri ayrıntılarını kopyalamayın

Yapılmamalı

Resmi Google onayları ile karıştırılabilecek, atıfta bulunulmayan iddialar veya rozetler (ör. "En çok tavsiye edilen!") göstermeyin. Özel içeriklerin kaynağı açıkça belirtilmelidir.

Atfedilmeyen iddiaları veya rozetleri göstermeyin

Yapılmamalı

Özel yer kapsayıcılarına reklam, pazarlama metni, tanıtım amaçlı indirim veya abonelik istemi eklemeyin.

Reklam, pazarlama metni, tanıtım amaçlı indirim veya abonelik istemi eklemeyin.

Gelişmiş Yer Ayrıntıları örnekleri

Yer adını atlama

Yer adını atlamak için AdvancedPlaceDetailsConfiguration öğesinin content parametresine .name eklemeyin.

Swift

struct DemoView: View {
  static let peetsCoffeePlaceID = "ChIJT7FdmYiAhYAROFOvrIxRJDU"

  // Query for loading the place details component.
  @State var query: PlaceDetailsQuery = PlaceDetailsQuery(
    identifier: .placeID(peetsCoffeePlaceID)
  )
  @State private var favoritePlaces: Set<String> = []

  var body: some View {
    AdvancedPlaceDetailsView(
      query: $query,
      configuration: AdvancedPlaceDetailsConfiguration(
        content:[.address()],
        theme: PlacesMaterialTheme()
      ),
      placeDetailsCallback: { result in
        if let place = result.place {
          print("Place: \(place.description)")
        } else {
          print("Error: \(String(describing: result.error))")
        }
      }
    )
  }
}

İşlem düğmelerini kaldırma

Swift

struct DemoView: View {
  static let peetsCoffeePlaceID = "ChIJT7FdmYiAhYAROFOvrIxRJDU"

  @State var query: PlaceDetailsQuery = PlaceDetailsQuery(
    identifier: .placeID(peetsCoffeePlaceID)
  )

  var body: some View {
    AdvancedPlaceDetailsView(
      query: $query,
      configuration: AdvancedPlaceDetailsConfiguration(
        content: AdvancedPlaceDetailsView.allContent,
        theme: PlacesMaterialTheme()
      ),
      placeDetailsCallback: { result in
        if let place = result.place {
          print("Place: \(place.description)")
        } else {
          print("Error: \(String(describing: result.error))")
        }
      }
    )
    .mainActions{ _ in
      return []
    }
  }
}

Özel ve önceden tanımlanmış işlemler ekleme

Bu örnekte, önceden tanımlanmış Haritalar'da aç işleminin yanı sıra kullanıcının bir yeri favorilerine eklemesine veya favorilerinden kaldırmasına olanak tanıyan bir seçenek ekleniyor.

Swift

struct DemoView: View {
  static let peetsCoffeePlaceID = "ChIJT7FdmYiAhYAROFOvrIxRJDU"

  @State var query: PlaceDetailsQuery = PlaceDetailsQuery(
    identifier: .placeID(peetsCoffeePlaceID)
  )
  
  @State var favoritePlaces: Set<String> = []

  var body: some View {
    AdvancedPlaceDetailsView(
      query: $query,
      configuration: AdvancedPlaceDetailsConfiguration(
        content: AdvancedPlaceDetailsView.allContent,
        theme: PlacesMaterialTheme()
      ),
      placeDetailsCallback: { result in
        if let place = result.place {
          print("Place: \(place.description)")
        } else {
          print("Error: \(String(describing: result.error))")
        }
      }
    )
    .mainActions{ place in
      var actions: [MainPlaceActionElement] = []
      let placeID = place.placeID!
      if self.favoritePlaces.contains(placeID) {
        actions.append(
          .action(
            MainPlaceAction(
              image: Image(systemName: "heart.fill"),
              label: "Unfavorite"
            ) { _ in self.toggleFavorite(placeID) }
          )
        )
      } else {
        actions.append(
          .action(
            MainPlaceAction(
              image: Image(systemName: "heart"),
              label: "Favorite"
            ) { _ in self.toggleFavorite(placeID) }
          )
        )
      }
      actions.append(.actionId(.openMap(style: .primary)))
      return actions
    }
    .cornerActions { place in
      var actions: [CornerPlaceActionElement] = []
      let placeID = place.placeID!
      if self.favoritePlaces.contains(placeID) {
        actions.append(
          .action(
            CornerPlaceAction(
              image: Image(systemName: "heart.fill"),
              accessibilityLabel: "Unfavorite",
            ) { _ in self.toggleFavorite(placeID) }
          )
        )
      } else {
        actions.append(
          .action(
            CornerPlaceAction(
              image: Image(systemName: "heart"),
              accessibilityLabel: "Favorite",
            ) { _ in self.toggleFavorite(placeID) }
          )
        )
      }
      actions.append(.actionId(.openMap(style: .primary)))
      return actions
    }
  }

  func toggleFavorite(_ placeID: String) {
    if favoritePlaces.contains(placeID) {
      favoritePlaces.remove(placeID)
    } else {
      favoritePlaces.insert(placeID)
    }
  }
}

Yorumları ve medyaları filtreleme

Bu kod örneğinde yalnızca "kahve" kelimesinin geçtiği medya ve yorumlar gösterilmektedir.

Swift

struct DemoView: View {
  static let peetsCoffeePlaceID = "ChIJT7FdmYiAhYAROFOvrIxRJDU"

  @State var query: PlaceDetailsQuery = PlaceDetailsQuery(
    identifier: .placeID(peetsCoffeePlaceID)
  )
  let searchMediaOptions = SearchMediaOptions(query: "coffee")
  let searchReviewsOptions = SearchReviewsOptions(query: "coffee")

  var body: some View {
    AdvancedPlaceDetailsView(
      query: $query,
      configuration: AdvancedPlaceDetailsConfiguration(
        content: [.media(), .reviews()],
        theme: PlacesMaterialTheme()
      ),
      placeDetailsCallback: { _ in }
    )
    .searchMediaOptions(searchMediaOptions) { results in
      guard let result = results.first else { return }
      switch result {
      case .success(let summary):
        print("Summary: \(summary)")
      case .failure(let error):
        print("Error: \(error)")
      }
    }
    .searchReviewsOptions(searchReviewsOptions) { results in
      guard let result = results.first else { return }
      switch result {
      case .success(let summary):
        print("Summary: \(summary)")
      case .failure(let error):
        print("Error: \(error)")
      }
    }
  }
}

İçerik alanları oluşturma

Bu örnek, basicSectionTop ve basicSectionBottom yuvalarına içerik ekler.

Swift

import SwiftUI
import PlacesSwift

struct ItineraryCard: View {
    static let peetsCoffeePlaceID = "ChIJT7FdmYiAhYAROFOvrIxRJDU"

    @State var query: PlaceDetailsQuery = PlaceDetailsQuery(
      identifier: .placeID(peetsCoffeePlaceID)
    )

    var body: some View {
      AdvancedPlaceDetailsCompactView(
        orientation: .vertical,
        query: $query,
        configuration: AdvancedPlaceDetailsCompactConfiguration(
          content: AdvancedPlaceDetailsCompactView.allContent,
          theme: PlacesMaterialTheme()
        ),
        placeDetailsCallback: { _ in }
      )
      .placeDetailsCompactContentSlot(position: .basicSectionTop) { place in
        Text("Day 2 • 2:30 PM")
          .font(.caption)
          .fontWeight(.bold)
          .foregroundColor(.accentColor)
      }
      .placeDetailsCompactContentSlot(position: .basicSectionBottom) { place in
        VStack(alignment: .leading, spacing: 4) {
          Text("AI Notes")
            .font(.caption)
            .bold()
          Text("Great quiet atmosphere for morning meetings. Famous for house-roasted pour-overs.")
            .font(.footnote)
            .foregroundColor(.secondary)
        }
        .padding(8)
        .background(Color(.systemGray6))
        .cornerRadius(8)
      }
    }
}