CODEWITHSUNDEEP
androidgoogle-maps-android-api-2
erdomester
erdomester

Reputation: 11829

Custom infowindow with google maps api v2

I can customize the content of the infoWindow with a simple block of code:

 private GoogleMap mMap;
 mMap.setInfoWindowAdapter(new InfoWindowAdapter() {

        @Override
        public View getInfoWindow(Marker arg0) {
            return null;
        }

        @Override
        public View getInfoContents(Marker arg0) {

            View v = getLayoutInflater().inflate(R.layout.custom_infowindow, null);
            return v;

        }
    });

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#55000000" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:text="HELLO"
        android:textColor="#FF0000"/>

</LinearLayout>

But this changes only the content and not the infoWindow itself. It still stays white with a small shadow on the bottom and now a red HELLO text is visible with black bg. I want to change this default infoWindow to a transparent black rectangle. How can I do this?

enter image description here

Upvotes: 9

Views: 17423

Answers (4)

Melbourne Lopes
Melbourne Lopes

Reputation: 4855

You need to setInfoWindowAdapter() right after map.addMarker() method for this to take effect. Do not call setInfoWindowAdapter() in onMarkerClick().

Upvotes: 1

Ankit Sharma
Ankit Sharma

Reputation: 1251

you have to write your code in getInfoWindow method. so you can customize info window. e.g.

@Override
public View getInfoWindow(Marker marker) {

    // Getting view from the layout file
    View v = inflater.inflate(R.layout.map_popup, null);

    TextView title = (TextView) v.findViewById(R.id.title);
    title.setText(marker.getTitle());

    TextView address = (TextView) v.findViewById(R.id.distance);
    address.setText(marker.getSnippet());

    return v;
}

@Override
public View getInfoContents(Marker arg0) {
    // TODO Auto-generated method stub
    return null;
}

Upvotes: 35

Dhaval Parmar
Dhaval Parmar

Reputation: 18978

enter image description here

use this way...

myMap.setInfoWindowAdapter(new InfoWindowAdapter() {

                @Override
                public View getInfoWindow(Marker arg0) {

                    ContextThemeWrapper cw = new ContextThemeWrapper(
                            getApplicationContext(), R.style.Transparent);
                    // AlertDialog.Builder b = new AlertDialog.Builder(cw);
                    LayoutInflater inflater = (LayoutInflater) cw
                            .getSystemService(LAYOUT_INFLATER_SERVICE);
                    View layout = inflater.inflate(R.layout.custom_infowindow,
                            null);
                    return layout;
                }

                @Override
                public View getInfoContents(Marker arg0) {

                    return null;

                }
            });

R.style.Transparent add this in your style.xml

<style name="Transparent" parent="android:Theme.Light">
        <item name="android:windowIsTranslucent">true</item>
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:backgroundDimEnabled">false</item>
    </style>

    <color name="transparent">#00000000</color>

Edited:

custom_infowindow.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#FF0000"
        android:text="HELLO" />

</LinearLayout>

Upvotes: 10

TheFlash
TheFlash

Reputation: 6027

Try this...I have change little bit of your code.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 >

   <LinearLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="#80000000" 
    >

    <TextView
     android:layout_width="wrap_content"
     android:layout_height="wrap_content" 
     android:text="HELLO"
     android:textColor="#FF0000"
     android:padding="10dp"/>

   </LinearLayout> 

</LinearLayout>

Also change this...

 mMap.setInfoWindowAdapter(new InfoWindowAdapter() {

        public View getInfoWindow(Marker arg0) {
            View v = getLayoutInflater().inflate(R.layout.custom_infowindow, null);
            return v;
        }

        public View getInfoContents(Marker arg0) {

            //View v = getLayoutInflater().inflate(R.layout.custom_infowindow, null);

            return null;

        }
    });

I hope it will work...:)

Upvotes: 1

Related Questions