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

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

• जगह के बारे में ज़्यादा जानकारी देने वाला कॉम्पोनेंट
• Place Search कॉम्पोनेंट
• जगह के नाम के शुरुआती अक्षर लिखने पर पूरा नाम सुझाने की सुविधा वाला बुनियादी कॉम्पोनेंट
• यूआई किट के बिना जगह के नाम का अपने-आप पूरा होने वाला विजेट

जगहों की जानकारी देने वाली यूआई किट, विज़ुअल कस्टमाइज़ेशन के लिए डिज़ाइन सिस्टम का इस्तेमाल करती है. यह मटीरियल डिज़ाइन पर आधारित है. हालांकि, इसमें 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)

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

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>

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

• जगह के बारे में ज़्यादा जानकारी देने वाले कॉम्पोनेंट की स्टाइलिंग का उदाहरण.
• Place Search कॉम्पोनेंट की स्टाइलिंग का उदाहरण.
• जगह के नाम के शुरुआती अक्षर लिखने पर पूरा नाम सुझाने की सुविधा वाले कॉम्पोनेंट की स्टाइलिंग का सामान्य उदाहरण.