Android Google Maps v2: How to add marker with multiline snippet?
AndroidGoogle MapsAndroid Problem Overview
Does anybody know how to add multiline snippet to Google Maps marker? That's my code for adding markers:
map.getMap().addMarker(new MarkerOptions()
.position(latLng()).snippet(snippetText)
.title(header).icon(icon));
I want snippet to look like this:
| HEADER |
|foo |
|bar |
but when I'm trying to set snippetText to "foo \n bar", I see just foo bar
and I don't have any ideas how to make it multiline. Can you help me?
Android Solutions
Solution 1 - Android
I have done with easiest way like below:
private GoogleMap mMap;
While adding marker on Google Map:
LatLng mLatLng = new LatLng(YourLatitude, YourLongitude);
mMap.addMarker(new MarkerOptions().position(mLatLng).title("My Title").snippet("My Snippet"+"\n"+"1st Line Text"+"\n"+"2nd Line Text"+"\n"+"3rd Line Text").icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_RED)));
After that put below code for InfoWindow adapter on Google Map:
mMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {
@Override
public View getInfoWindow(Marker arg0) {
return null;
}
@Override
public View getInfoContents(Marker marker) {
LinearLayout info = new LinearLayout(mContext);
info.setOrientation(LinearLayout.VERTICAL);
TextView title = new TextView(mContext);
title.setTextColor(Color.BLACK);
title.setGravity(Gravity.CENTER);
title.setTypeface(null, Typeface.BOLD);
title.setText(marker.getTitle());
TextView snippet = new TextView(mContext);
snippet.setTextColor(Color.GRAY);
snippet.setText(marker.getSnippet());
info.addView(title);
info.addView(snippet);
return info;
}
});
Hope it will help you.
Solution 2 - Android
It looks like you will need to create your own "info window" contents to make that work:
-
Create an implementation of
InfoWindowAdapter
that overridesgetInfoContents()
to return what you want to go into theInfoWindow
frame -
Call
setInfoWindowAdapter()
on yourGoogleMap
, passing an instance of yourInfoWindowAdapter
This sample project demonstrates the technique. Replacing my snippets with "foo\nbar"
correctly processes the newline. However, more likely, you will just come up with a layout that avoids the need for the newline, with separate TextView
widgets for each line in your desired visual results.
Solution 3 - Android
Building on Hiren Patel's answer as Andrew S suggested:
mMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {
@Override
public View getInfoWindow(Marker arg0) {
return null;
}
@Override
public View getInfoContents(Marker marker) {
Context context = getApplicationContext(); //or getActivity(), YourActivity.this, etc.
LinearLayout info = new LinearLayout(context);
info.setOrientation(LinearLayout.VERTICAL);
TextView title = new TextView(context);
title.setTextColor(Color.BLACK);
title.setGravity(Gravity.CENTER);
title.setTypeface(null, Typeface.BOLD);
title.setText(marker.getTitle());
TextView snippet = new TextView(context);
snippet.setTextColor(Color.GRAY);
snippet.setText(marker.getSnippet());
info.addView(title);
info.addView(snippet);
return info;
}
});
Solution 4 - Android
Based on Hiren Patel solution. This code creates a TextView
from layout, not from zero. One significant difference: if you have clusters, you won't see a void label when clicking at a cluster.
override fun onMapReady(googleMap: GoogleMap) {
this.googleMap = googleMap
...
// Use this anonymous class or implement GoogleMap.InfoWindowAdapter.
googleMap.setInfoWindowAdapter(object : GoogleMap.InfoWindowAdapter {
override fun getInfoContents(marker: Marker): View? {
return null
}
override fun getInfoWindow(marker: Marker): View? =
if (marker.title == null)
null
else {
val inflater = LayoutInflater.from(context)
val view = inflater.inflate(R.layout.layout_marker, null, false)
view.label.text = marker.title
view
}
})
layout_marker.xml:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:textColor="$f0f0f0"
android:textSize="12sp"
tools:text="Marker"
android:background="#00aaee"
/>
Solution 5 - Android
Same code, but in Kotlin:
mMap?.setInfoWindowAdapter(object : InfoWindowAdapter {
override fun getInfoWindow(arg0: Marker): View? {
return null
}
override fun getInfoContents(marker: Marker): View {
val info = LinearLayout(applicationContext)
info.orientation = LinearLayout.VERTICAL
val title = TextView(applicationContext)
title.setTextColor(Color.BLACK)
title.gravity = Gravity.CENTER
title.setTypeface(null, Typeface.BOLD)
title.text = marker.title
val snippet = TextView(applicationContext)
snippet.setTextColor(Color.GRAY)
snippet.text = marker.snippet
info.addView(title)
info.addView(snippet)
return info
}
})
Solution 6 - Android
mMap.setOnMapClickListener(new GoogleMap.OnMapClickListener() {
@Override
public void onMapClick(LatLng point) {
// Already two locations
if (markerPoints.size() > 1) {
markerPoints.clear();
mMap.clear();
}
// Adding new item to the ArrayList
markerPoints.add(point);
// Creating MarkerOptions
MarkerOptions options = new MarkerOptions();
// Setting the position of the marker
options.position(point);
if (markerPoints.size() == 1) {
options.icon(BitmapDescriptorFactory.fromResource(R.mipmap.markerss)).title("Qtrip").snippet("Balance:\nEta:\nName:");
options.getInfoWindowAnchorV();
} else if (markerPoints.size() == 2) {
options.icon(BitmapDescriptorFactory.fromResource(R.mipmap.markerss)).title("Qtrip").snippet("End");
}
mMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {
@Override
public View getInfoWindow(Marker arg0) {
return null;
}
@Override
public View getInfoContents(Marker marker) {
Context context = getApplicationContext(); //or getActivity(), YourActivity.this, etc.
LinearLayout info = new LinearLayout(context);
info.setOrientation(LinearLayout.VERTICAL);
TextView title = new TextView(context);
title.setTextColor(Color.BLACK);
title.setGravity(Gravity.CENTER);
title.setTypeface(null, Typeface.BOLD);
title.setText(marker.getTitle());
TextView snippet = new TextView(context);
snippet.setTextColor(Color.GRAY);
snippet.setText(marker.getSnippet());
info.addView(title);
info.addView(snippet);
return info;
}
});
mMap.addMarker(options);