প্ল্যাটফর্ম নির্বাচন করুন: অ্যান্ড্রয়েড আইওএস জাভাস্ক্রিপ্ট

স্থান অনুসন্ধান উপাদান

Places UI Kit-এর Place Search কম্পোনেন্টটি একটি তালিকার মধ্যে স্থান অনুসন্ধানের ফলাফল রেন্ডার করে।

স্থান UI কিট স্থান অনুসন্ধান উপাদান

আপনি স্থান অনুসন্ধান তালিকাটি কাস্টমাইজ করতে পারেন। আপনি নির্দিষ্ট করতে পারেন:

  • প্রদর্শনের জন্য সামগ্রী
  • উল্লম্ব অভিযোজনে মিডিয়ার আকার
  • টেক্সট কেটে ফেলা
  • ওরিয়েন্টেশন
  • আপনার ব্র্যান্ড এবং অ্যাপের ডিজাইন ভাষার সাথে মেলে এমন থিম ওভাররাইড
  • অ্যাট্রিবিউশনের অবস্থান
  • কোন স্থান নির্বাচনযোগ্য কিনা

আপনি SearchByTextRequest অথবা SearchNearbyRequest সম্পাদনের জন্য অনুরোধটি কাস্টমাইজ করতে পারেন।

বিলিং

প্রতিবার configureFromSearchByTextRequest() অথবা configureFromSearchNearbyRequest() বাইন্ডিং মান পরিবর্তন করলে আপনাকে বিল করা হবে।

আপনার অ্যাপে স্থান অনুসন্ধান যোগ করুন

আপনার লেআউটে PlaceSearchFragment ফ্র্যাগমেন্ট যোগ করে Place Search উইজেট ব্যবহার করুন।

যখন আপনি চান যে আপনার অ্যাপটি কোনও টেক্সট সার্চ বা কাছাকাছি সার্চ রেজাল্ট লোড করুক, তখন অনুরোধটি সহ configureFromSearchByTextRequest() অথবা configureFromSearchNearbyRequest() কল করুন।

কোটলিন

fragment.configureFromSearchByTextRequest(searchByTextRequest)

// or fragment.configureFromSearchNearbyRequest(searchNearbyRequest) for nearby search

জাভা

fragment.configureFromSearchByTextRequest(searchByTextRequest)

// or fragment.configureFromSearchNearbyRequest(searchNearbyRequest) for nearby search
    

কম্পোনেন্ট লোড হলে, স্থান নির্বাচন করা হলে (যদি নির্বাচনযোগ্য হিসেবে সেট করা হয়) অথবা কম্পোনেন্ট লোড করার সময় কোনও ত্রুটি দেখা দিলে কলব্যাক গ্রহণ করার জন্য আপনি কম্পোনেন্টে একটি ঐচ্ছিক PlaceSearchFragmentListener যোগ করতে পারেন।

কোটলিন

fragment.registerListener(
  object : PlaceSearchFragmentListener {
    override fun onLoad(places: List<Place>) {...}
    override fun onRequestError(e: Exception) {...}
    override fun onPlaceSelected(place: Place) {...}
  }
)
  

জাভা

fragment.registerListener(
  new PlaceSearchFragmentListener() {
    @Override public void onLoad(List<? extends Place> places) {...}
    @Override public void onRequestError(Exception e) {...}
    @Override public void onPlaceSelected(Place place) {...}
  }
)
    

স্থান অনুসন্ধান উপাদানটি কাস্টমাইজ করুন

কন্টেন্ট কাস্টমাইজ করুন

আপনার কম্পোনেন্ট কোন কন্টেন্ট প্রদর্শন করবে তা আপনাকে অবশ্যই উল্লেখ করতে হবে।

এই উদাহরণটি স্থানের ঠিকানা এবং রেটিং প্রদর্শনের জন্য উপাদানটিকে কনফিগার করে।

কোটলিন

val fragment = PlaceSearchFragment.newInstance(listOf(Content.ADDRESS, Content.RATING))
    

জাভা

PlaceSearchFragment fragment = PlaceSearchFragment.newInstance(listOf(Content.ADDRESS,Content.RATING));
    

আপনার স্থান অনুসন্ধান উপাদানে প্রদর্শিত সামগ্রীর নিম্নলিখিত দিকগুলি আপনি ঐচ্ছিকভাবে কাস্টমাইজ করতে পারেন:

  • PlaceSearchFragment.Content : কম্পোনেন্টে দেখানো কন্টেন্ট।
  • mediaSize : খণ্ডটির উল্লম্ব অবস্থানে ছবির আকার। ডিফল্ট হল SMALL
  • preferTruncation : প্রতিটি স্থানের বিবরণ দৃশ্যের টেক্সট কেটে ফেলা হবে কিনা।
  • অ্যাট্রিবিউশনপজিশন : কম্পোনেন্টের উপরে নাকি নীচে গুগল ম্যাপস অ্যাট্রিবিউশন দেখাবেন কিনা।
  • নির্বাচনযোগ্য : তালিকার প্রতিটি স্থান নির্বাচনযোগ্য কিনা।

