Lina Cortés Asked: 2020-09-28 11:26:09 +0800 CST 2020-09-28 11:26:09 +0800 CST 2020-09-28 11:26:09 +0800 CST Custom InfoWindow marker with data in Android 772 I am making an android application that has a map in which clicking on a marker shows the infowindow as follows: But I need the infowindow to appear in the following way and I don't know how to do it: How can I do it? Some example? Thank you android-studio 1 Answers Voted Best Answer Jorgesys 2020-09-28T13:14:56+08:002020-09-28T13:14:56+08:00 You can review the official documentation To do this you must create a layout with what you want to appear in your infoWindow, as an example infowindow_layout.xml: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dp" > <ImageView android:id="@+id/info_window_imagen" android:layout_width="80dp" android:layout_height="80dp" android:scaleType="centerCrop" android:src="@drawable/imagen_default" /> <TextView android:id="@+id/info_window_nombre" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_toRightOf="@id/info_window_imagen" android:paddingLeft="5dp" android:text="Carlo Estrada Solano" /> <TextView android:id="@+id/info_window_placas" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textStyle="bold" android:textSize="20sp" android:layout_below="@id/info_window_nombre" android:layout_toRightOf="@id/info_window_imagen" android:paddingLeft="5dp" android:text="Placas: SX5487" /> <TextView android:id="@+id/info_window_estado" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/info_window_placas" android:layout_toRightOf="@id/info_window_imagen" android:paddingLeft="5dp" android:text="Estado: Activo" /> </RelativeLayout> you would have something similar to: You create a class that extends InfoWindowAdapterwhich will load the previous layout: public class CustomInfoWindowAdapter implements InfoWindowAdapter{ private static final String TAG = "CustomInfoWindowAdapter"; private LayoutInflater inflater; public CustomInfoWindowAdapter(LayoutInflater inflater){ this.inflater = inflater; } @Override public View getInfoContents(final Marker m) { //Carga layout personalizado. View v = inflater.inflate(R.layout.infowindow_layout, null); String[] info = m.getTitle().split("&"); String url = m.getSnippet(); ((TextView)v.findViewById(R.id.info_window_nombre)).setText("Lina Cortés"); ((TextView)v.findViewById(R.id.info_window_placas)).setText("Placas: SRX32"); ((TextView)v.findViewById(R.id.info_window_estado)).setText("Estado: Activo"); return v; } @Override public View getInfoWindow(Marker m) { return null; } } Finally, to load the custom infoWindow, setInfoWindowAdapter()assign the custom one to your GoogleMap instance through the method InfoWindowAdapter. myGoogleMap.setInfoWindowAdapter(new CustomInfoWindowAdapter(LayoutInflater.from(getActivity()))); With this you will get what you want which is to show a custom infoWindow when clicking on the map marker.
You can review the official documentation
To do this you must create a layout with what you want to appear in your infoWindow, as an example
infowindow_layout.xml
:you would have something similar to:
You create a class that extends
InfoWindowAdapter
which will load the previous layout:Finally, to load the custom infoWindow,
setInfoWindowAdapter()
assign the custom one to your GoogleMap instance through the methodInfoWindowAdapter
.With this you will get what you want which is to show a custom infoWindow when clicking on the map marker.