प्लैटफ़ॉर्म चुनें: Android iOS JavaScript

पसंद के मुताबिक स्टाइल बनाना

जगह की जानकारी वाले विज़ुअल को पसंद के मुताबिक बनाना
विज़ुअल को पसंद के मुताबिक बनाने के उदाहरण

Places API के यूज़र इंटरफ़ेस (यूआई) किट के इन कॉम्पोनेंट के रंग, टाइपोग्राफ़ी, स्पेसिंग, बॉर्डर, और कोनों को पसंद के मुताबिक बनाया जा सकता है:

जगहों की जानकारी देने वाली यूआई किट, विज़ुअल कस्टमाइज़ेशन के लिए डिज़ाइन सिस्टम का इस्तेमाल करती है. यह मटीरियल डिज़ाइन पर आधारित है. हालांकि, इसमें Google Maps के हिसाब से कुछ बदलाव किए गए हैं. कलर और टाइपोग्राफ़ी के लिए, Material Design का रेफ़रंस देखें. डिफ़ॉल्ट रूप से, स्टाइल Google Maps के विज़ुअल डिज़ाइन की भाषा के मुताबिक होती है.

जगह की जानकारी को पसंद के मुताबिक बनाने के विकल्प

किसी फ़्रैगमेंट को इंस्टैंशिएट करते समय, ऐसी थीम तय की जा सकती है जो किसी भी डिफ़ॉल्ट स्टाइल एट्रिब्यूट को बदल देती है. जिन थीम एट्रिब्यूट को बदला नहीं गया है वे डिफ़ॉल्ट स्टाइल का इस्तेमाल करते हैं. 

  <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 तारीख के बैज और लोड हो रहे प्लेसहोल्डर के आकार की समीक्षा करना
placesColorOnNeutralContainer समीक्षा की तारीख, लोड करने में गड़बड़ी हुई
placesColorPositiveContainer ईवी चार्जर के लिए उपलब्ध बैज
placesColorOnPositiveContainer ईवी चार्जर के बैज के लिए उपलब्ध कॉन्टेंट
placesColorPositive जगह के लिए "खुला है" लेबल
placesColorNegative जगह को अब "बंद है" के तौर पर लेबल किया गया है
placesColorInfo व्हीलचेयर लाने-ले जाने की सुविधा वाले रास्ते का आइकॉन
placesColorButtonBorder 'Google Maps में खोलें' और 'ठीक है' बटन
   
टाइपोग्राफ़ी
placesTextAppearanceBodySmall जगह के बारे में जानकारी
placesTextAppearanceBodyMedium जगह की जानकारी, डायलॉग बॉक्स का कॉन्टेंट
placesTextAppearanceLabelMedium बैज का कॉन्टेंट
placesTextAppearanceLabelLarge बटन का कॉन्टेंट
placesTextAppearanceHeadlineMedium डायलॉग बॉक्स की हेडिंग
placesTextAppearanceDisplaySmall जगह का नाम
placesTextAppearanceTitleSmall जगह का नाम
   
स्पेसिंग
placesSpacingExtraSmall
placesSpacingSmall
placesSpacingMedium
placesSpacingLarge
placesSpacingExtraLarge
placesSpacingTwoExtraLarge
   
मेज़रमेंट
placesBorderWidth कंटेनर
placesBorderWidthButton
   
आकार
placesCornerRadius कंटेनर
placesCornerRadiusButton 'Maps में खोलें' और 'ठीक है' बटन (इसमें गोल आइकॉन वाला बटन शामिल नहीं है)
placesCornerRadiusThumbnail थंबनेल इमेज जोड़ना
placesCornerRadiusCollageOuter मीडिया कोलाज
placesCornerRadiusCard जगह की जानकारी वाला कार्ड, उपयोगकर्ता की समीक्षा वाला कार्ड
placesCornerRadiusDialog Google Maps की जानकारी देने वाला डायलॉग बॉक्स
   
Google Maps में ब्रैंड एट्रिब्यूशन
placesColorAttributionLightTheme Google Maps की हल्के रंग वाली थीम में एट्रिब्यूशन और डिसक्लोज़र बटन (सफ़ेद, स्लेटी, और काले रंग के लिए enum)
placesColorAttributionDarkTheme Google Maps के एट्रिब्यूशन और डिसक्लोज़र बटन के लिए गहरे रंग वाली थीम (सफ़ेद, स्लेटी, और काले रंग के लिए enum)

एट्रिब्यूशन के रंग

एट्रिब्यूशन
Attribution

Google Maps की सेवा की शर्तों के मुताबिक, Google Maps के एट्रिब्यूशन के लिए, आपको ब्रैंड के तीन रंगों में से किसी एक का इस्तेमाल करना होगा. कस्टम बनाने से जुड़े बदलाव किए जाने पर, एट्रिब्यूशन दिखना चाहिए और इसे ऐक्सेस किया जा सकना चाहिए.

हम आपको ब्रैंड के तीन रंग चुनने का विकल्प देते हैं. इन्हें लाइट और डार्क थीम के लिए अलग-अलग सेट किया जा सकता है:

  • हल्के रंग वाली थीम: placesColorAttributionLight के लिए enum वैल्यू, सफ़ेद, स्लेटी, और काला.
  • गहरे रंग वाली थीम: placesColorAttributionDark में सफ़ेद, स्लेटी, और काले रंग के लिए enum वैल्यू दी गई हैं.

उदाहरण

इस कोड सैंपल में, डिफ़ॉल्ट स्टाइल एट्रिब्यूट को बदलने वाली थीम बनाने का तरीका बताया गया है. जिन थीम एट्रिब्यूट को बदला नहीं गया है वे डिफ़ॉल्ट स्टाइल का इस्तेमाल करते हैं. 
  <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>

हर कॉम्पोनेंट के लिए पूरे उदाहरण