Google Map view inside a bottom sheet

android, bottom-sheet, google-maps

Solution

When we use the map on `BottomSheet`, it conflicts touch events. So, need to disallow touch of `BottomSheet`.

Please find a below custom class which allows the map to move.

public class BottomSheetMapView extends MapView {

public BottomSheetMapView(Context context) {
    super(context);
}

public BottomSheetMapView(Context context, AttributeSet attrs) {
    super(context, attrs);
}

public BottomSheetMapView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
}

public BottomSheetMapView(Context context, MapboxMapOptions options) {
    super(context, options);
}
@Override
public boolean onInterceptTouchEvent(final MotionEvent event) {
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            getParent().requestDisallowInterceptTouchEvent(true);
            break;
        case MotionEvent.ACTION_UP:
            getParent().requestDisallowInterceptTouchEvent(false);
            break;
        default:
            break;
    }

    return super.onInterceptTouchEvent(event);
}

}

I am using Mapbox. So, I use `com.example.BottomSheetMapView` instead of `com.mapbox.mapboxsdk.maps.MapView` in xml. Similarly, you can use Google map.

This satisfies your requirement.

Problem

I want to make a view like Sample image in which a want to show google maps inside a bottom sheet fragment. What I've tried I've tried to show maps inside a bottom sheet dialog fragment but the output isn't what I desire. What I require is a fixed size view which should be able to display maps. Currently my view is also responding to user gestures to change bottom sheet state but I require gestures to work on map only (e.g for map panning).

Original source