Thành phần Place Details nâng cao
Thành phần Chi tiết địa điểm phiên bản Nâng cao có các tính năng giống như Chi tiết địa điểm phiên bản Cơ bản. Thành phần này cũng cho phép bạn chọn có hiển thị tên Địa điểm hay không, định cấu hình các nút hành động của thành phần, cũng như áp dụng các lựa chọn tìm kiếm và lọc cho các bài đánh giá và nội dung nghe nhìn được hiển thị.
Cấu hình nâng cao cho Place Details
Sử dụng AdvancedPlaceDetailsView hoặc AdvancedPlaceDetailsCompactView để sử dụng các tính năng nâng cao.
Tuỳ chọn hiển thị nội dung
Bạn có thể chỉ định nội dung cần hiển thị bằng cách sử dụng enum trong AdvancedPlaceDetailsContent. Bạn có thể định cấu hình tất cả nội dung giống như Thông tin cơ bản về địa điểm, cũng như chọn có hiển thị tên Địa điểm hay không.
Định cấu hình nút hành động
Sử dụng các phương thức .cornerActions và .mainActions của AdvancedPlaceDetailsView hoặc AdvancedPlaceDetailsCompactView để xoá hoặc tuỳ chỉnh các nút hành động.
Yêu cầu về việc ghi nhận tác giả bằng hình ảnh
Quan trọng: Bạn phải thông báo rõ cho người dùng cuối khi nút hành động tuỳ chỉnh chia sẻ thông tin người dùng với một bên thứ ba không phải Google. Xem yêu cầu về thông tin ghi công bằng hình ảnh.
Ví dụ bên phải cho thấy một hình ảnh tuỳ chỉnh nêu rõ rằng thông tin người dùng sẽ được gửi đến "Altostrat".
Áp dụng các lựa chọn tìm kiếm và lọc
Sử dụng các phương thức .searchMediaOptions và .searchReviewOptions của AdvancedPlaceDetailsView hoặc AdvancedPlaceDetailsCompactView để bật tính năng tìm kiếm và lọc nội dung nghe nhìn hoặc bài đánh giá.
Tạo vùng nội dung tuỳ chỉnh
Vị trí nội dung tuỳ chỉnh cho phép bạn thêm nội dung của riêng mình (chẳng hạn như bản tóm tắt do AI tạo, dấu thời gian của hành trình hoặc huy hiệu tuỳ chỉnh) ngay vào các vùng bố cục được xác định trước.
Để thêm nội dung tuỳ chỉnh, hãy sử dụng phương thức .placeDetailsCompactContentSlot của AdvancedPlaceDetailsCompactView. Các vị trí có thể đặt là .basicSectionTop và .basicSectionBottom.
Yêu cầu về thông tin ghi công và đề xuất nội dung cho các vị trí nội dung
Khi một vùng nội dung tuỳ chỉnh được gắn, thông tin công bố sẽ tự động cập nhật để làm rõ nội dung nào do Google cung cấp và nội dung nào do bên thứ ba cung cấp.
Việc nên làm
Duy trì hệ thống phân cấp trực quan rõ ràng giữa Place Details trên Google và nội dung tuỳ chỉnh để tránh gây nhầm lẫn về nguồn thông tin.
Việc nên làm
Cân nhắc thông tin chi tiết được bản địa hoá, có giá trị cao và phù hợp với mục tiêu trước mắt của người dùng. Nội dung phù hợp (chẳng hạn như thời gian đặt phòng theo thời gian thực hoặc tình trạng phòng trống hiện tại) giúp người dùng đưa ra quyết định nhanh hơn và sáng suốt hơn.
Việc không nên làm
Đừng sao chép thông tin chi tiết hiện có về địa điểm trên Google, chẳng hạn như điểm xếp hạng, bài đánh giá hoặc giờ hoạt động, ngay cả khi bạn đã ẩn nội dung do Google cung cấp. Việc này có thể khiến người dùng nhầm lẫn về nguồn gốc của nội dung và liệu nội dung đó đến từ Google hay bên thứ ba.
Việc không nên làm
Đừng đăng những tuyên bố hoặc huy hiệu không ghi rõ nguồn (ví dụ: "Đề xuất hàng đầu!") có thể bị nhầm lẫn là sự chứng thực chính thức của Google. Nội dung tuỳ chỉnh phải ghi rõ nguồn.
Việc không nên làm
Đừng đưa quảng cáo, nội dung tiếp thị, chiết khấu khuyến mãi hoặc lời nhắc đăng ký vào vùng chứa địa điểm tuỳ chỉnh.
Ví dụ nâng cao về Place Details
Bỏ qua tên địa điểm
Để bỏ qua Tên địa điểm, đừng thêm.name vào tham số content của AdvancedPlaceDetailsConfiguration.
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))") } } ) } }
Xoá nút hành động
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 [] } } }
Thêm các thao tác tuỳ chỉnh và thao tác được xác định trước
Mẫu này thêm một lựa chọn để người dùng có thể thêm một địa điểm vào danh sách yêu thích hoặc bỏ thích địa điểm đó, cùng với thao tác Mở trong Maps được xác định trước.
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) } } }
Lọc bài đánh giá và nội dung nghe nhìn
Mã mẫu này chỉ cho thấy nội dung nghe nhìn và bài đánh giá có đề cập đến "cà phê".
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)") } } } }
Tạo vị trí nội dung
Mẫu này thêm nội dung vào các vùng basicSectionTop và basicSectionBottom.
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) } } }