רכיב Place Details
רכיב פרטי המקום ב-Places UI Kit מאפשר להוסיף רכיב UI נפרד שמציג פרטים על מקום באפליקציה. אפשר להתאים אישית את הרכיב הזה.
אפשר להשתמש ברכיב Place Details (פרטי מקום) באופן עצמאי או בשילוב עם ממשקי API ושירותים אחרים של Google Maps Platform. הרכיב מקבל מזהה מקום, שם משאב או קואורדינטות של קו רוחב וקו אורך, ומחזיר מידע מעובד של פרטי מקום.
אפשר להחיל ערכות עיצוב על הרכיב 'פרטי מקום', וכך להתאים אישית את הגופנים, הצבעים ורדיוס הפינות בהתאם לתרחיש השימוש ולהנחיות המיתוג החזותי. אתם יכולים להתאים אישית את המראה של פרטי המקום על ידי יצירת עיצוב שמרחיב את PlacesMaterialTheme ומספק החלפות של מאפייני העיצוב. אפשר גם להתאים אישית את השדות של פרטי המקום שייכללו, על ידי ציון רשימה של רשומות תוכן, שכל אחת מהן מתאימה לפריט מידע שמוצג על המקום.
גרסאות שונות של פריסות
הרכיב Place Details תומך בשני סוגים עיקריים של פריסות:
- קומפקטית: פריסה לתצוגה מקדימה של מידע חשוב.
- מלא: פריסה מקיפה שבה מוצגים כל הפרטים הזמינים על המקום.
אפשר להציג את הפריסה הקומפקטית במצב אנכי או אופקי. כך אפשר לשלב את הרכיב בפריסות עיצוב שונות ובמסכים בגדלים שונים. אפשר להציג את הפריסה המלאה רק בצורה אנכית.
רכיב פרטי המקום מאפשר לכם שליטה מדויקת בתוכן שמוצג ברכיב. אפשר להציג או להסתיר כל רכיב בנפרד (כמו תמונות, ביקורות ופרטים ליצירת קשר), וכך להתאים במדויק את המראה של הרכיבים ואת צפיפות המידע.
תצוגה קומפקטית של פרטי המקום
הקטע הקומפקטי Place Details (PlaceDetailsCompactFragment) מציג פרטים של מקום נבחר תוך שימוש בשטח מינימלי. המידע הזה יכול להיות שימושי בחלון מידע שמציג מקום במפה, בחוויית שימוש ברשתות חברתיות כמו שיתוף מיקום בצ'אט, כהצעה לבחירת המיקום הנוכחי או במאמר חדשותי כדי להפנות למקום במפות Google.
תצוגה מלאה של פרטי המקום
בתצוגה המלאה של פרטי המקום (PlaceDetailsFragment) יש יותר מקום להצגת פרטי המקום, ואפשר להציג בה יותר סוגים של מידע.
אפשרויות תצוגה של תוכן
אתם יכולים לציין איזה תוכן יוצג באמצעות הערכים המנויים ב-PlaceDetailsCompactFragment.Content או ב-PlaceDetailsFragment.Content.
| תצוגה קומפקטית | תצוגה מלאה |
|---|---|
|
|
חיוב
כשמשתמשים ב-Place Details UI Kit, מתבצע חיוב בכל פעם שמפעילים את השיטה .loadWithPlaceId(), .loadWithResourceName() או loadWithCoordinates(). אם תטענו את אותו מקום כמה פעמים, תחויבו על כל בקשה.
כדי להימנע מחיובים חוזרים, אל תוסיפו את .loadWithPlaceId() או את .loadWithResourceName() ישירות לשיטות של מחזור החיים ב-Android. לדוגמה, אל תתקשרו ישירות אל .loadWithPlaceId() או .loadWithResourceName() בשיטה onResume().
הוספת פרטי מקום לאפליקציה
כדי להוסיף פרטים על מקום לאפליקציה, מוסיפים fragment לפריסה. כשיוצרים מופע של ה-Fragment, אפשר להתאים אישית את המראה והסגנון של פרטי המקום כך שיתאימו לצרכים שלכם ולמראה של האפליקציה. מידע נוסף על התאמה אישית
יש שלוש שיטות שזמינות ב-Kotlin וב-Java: שיטה אחת לטעינת הפריט עם מזהה מקום (loadWithPlaceId()), שיטה אחת לטעינת הפריט עם שם משאב (loadWithResourceName()) ושיטה אחת לטעינת הפריט עם קואורדינטות של קו רוחב וקו אורך (loadWithCoordinates()). אתם יכולים לבחור שיטה אחת או כמה שיטות.
כברירת מחדל, התצוגה הקומפקטית מוצגת לאורך. אם רוצים פריסה אופקית, מציינים Orientation.HORIZONTAL. אפשר גם לציין את השדה Orientation.VERTICAL כדי להבהיר את הפעולה. אפשר להציג את התצוגה המלאה רק בצורה אנכית.
דוגמאות מפורטות בקטע דוגמאות לרכיב Place Details.
התאמה אישית של המראה
ערכת ה-UI של Places מציעה גישה של מערכת עיצוב להתאמה אישית של רכיבים חזותיים, שמבוססת בערך על Material Design (עם כמה שינויים ספציפיים למפות Google). אפשר לעיין בהפניה של Material Design בנושא צבע וטיפוגרפיה. כברירת מחדל, הסגנון תואם לשפת העיצוב החזותי של מפות Google.
כשמפעילים fragment, אפשר לציין עיצוב שמבטל את כל מאפייני הסגנון שמוגדרים כברירת מחדל. כל מאפייני העיצוב שלא מוגדרים מחדש משתמשים בסגנונות ברירת המחדל. אם אתם רוצים לתמוך בעיצוב כהה, אתם יכולים להוסיף רשומה לצבע ב-values-night/colors.xml.
<style name="CustomizedPlaceDetailsTheme" parent="PlacesMaterialTheme"> <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>
אפשר להתאים אישית את הסגנונות הבאים:
| מאפיין עיצוב | שימוש |
|---|---|
| צבע | |
placesColorSurface |
רקע של מכל ושל תיבת דו-שיח |
placesColorOutlineDecorative |
גבול המאגר |
placesColorPrimary |
קישורים, אינדיקטור טעינה, סמלי סקירה כללית |
placesColorOnSurface |
כותרות, תוכן תיבת דו-שיח |
placesColorOnSurfaceVariant |
מידע על מקום |
placesColorSecondaryContainer |
רקע כפתור |
placesColorOnSecondaryContainer |
טקסט וסמל של כפתור |
placesColorNeutralContainer |
בדיקת תג התאריך, טעינה של צורות placeholder |
placesColorOnNeutralContainer |
תאריך הביקורת, שגיאה בטעינה |
placesColorPositiveContainer |
תג עמדת טעינה לרכב חשמלי (EV) |
placesColorOnPositiveContainer |
תוכן התג 'עמדת טעינה לרכב חשמלי (EV)' |
placesColorPositive |
התווית 'פתוח' במקום |
placesColorNegative |
התווית 'סגור' נוספה למקום |
placesColorInfo |
סמל של כניסה נגישה |
placesColorButtonBorder |
לחצנים לפתיחה במפות ולאישור |
| טיפוגרפיה | |
placesTextAppearanceBodySmall |
מידע על מקום |
placesTextAppearanceBodyMedium |
פרטי המקום, תוכן תיבת הדו-שיח |
placesTextAppearanceLabelMedium |
תוכן התג |
placesTextAppearanceLabelLarge |
תוכן הכפתור |
placesTextAppearanceHeadlineMedium |
כותרות של תיבות דו-שיח |
placesTextAppearanceDisplaySmall |
שם המקום |
placesTextAppearanceTitleSmall |
שם המקום |
| ריווח | |
placesSpacingExtraSmall |
|
placesSpacingSmall |
|
placesSpacingMedium |
|
placesSpacingLarge |
|
placesSpacingExtraLarge |
|
placesSpacingTwoExtraLarge |
|
| מדידה | |
placesBorderWidth |
מאגר |
placesBorderWidthButton |
|
| צורה | |
placesCornerRadius |
מאגר |
placesCornerRadiusButton |
לחצני 'פתיחה במפות' ו'אישור' (לא כולל לחצן סמל עגול) |
placesCornerRadiusThumbnail |
מיקום התמונה הממוזערת |
placesCornerRadiusCollageOuter |
קולאז' מדיה |
placesCornerRadiusCard |
כרטיס מקום, כרטיס ביקורת משתמש |
placesCornerRadiusDialog |
תיבת חשיפה במפות Google |
| שיוך מותג במפות Google | |
placesColorAttributionLightTheme |
לחצן שיוך וגילוי נאות של מפות Google בעיצוב בהיר (ערכי enum ללבן, אפור ושחור) |
placesColorAttributionDarkTheme |
כפתור שיוך וגילוי נאות במפות Google בעיצוב כהה (מספרי enum לצבעים לבן, אפור ושחור) |
דוגמאות מפורטות בקטע דוגמאות לרכיב Place Details.
התאמה אישית של הרוחב והגובה
תצוגות קומפקטיות
רוחבים מומלצים:
- כיוון אנכי: בין 180dp ל-300dp.
- כיוון אופקי: בין 180dp ל-500dp.
יכול להיות שרוחב קטן מ-160dp לא יוצג בצורה תקינה.
השיטה המומלצת היא לא להגדיר גובה לתצוגות קומפקטיות. כך התוכן בחלון יוכל להגדיר את הגובה, וכל המידע יוצג.
צפיות מלאות
לצפיות מלאות, הרוחב המומלץ הוא בין 250dp ל-450dp. יכול להיות שרוחב קטן מ-250dp לא יוצג בצורה תקינה.
אפשר להגדיר את הגובה של הרכיב: התצוגה האנכית של פרטי המקום תגולל אנכית בתוך השטח שהוקצה לה.
השיטה המומלצת היא להגדיר גובה לתצוגות מלאות. כך התוכן בחלון יוכל לגלול בצורה תקינה.
צבעי שיוך
התנאים וההגבלות של מפות Google מחייבים שימוש באחד משלושת צבעי המותג לציון השיוך למפות Google. הייחוס הזה צריך להיות גלוי ונגיש כשמבצעים שינויים בהתאמה האישית.
אנחנו מציעים 3 צבעי מותג לבחירה, שאפשר להגדיר אותם בנפרד לעיצובים בהירים וכהים:
- עיצוב בהיר:
placesColorAttributionLightעם ערכי enum ללבן, אפור ושחור. - עיצוב כהה:
placesColorAttributionDarkעם ערכי enum ללבן, אפור ושחור.
דוגמאות לרכיב Place Details
יצירת תצוגה קומפקטית או מלאה
Kotlin
// We create a new instance of the fragment using its factory method. // We can specify which content to show, the orientation, and a custom theme. val fragment = PlaceDetailsCompactFragment.newInstance( PlaceDetailsCompactFragment.ALL_CONTENT, // Show all available content. orientation, R.style.CustomizedPlaceDetailsTheme, ).apply { // The PlaceLoadListener provides callbacks for when the place data is successfully // loaded or when an error occurs. This is where we update our UI state. setPlaceLoadListener(object : PlaceLoadListener { override fun onSuccess(place: Place) { Log.d(TAG, "Place loaded: ${place.id}") // Once the data is loaded, we hide the loading indicator and show the fragment. binding.loadingIndicatorMain.visibility = View.GONE binding.placeDetailsContainer.visibility = View.VISIBLE binding.dismissButton.visibility = View.VISIBLE } override fun onFailure(e: Exception) { Log.e(TAG, "Place failed to load", e) // On failure, we hide the UI and notify the user. dismissPlaceDetails() Toast.makeText(this@MainActivity, "Failed to load place details.", Toast.LENGTH_SHORT).show() } }) } // We add the fragment to our layout's container view. // `commitNow()` is used to ensure the fragment is immediately added and available, // which is important because we need to call a method on it right after. supportFragmentManager .beginTransaction() .replace(binding.placeDetailsContainer.id, fragment) .commitNow() // **This is the key step**: After adding the fragment, we call `loadWithPlaceId` // to trigger the data loading process for the selected place. // We use `post` to ensure this runs after the layout has been measured, // which can prevent potential timing issues. binding.root.post { fragment.loadWithPlaceId(placeId) } }
Java
PlaceDetailsCompactFragment fragment = PlaceDetailsCompactFragment.newInstance( Orientation.HORIZONTAL, Arrays.asList(Content.ADDRESS, Content.TYPE, Content.RATING, Content.ACCESSIBLE_ENTRANCE_ICON), R.style.CustomizedPlaceDetailsTheme); fragment.setPlaceLoadListener( new PlaceLoadListener() { @Override public void onSuccess(Place place) { ... } @Override public void onFailure(Exception e) { ... } }); getSupportFragmentManager() .beginTransaction() .add(R.id.fragment_container, fragment) .commitNow(); // Load the fragment with a Place ID. fragment.loadWithPlaceId(placeId); // Load the fragment with a resource name. fragment.loadWithResourceName(resourceName);
בדוגמה המלאה הזו של הקוד, הכיוון של התצוגה הקומפקטית נקבע באופן פרוגרמטי על סמך ההגדרה של המכשיר של המשתמש.
Kotlin
package com.example.placedetailsuikit import android.Manifest import android.annotation.SuppressLint import android.content.pm.PackageManager import android.content.res.Configuration import android.location.Location import android.os.Bundle import android.util.Log import android.view.View import android.widget.Toast import androidx.activity.enableEdgeToEdge import androidx.activity.result.ActivityResultLauncher import androidx.activity.result.contract.ActivityResultContracts import androidx.activity.viewModels import androidx.appcompat.app.AppCompatActivity import androidx.core.app.ActivityCompat import androidx.lifecycle.ViewModel import com.example.placedetailsuikit.databinding.ActivityMainBinding import com.google.android.gms.location.FusedLocationProviderClient import com.google.android.gms.location.LocationServices 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.model.Place import com.google.android.libraries.places.widget.PlaceDetailsCompactFragment import com.google.android.libraries.places.widget.PlaceLoadListener import com.google.android.libraries.places.widget.model.Orientation private const val TAG = "PlacesUiKit" /** * A simple ViewModel to store UI state that needs to survive configuration changes. * In this case, it holds the ID of the selected place. Using a ViewModel is good practice * as it prevents data loss during events like screen rotation, ensuring a * seamless user experience. */ class MainViewModel : ViewModel() { var selectedPlaceId: String? = null } /** * This activity serves as a basic example of integrating the Place Details UI Kit. * It demonstrates the fundamental steps required: * 1. Setting up a Google Map. * 2. Requesting location permissions to center the map. * 3. Handling clicks on Points of Interest (POIs) to get a Place ID. * 4. Using the Place ID to load and display place details in a [PlaceDetailsCompactFragment]. */ class MainActivity : AppCompatActivity(), OnMapReadyCallback, GoogleMap.OnPoiClickListener { // ViewBinding provides type-safe access to views defined in the XML layout, // eliminating the need for `findViewById` and preventing null pointer exceptions. private lateinit var binding: ActivityMainBinding private var googleMap: GoogleMap? = null // The FusedLocationProviderClient is the main entry point for interacting with the // fused location provider, which intelligently manages the underlying location technologies. private lateinit var fusedLocationClient: FusedLocationProviderClient // Using registerForActivityResult is the modern, recommended approach for handling // permission requests. It decouples the request from the handling logic, making the // code cleaner and easier to manage compared to the older `onRequestPermissionsResult` callback. private lateinit var requestPermissionLauncher: ActivityResultLauncher<Array<String>> // The `by viewModels()` delegate provides a lazy-initialized ViewModel scoped to this Activity. // This ensures that we get the same ViewModel instance across configuration changes. private val viewModel: MainViewModel by viewModels() override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // The ActivityResultLauncher is initialized here. The lambda defines the callback // that will be executed once the user responds to the permission dialog. requestPermissionLauncher = registerForActivityResult(ActivityResultContracts.RequestMultiplePermissions()) { permissions -> // We check if either fine or coarse location permission was granted. if (permissions[Manifest.permission.ACCESS_FINE_LOCATION] == true || permissions[Manifest.permission.ACCESS_COARSE_LOCATION] == true) { Log.d(TAG, "Location permission granted by user.") fetchLastLocation() } else { // If permission is denied, we inform the user and default to a known location. // This ensures the app remains functional even without location access. Log.d(TAG, "Location permission denied by user.") Toast.makeText( this, "Location permission denied. Showing default location.", Toast.LENGTH_LONG ).show() moveToSydney() } } // enableEdgeToEdge() allows the app to draw behind the system bars for a more immersive experience. enableEdgeToEdge() binding = ActivityMainBinding.inflate(layoutInflater) setContentView(binding.root) binding.dismissButton.setOnClickListener { dismissPlaceDetails() } // --- Crucial: Initialize Places SDK --- // It's essential to initialize the Places SDK before making any other Places API calls. // This should ideally be done once, for example, in the Application's `onCreate`. val apiKey = BuildConfig.PLACES_API_KEY if (apiKey.isEmpty() || apiKey == "YOUR_API_KEY") { // A valid API key is required for the Places SDK to function. Log.e(TAG, "No api key") Toast.makeText( this, "Add your own API_KEY in local.properties", Toast.LENGTH_LONG ).show() finish() return } // `initializeWithNewPlacesApiEnabled` is used to opt-in to the new SDK version. Places.initializeWithNewPlacesApiEnabled(applicationContext, apiKey) fusedLocationClient = LocationServices.getFusedLocationProviderClient(this) // ------------------------------------ // The SupportMapFragment is the container for the map. `getMapAsync` allows us to // work with the GoogleMap object via a callback once it's fully initialized. val mapFragment = supportFragmentManager.findFragmentById(R.id.map_fragment) as SupportMapFragment? mapFragment?.getMapAsync(this) // This block handles restoration after a configuration change (e.g., screen rotation). // If a place was selected before the rotation, its ID is stored in the ViewModel. // We use this ID to immediately show the details fragment again. if (viewModel.selectedPlaceId != null) { viewModel.selectedPlaceId?.let { placeId -> Log.d(TAG, "Restoring PlaceDetailsFragment for place ID: $placeId") showPlaceDetailsFragment(placeId) } } } /** * This callback is triggered when the GoogleMap object is ready to be used. * All map setup logic should be placed here. */ override fun onMapReady(map: GoogleMap) { Log.d(TAG, "Map is ready") googleMap = map // Setting the OnPoiClickListener allows us to capture user taps on points of interest. googleMap?.setOnPoiClickListener(this) // After the map is ready, we determine the initial camera position based on location permissions. if (isLocationPermissionGranted()) { fetchLastLocation() } else { requestLocationPermissions() } } /** * A helper function to centralize the check for location permissions. */ private fun isLocationPermissionGranted(): Boolean { return ActivityCompat.checkSelfPermission( this, Manifest.permission.ACCESS_FINE_LOCATION ) == PackageManager.PERMISSION_GRANTED || ActivityCompat.checkSelfPermission( this, Manifest.permission.ACCESS_COARSE_LOCATION ) == PackageManager.PERMISSION_GRANTED } /** * This function triggers the permission request flow. The result is handled by the * ActivityResultLauncher defined in `onCreate`. */ private fun requestLocationPermissions() { Log.d(TAG, "Requesting location permissions.") requestPermissionLauncher.launch( arrayOf( Manifest.permission.ACCESS_FINE_LOCATION, Manifest.permission.ACCESS_COARSE_LOCATION ) ) } /** * Fetches the device's last known location. This is a fast and battery-efficient way * to get a location fix. It should only be called after verifying permissions. */ @SuppressLint("MissingPermission") private fun fetchLastLocation() { // Double-checking permissions here is a good practice, although the call sites are already guarded. if (isLocationPermissionGranted()) { fusedLocationClient.lastLocation .addOnSuccessListener { location: Location? -> if (location != null) { val userLocation = LatLng(location.latitude, location.longitude) googleMap?.moveCamera(CameraUpdateFactory.newLatLngZoom(userLocation, 13f)) Log.d(TAG, "Moved to user's last known location.") } else { // `lastLocation` can be null if the location has never been recorded. // In this case, we fall back to a default location. Log.d(TAG, "Last known location is null. Falling back to Sydney.") moveToSydney() } } .addOnFailureListener { // This listener handles errors in the location fetching process. Log.e(TAG, "Failed to get location.", it) moveToSydney() } } } /** * Moves the map camera to a default, hardcoded location (Sydney). * This serves as a reliable fallback. */ private fun moveToSydney() { val sydney = LatLng(-33.8688, 151.2093) googleMap?.moveCamera(CameraUpdateFactory.newLatLngZoom(sydney, 13f)) Log.d(TAG, "Moved to Sydney") } /** * This is the callback for the `OnPoiClickListener`. It's triggered when a user * taps a POI on the map. */ override fun onPoiClick(poi: PointOfInterest) { val placeId = poi.placeId Log.d(TAG, "Place ID: $placeId") // We save the selected place ID to the ViewModel. This is critical for surviving // configuration changes. If the user rotates the screen now, the `onCreate` // method will be able to restore the place details view. viewModel.selectedPlaceId = placeId showPlaceDetailsFragment(placeId) } /** * This function is the core of the integration. It creates, configures, and displays * the [PlaceDetailsCompactFragment]. * @param placeId The unique identifier for the place to be displayed. */ private fun showPlaceDetailsFragment(placeId: String) { Log.d(TAG, "Showing PlaceDetailsFragment for place ID: $placeId") // We manage the visibility of UI elements to provide feedback to the user. // The wrapper is shown, and a loading indicator is displayed while the data is fetched. binding.placeDetailsWrapper.visibility = View.VISIBLE binding.dismissButton.visibility = View.GONE binding.placeDetailsContainer.visibility = View.GONE binding.loadingIndicatorMain.visibility = View.VISIBLE // The Place Details widget can be displayed vertically or horizontally. // We dynamically choose the orientation based on the device's current configuration. val orientation = if (resources.configuration.orientation == Configuration.ORIENTATION_LANDSCAPE) { Orientation.HORIZONTAL } else { Orientation.VERTICAL } // We create a new instance of the fragment using its factory method. // We can specify which content to show, the orientation, and a custom theme. val fragment = PlaceDetailsCompactFragment.newInstance( PlaceDetailsCompactFragment.ALL_CONTENT, // Show all available content. orientation, R.style.CustomizedPlaceDetailsTheme, ).apply { // The PlaceLoadListener provides callbacks for when the place data is successfully // loaded or when an error occurs. This is where we update our UI state. setPlaceLoadListener(object : PlaceLoadListener { override fun onSuccess(place: Place) { Log.d(TAG, "Place loaded: ${place.id}") // Once the data is loaded, we hide the loading indicator and show the fragment. binding.loadingIndicatorMain.visibility = View.GONE binding.placeDetailsContainer.visibility = View.VISIBLE binding.dismissButton.visibility = View.VISIBLE } override fun onFailure(e: Exception) { Log.e(TAG, "Place failed to load", e) // On failure, we hide the UI and notify the user. dismissPlaceDetails() Toast.makeText(this@MainActivity, "Failed to load place details.", Toast.LENGTH_SHORT).show() } }) } // We add the fragment to our layout's container view. // `commitNow()` is used to ensure the fragment is immediately added and available, // which is important because we need to call a method on it right after. supportFragmentManager .beginTransaction() .replace(binding.placeDetailsContainer.id, fragment) .commitNow() // **This is the key step**: After adding the fragment, we call `loadWithPlaceId` // to trigger the data loading process for the selected place. // We use `post` to ensure this runs after the layout has been measured, // which can prevent potential timing issues. binding.root.post { fragment.loadWithPlaceId(placeId) } } /** * Hides the place details view and clears the selected place ID from the ViewModel. */ private fun dismissPlaceDetails() { binding.placeDetailsWrapper.visibility = View.GONE // Clearing the ID in the ViewModel is important so that if the user rotates the // screen after dismissing, the details view doesn't reappear. viewModel.selectedPlaceId = null } override fun onDestroy() { super.onDestroy() // It's a good practice to nullify references to objects that have a lifecycle // tied to the activity, like the GoogleMap object, to prevent potential memory leaks. googleMap = null } }
יצירת עיצוב
כשמפעילים fragment, אפשר לציין עיצוב שמבטל את כל מאפייני הסגנון שמוגדרים כברירת מחדל. כל מאפייני העיצוב שלא מוגדרים מחדש משתמשים בסגנונות ברירת המחדל. אם אתם רוצים לתמוך בעיצוב כהה, אתם יכולים להוסיף רשומה לצבע ב-values-night/colors.xml.
<style name="CustomizedPlaceDetailsTheme" parent="PlacesMaterialTheme"> <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>
שימוש בתוכן רגיל
בדוגמה הזו נעשה שימוש בתוכן רגיל.
val fragmentStandardContent = PlaceDetailsCompactFragment.newInstance(
PlaceDetailsCompactFragment.STANDARD_CONTENT,
orientation,
R.style.CustomizedPlaceDetailsTheme
)התאמה אישית של תוכן ספציפי
בדוגמה הזו נבחרו רק האפשרויות של הכתובת, הכניסה הנגישה והמדיה Content לתצוגה קומפקטית, והן מוצגות עם CustomizedPlaceDetailsTheme.
val placeDetailsFragment = PlaceDetailsCompactFragment.newInstance(
orientation,
listOf(
Content.ADDRESS,
Content.ACCESSIBLE_ENTRANCE,
Content.MEDIA
),
R.style.CustomizedPlaceDetailsTheme
)שימוש בכל התוכן
בדוגמה הזו נעשה שימוש בכל האפשרויות של התצוגה הקומפקטית Content.
val fragmentAllContent = PlaceDetailsCompactFragment.newInstance(
orientation,
PlaceDetailsCompactFragment.ALL_CONTENT,
R.style.CustomizedPlaceDetailsTheme
)