장소 세부정보 UI 키트 (실험용)
장소 세부정보용 장소 세부정보 UI 키트를 사용하면 앱에 장소 세부정보를 표시하는 개별 UI 구성요소를 추가할 수 있습니다. UI 키트는 독립적으로 사용하거나 다른 Google Maps Platform API 및 서비스와 함께 사용할 수 있습니다. UI 키트는 장소 ID 또는 위도/경도 좌표를 사용하고 렌더링된 장소 세부정보 정보를 반환합니다.
UI 키트는 가로 또는 세로로 표시할 수 있는 좁은 보기를 제공합니다. 기본 테마의 속성을 재정의하여 장소 세부정보의 모양을 맞춤설정할 수 있습니다. 장소에 표시되는 정보에 각각 대응하는 Content 항목 목록을 지정하여 포함할 장소 세부정보 필드를 맞춤설정할 수도 있습니다.
결제
장소 세부정보에 장소 세부정보 UI 키트를 사용하는 경우 .loadPlaceDetails() 메서드가 호출될 때마다 요금이 청구됩니다. 동일한 장소를 여러 번 로드하면 요청마다 비용이 청구됩니다. 요금이 여러 번 청구되지 않도록 하려면 Android 수명 주기 메서드에 .loadPlaceDetails()를 직접 추가하지 마세요. 예를 들어 onResume() 메서드에서 .loadPlaceDetails()를 직접 호출하지 마세요.
장소 UI 키트 사용 설정
장소 UI 키트를 사용하기 전에 다음을 실행해야 합니다.
장소 세부정보 UI 키트 예시
레이아웃에 프래그먼트를 추가하여 앱에 장소 세부정보를 추가할 수 있습니다. 프래그먼트를 인스턴스화할 때 필요에 맞게 장소 세부정보 정보의 디자인과 분위기를 맞춤설정하고 앱의 모양에 맞출 수 있습니다.
방향 (가로 또는 세로), 테마 재정의, 콘텐츠를 지정할 수 있습니다. 콘텐츠 옵션은 미디어, 주소, 평점, 가격, 유형, 접근 가능한 입구, 지도 링크, 경로 링크입니다. 맞춤설정 예 보기
Kotlin
val fragment = PlaceDetailsCompactFragment.newInstance( orientation, listOf(Content.ADDRESS, Content.TYPE, Content.RATING, Content.ACCESSIBLE_ENTRANCE), R.style.CustomizedPlaceDetailsTheme, ) fragment.setPlaceLoadListener(object : PlaceLoadListener { override fun onSuccess() { ... } override fun onFailure(e: Exception) { ... } }) supportFragmentManager .beginTransaction() .add(R.id.fragment_container, fragment) .commitNow() fragment.loadPlaceDetails(placeId)
자바
PlaceDetailsCompactFragment fragment = PlaceDetailsCompactFragment.newInstance( Orientation.HORIZONTAL, Arrays.asList(Content.ADDRESS, Content.TYPE, Content.RATING, Content.ACCESSIBLE_ENTRANCE), R.style.CustomizedPlaceDetailsTheme); fragment.setPlaceLoadListener( new PlaceLoadListener() { @Override public void onSuccess() { ... } @Override public void onFailure(Exception e) { ... } }); getSupportFragmentManager() .beginTransaction() .add(R.id.fragment_container, fragment) .commitNow(); fragment.loadPlaceDetails(placeId);
장소 세부정보 위젯을 로드하는 전체 코드 보기
Kotlin
import android.os.Bundle import android.util.Log import android.view.View import android.widget.FrameLayout import androidx.appcompat.app.AppCompatActivity import com.google.android.gms.maps.CameraUpdateFactory import com.google.android.gms.maps.GoogleMap import com.google.android.gms.maps.OnMapReadyCallback import com.google.android.gms.maps.SupportMapFragment import com.google.android.gms.maps.model.LatLng import com.google.android.gms.maps.model.PointOfInterest import com.google.android.libraries.places.api.Places import com.google.android.libraries.places.api.net.PlacesClient import com.google.android.libraries.places.widget.PlaceDetailsCompactFragment import com.google.android.libraries.places.widget.PlaceDetailsCompactFragment.Companion.ALL_CONTENT import com.google.android.libraries.places.widget.model.Orientation class MainActivity : AppCompatActivity(), OnMapReadyCallback, GoogleMap.OnPoiClickListener { private var googleMap: GoogleMap? = null private val orientation: Orientation = Orientation.HORIZONTAL private lateinit var placesClient: PlacesClient private var placeDetailsFragment: PlaceDetailsCompactFragment? = null override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) // --- Initialize Places SDK --- val apiKey = BuildConfig.PLACES_API_KEY if (apiKey.isEmpty()) { Log.e("Places test", "No api key") finish() return } Places.initializeWithNewPlacesApiEnabled(applicationContext, apiKey) placesClient = Places.createClient(this) // ----------------------------- val mapFragment = supportFragmentManager.findFragmentById(R.id.map_fragment) as SupportMapFragment? mapFragment?.getMapAsync(this) } override fun onMapReady(map: GoogleMap) { googleMap = map val sydney = LatLng(-33.8688, 151.2093) val zoomLevel = 13f googleMap?.moveCamera(CameraUpdateFactory.newLatLngZoom(sydney, zoomLevel)) googleMap?.setOnPoiClickListener(this) } override fun onPoiClick(poi: PointOfInterest) { val placeId = poi.placeId Log.d("POI Click", "Place ID: $placeId") showPlaceDetailsFragment(placeId) } private fun showPlaceDetailsFragment(placeId: String) { placeDetailsFragment = PlaceDetailsCompactFragment.newInstance( orientation, ALL_CONTENT ) supportFragmentManager .beginTransaction() .replace(findViewById<FrameLayout>(R.id.place_details_fragment_host).id, placeDetailsFragment!!) .commitNow() placeDetailsFragment?.loadPlaceDetails(placeId) } }
맞춤설정 예
프래그먼트를 인스턴스화할 때 기본 스타일 속성을 재정의하는 테마를 지정할 수 있습니다. 재정의되지 않은 테마 속성은 기본 스타일을 사용합니다. 어두운 테마를 지원하려면 values-night/colors.xml에 색상 항목을 추가하면 됩니다.
<style name="CustomizedPlaceDetailsTheme" parent="PlacesTheme"> <item name="placesColorPrimary">@color/app_primary_color</item> <item name="placesColorOnSurface">@color/app_color_on_surface</item> <item name="placesColorOnSurfaceVariant">@color/app_color_on_surface</item> <item name="placesTextAppearanceBodySmall">@style/app_text_appearence_small</item> <item name="placesCornerRadius">20dp</item> </style>
다음 스타일을 맞춤설정할 수 있습니다.
placesColorSurfaceContainerLowestplacesColorOutlineDecorativeplacesColorPrimaryplacesColorOnSurfaceplacesColorOnSurfaceVariantplacesColorSecondaryContainerplacesColorOnSecondaryContainerplacesCornerRadiusplacesTextAppearanceBodySmallplacesTextAppearanceBodyMediumplacesTextAppearanceBodyLargeplacesTextAppearanceLabelLargeplacesTextAppearanceHeadlineMediumplacesColorAttributionLight(흰색, 회색, 검은색의 enum)placesColorAttributionDark(흰색, 회색, 검은색의 enum)
이 샘플에서는 표준 콘텐츠를 맞춤설정합니다.
val fragmentStandardContent = PlaceDetailsCompactFragment.newInstance( orientation, PlaceDetailsCompactFragment.STANDARD_CONTENT, R.style.BrandedPlaceDetailsTheme, )
이 샘플은 모든 콘텐츠를 맞춤설정합니다.
val fragmentAllContent = PlaceDetailsCompactFragment.newInstance( orientation, PlaceDetailsCompactFragment.ALL_CONTENT, R.style.BrandedPlaceDetailsTheme, )