আপনার কাস্টমাইজেশন কনফিগারেশন PlaceSearchFragment এ যোগ করুন।

কোটলিন

fragment.preferTruncation = false
fragment.attributionPosition = AttributionPosition.BOTTOM
fragment.mediaSize = MediaSize.SMALL
fragment.selectable = true
    

জাভা

fragment.setPreferTruncation(false)
fragment.setAttributionPosition(AttributionPosition.BOTTOM)
fragment.setMediaSize(MediaSize.SMALL)
fragment.setSelectable(true)
    

ওরিয়েন্টেশন কাস্টমাইজ করুন

ডিফল্ট ওরিয়েন্টেশনটি উল্লম্ব। অনুভূমিক ওরিয়েন্টেশনের জন্য, PlaceSearchFragment.newInstance()Orientation.HORIZONTAL উল্লেখ করুন।

কোটলিন

PlaceSearchFragment.newInstance(
    PlaceSearchFragment.ALL_CONTENT,
    Orientation.HORIZONTAL
)
    

জাভা

PlaceSearchFragment.newInstance(
    PlaceSearchFragment.ALL_CONTENT,
    Orientation.HORIZONTAL
)
      

থিমটি কাস্টমাইজ করুন

একটি টুকরো তৈরি করার সময়, আপনি এমন একটি থিম নির্দিষ্ট করতে পারেন যা ডিফল্ট স্টাইল অ্যাট্রিবিউটগুলিকে ওভাররাইড করে। আপনি আপনার Place Details কম্পোনেন্টের রঙ, টাইপোগ্রাফি, স্পেসিং, বর্ডার এবং কোণগুলি কাস্টমাইজ করতে পারেন। ডিফল্ট হল PlacesMaterialTheme

যেকোনো থিমের বৈশিষ্ট্য যা ওভাররাইড করা হয় না সেগুলি ডিফল্ট স্টাইল ব্যবহার করে।

Places UI Kit ডিফল্টরূপে একটি অন্ধকার থিম প্রদান করে, তাই আপনাকে অন্ধকার এবং হালকা উভয় থিমই কাস্টমাইজ করতে হতে পারে। অন্ধকার থিম কাস্টমাইজ করতে, values-night/colors.xml এ রঙের জন্য একটি এন্ট্রি যোগ করুন।

থিমিং সম্পর্কে আরও তথ্যের জন্য কাস্টম স্টাইলিং বিভাগটি দেখুন।

উদাহরণ

স্থান অনুসন্ধান উপাদানটি চালু করুন

কোটলিন

val fragment: PlaceSearchFragment =
PlaceSearchFragment.newInstance(PlaceSearchFragment.STANDARD_CONTENT)

fragment.preferTruncation = false
fragment.attributionPosition = AttributionPosition.BOTTOM
fragment.mediaSize = MediaSize.SMALL
fragment.selectable = true

fragment.registerListener(
  object : PlaceSearchFragmentListener {
    override fun onLoad(places: List<Place>) {...}
    override fun onRequestError(e: Exception) {...}
    override fun onPlaceSelected(place: Place) {...}
  }
)

supportFragmentManager
  .beginTransaction()
  .replace(R.id.fragment_container, fragment)
  .commitNow()

fragment.configureFromSearchByTextRequest(searchByTextRequest)
    

জাভা

PlaceSearchFragment fragment = PlaceSearchFragment.newInstance(PlaceSearchFragment.STANDARD_CONTENT);

fragment.setPreferTruncation(false)
fragment.setAttributionPosition(AttributionPosition.BOTTOM)
fragment.setMediaSize(MediaSize.SMALL)
fragment.setSelectable(true)

fragment.registerListener(
  new PlaceSearchFragmentListener() {
      @Override public void onLoad(List<? extends Place> places) {...}
      @Override public void onRequestError(Exception e) {...}
      @Override public void onPlaceSelected(Place place) {...}
  }
)

getSupportFragmentManager()
  .beginTransaction()
  .replace(R.id.fragment_container, fragment)
  .commitNow();

fragment.configureFromSearchByTextRequest(searchByTextRequest)
    

থিমটি কাস্টমাইজ করুন

Places UI Kit ডিফল্টরূপে একটি অন্ধকার থিম প্রদান করে, তাই আপনাকে অন্ধকার এবং হালকা উভয় থিমই কাস্টমাইজ করতে হতে পারে। অন্ধকার থিম কাস্টমাইজ করতে, values-night/colors.xml এ রঙের জন্য একটি এন্ট্রি যোগ করুন।

 <style name="CustomizedTheme" 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>