Advanced Place List コンポーネント
Advanced Place List コンポーネントを使用すると、場所のリストを定義して表示できます。Place Details コンポーネントでサポートされている同じ ID セット(Place ID、Place リソース名、緯度/経度座標)から最大 20 個のプレイスをリストできます。
リストの表示を横向きと縦向きから選択できます。デフォルトの向きは縦向きです。各リストアイテムには、コンパクトな場所の詳細カードと完全な場所の詳細カードと同じ情報と構成オプションが用意されています。
AdvancedPlaceListView の orientation、placeIdentifiers、configuration パラメータを使用してリストを作成します。詳しくは、例をご覧ください。課金
リスト リクエストごとに課金され、リストの変更は新しい課金対象イベントとなります。
例
このサンプルでは、プレイス ID に基づいてリストを作成します。configuration パラメータは、各リストアイテムに住所、評価、タイプ、その他の視覚的な仕様が表示されることを指定します。ユーザーが各リストアイテムをお気に入りに追加またはお気に入りから削除できるように、メイン アクションが作成されます。各リストアイテムのコーナー アクションが無効になっています。
Swift
struct AdvancedPlaceListDemoView: View { private let configuration = AdvancedPlaceListConfiguration( content: [.address(), .rating(), .type()], preferTruncation: true, theme: PlacesMaterialTheme(), attributionPosition: .bottom, mediaSize = .medium, selectable: true ) @State private var placeIdentifiers = [.placeID("ChIJj61dQgK6j4AR4GeTYWZsKWw")] @State private var favoritePlaces: Set<String> = [] var body: some View { AdvancedPlaceListView( orientation: .horizontal, // default is vertical placeIdentifiers: placeIdentifiers, configuration: configuration ) .onLoad { results in for result in results { switch result { case .success(let place) print("place: \(place)") case .failure(let error) print("error: \(error)") } } } .onPlaceSelected { place, index in print("place: \(place)") print("index: \(index)") } .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 } // Ensures that there are no corner actions. .cornerActions { _ in return [] } } func toggleFavorite(_ placeID: String) { if favoritePlaces.contains(placeID) { favoritePlaces.remove(placeID) } else { favoritePlaces.insert(placeID) } } }