Sélectionnez une plate-forme : Android iOS JavaScript

Composant Place Search

Le composant Place Search du kit d'interface utilisateur Places affiche les résultats d'une recherche de lieu dans une liste.

Composant Place Search du Kit UI pour Places

Vous pouvez personnaliser la liste Place Search. Vous pouvez spécifier ce qui suit :

  • Le contenu à afficher
  • La taille du média en orientation verticale
  • La troncation du texte
  • L'orientation
  • Les remplacements de thème qui correspondent à votre marque et au langage de conception de votre application
  • La position de l'attribution
  • Si un lieu est sélectionnable

Vous pouvez également personnaliser la requête pour effectuer une SearchByTextRequest ou une SearchNearbyRequest.

Facturation

Vous êtes facturé chaque fois que la valeur de liaison configureFromSearchByTextRequest() ou configureFromSearchNearbyRequest() est modifiée.

Ajouter Place Search à votre application

Utilisez le widget Place Search en ajoutant le PlaceSearchFragment fragment à votre mise en page.

Lorsque vous souhaitez que votre application charge un résultat de recherche textuelle ou de recherche à proximité, appelez configureFromSearchByTextRequest() ou configureFromSearchNearbyRequest() avec la requête.

Kotlin

fragment.configureFromSearchByTextRequest(searchByTextRequest)

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

Java

fragment.configureFromSearchByTextRequest(searchByTextRequest)

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

Vous pouvez également ajouter un PlaceSearchFragmentListener facultatif au composant pour recevoir des rappels lorsque le composant se charge, qu'un lieu est sélectionné (s'il est défini comme sélectionnable) ou qu'une erreur se produit lors du chargement du composant.

Kotlin

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

Java

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

Personnaliser le composant Place Search

Personnaliser le contenu

Vous devez spécifier le contenu que votre composant affichera.

Cet exemple configure le composant pour afficher l'adresse et la note du lieu.

Kotlin

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

Java

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

Vous pouvez également personnaliser les aspects suivants du contenu qui s'affiche dans votre composant Place Search :

  • PlaceSearchFragment.Content : contenu affiché dans le composant.
  • mediaSize : taille de la photo dans l'orientation verticale du fragment. La valeur par défaut est SMALL.
  • preferTruncation : indique s'il faut tronquer le texte de chaque vue Place Details.
  • attributionPosition : indique s'il faut afficher l'attribution Google Maps en haut ou en bas du composant.
  • selectable : indique si chaque lieu de la liste est sélectionnable.

Ajoutez votre configuration de personnalisation à PlaceSearchFragment.

Kotlin

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

Java

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

Personnaliser l'orientation

L'orientation par défaut est verticale. Pour une orientation horizontale, spécifiez Orientation.HORIZONTAL dans PlaceSearchFragment.newInstance().

Kotlin

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

Java

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

Personnaliser le thème

Lorsque vous instanciez un fragment, vous pouvez spécifier un thème qui remplace l'un des attributs de style par défaut. Vous pouvez personnaliser les couleurs, la typographie, l'espacement, les bordures et les angles de votre composant Place Details. La valeur par défaut est PlacesMaterialTheme.

Tous les attributs de thème qui ne sont pas remplacés utilisent les styles par défaut.

Le kit d'interface utilisateur Places fournit un thème sombre par défaut. Vous devrez peut-être personnaliser les thèmes sombre et clair. Pour personnaliser le thème sombre, ajoutez une entrée pour la couleur dans values-night/colors.xml.

Pour en savoir plus sur les thèmes, consultez la section Style personnalisé.

Exemples

Instancier le composant Place Search

Kotlin

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)
    

Java

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)
    

Personnaliser le thème

Le kit d'interface utilisateur Places fournit un thème sombre par défaut. Vous devrez peut-être personnaliser les thèmes sombre et clair. Pour personnaliser le thème sombre, ajoutez une entrée pour la couleur dans 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>