Popup or layout over marker Android

Question

I want to put a custom layout over a marker. So far I got this:

default_marker_info_window.xml

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

    <ViewFlipper
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/markerInfoContainer"
        android:background="@android:color/holo_red_dark"
        android:maxWidth="250dp">
    </ViewFlipper>    

    <ImageView
        android:layout_width="20dp"
        android:layout_height="15dp"
        android:background="@drawable/ic_down_arrow"
        android:layout_gravity="center|top"/>

</LinearLayout>

default_marker_info_layout.xml

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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:id="@+id/tvTitulo"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textStyle="bold"
            android:gravity="center"/>

        <TextView
            android:id="@+id/tvCuerpo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="press me 1"
            android:id="@+id/button"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="press me 2"
            android:id="@+id/button2"/>

    </LinearLayout>

</LinearLayout>

MapActivity.java

public class MapActivity extends Activity implements GoogleMap.OnMapLongClickListener{

    protected GoogleMap mMap;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        ...
        setUpMapIfNeeded();
        mMap.setOnMarkerClickListener(new GoogleMap.OnMarkerClickListener() {
            @Override
            public boolean onMarkerClick(Marker marker) {

                View mainView = getLayoutInflater().inflate(R.layout.default_marker_info_window, null);
                ViewFlipper markerInfoContainer = (ViewFlipper)mainView.findViewById(R.id.markerInfoContainer);
                View viewContainer = getLayoutInflater().inflate(R.layout.default_marker_info_layout, null);
                TextView tvTitulo = (TextView) viewContainer.findViewById(R.id.tvTitulo);
                TextView tvCuerpo = (TextView) viewContainer.findViewById(R.id.tvCuerpo);
                tvTitulo.setText(marker.getTitle());
                tvCuerpo.setVisibility(View.GONE);

                markerInfoContainer.addView(viewContainer);

                PopupWindow popupWindow = new PopupWindow(mainView, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
                popupWindow.showAtLocation(findViewById(R.id.map), Gravity.CENTER_HORIZONTAL, 0, 0); //map is the fragment on the activity layout where I put the map   

                return true;
            }
        });
        ...
    }
...
}

But I have a couple of problems.

Problem 1: the popup shows over (3D) the marker (hidding it). I want to position it above it (2D), like this:

May be by help of x and y position of the marker and using them on popupWindow.showAtLocation. But if you have other solutions, I will listen to them.

Problem 2: When I slide over the map, the layout keep on center of the screen, but I want to keep it over the marker.

Note: I can't use mMap.setInfoWindowAdapter because I will lose the button's click listeners.

Answer 1

Define some variables to save last used marker and popupView

private Marker mMarker;
private PopupWindow mPopupWindow;
private int mWidth;
private int mHeight;

In our onMarkerClick:

@Override
public boolean onMarkerClick(Marker marker) {
    if (mPopupWindow != null) {
        mPopupWindow.dismiss();
    }
    View popupView;// inflate our view here
    PopupWindow popupWindow = new PopupWindow(popupView, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);

    Display display = getActivity().getWindowManager().getDefaultDisplay();
    Point size = new Point();
    display.getSize(size);
    popupView.measure(size.x, size.y);

    mWidth = popupView.getMeasuredWidth();
    mHeight = mPopupView.getMeasuredHeight();
    mMarker = marker;
    mPopupWindow = popupWindow;

    updatePopup();

    return true;
}

updatePopup method:

private void updatePopup() {
    if (mMarker != null && mPopupWindow != null) {
        // marker is visible
        if (mMap.getProjection().getVisibleRegion().latLngBounds.contains(mMarker.getPosition())) {
            if (!mPopupWindow.isShowing()) {
                mPopupWindow.showAtLocation(getView(), Gravity.NO_GRAVITY, 0, 0);
            }
            Point p = mMap.getProjection().toScreenLocation(mMarker.getPosition());
            mPopupWindow.update(p.x - mPopupWidth / 2, p.y - mPopupHeight + 100, -1, -1);
        } else { // marker outside screen
            mPopupWindow.dismiss();
        }
    }
}

We need CameraChangeListener:

mMap.setOnCameraChangeListener(this);

@Override
public void onCameraChange(CameraPosition cameraPosition) {
    ...
    updatePopup();
}