Android GoogleMap v2 getting cropped or not fully displayed

Question

I am observing unexpected behavior of Google Map. Problem is Map getting crop from top and bottom area using Support Map Fragment, if I am using full screen, map is completely visible as shown in Picture 1, but if I am applying map fragment height or weight property, map is not completely visible as shown in Picture 2.

layout xml for picture 1:

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.paki.venturedive.awtest.MapsActivity" />

layout xml for picture 2:

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

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/map"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="0.6"
    tools:context="com.paki.venturedive.awtest.MapsActivity" />

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:text="Hello world"
    android:layout_weight="0.4" />

Java code :

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_maps);
    // Obtain the SupportMapFragment and get notified when the map is ready to be used.
    SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
            .findFragmentById(R.id.map);
    mapFragment.getMapAsync(this);
}

In Picture 2, I am(User will be) unable to see arctic ocean above Greenland area, similarly bottom area region will be missing, as shown in Picture 3.

Did anyone face this issue or does anyone know how to cope up it with?

Any reference link or hint will be kindly appreciated.

, .

Gibson

post your xml . code where you have set the height and width . – Gaius

@SagarNayak question edited. – Gibson

as you are giving its weight to 0.6 then the linear layout will give only 60% space to map fragment . tell me why are you giving weight . and what exactly you want ? – Gaius

I am giving weight as app requirement is to show map on 60 % area. though map is scroll-able and its scrolling so it should show complete map as we can see on maps.google.com – Gibson

i dont get it. you want the map to be displayed on screen on 60% area. you are getting it. then what? – Gaius

ok so you should zoom button for that i suppose. – Gaius

Try making layout_height to be 0dp in both the fragment and textview as you are already using layout_weight. – Wiggly

to see the same area in smaller map as in larger map you have to use a zoom button . – Gaius

@Mrigank, applied 0dp height to both child views of linear layout. still same area region missing as shown in Picture 3 – Gibson

Answer 1

Use this snippet. I got what you were saying, by taking the map fragment inside Linear/Relative layout, the map gets cut from top and bottom and some portions are not visible. Since you want map to take 60% of the screen one possible solution is, take the map fragment inside FrameLayout with height as match_parent.

Now, take the textview inside LinearLayout with parent as FrameLayout and set its gravity to be bottom and set its height dynamically 40% of the screen(or how much your requirement is) by using the DisplayMetrics class. By this way, we are ensuring that the full screen is provided to the map so that no portion gets cut, and displaying the text also above the map. I'm attaching the updated screenshot also.

<?xml version="1.0" encoding="utf-8"?>


<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/map_framecontainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <fragment
        android:id="@+id/fragment_map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"

        android:layout_height="match_parent" />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:id="@+id/tv_main">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/fragment_map"
        android:layout_gravity="center"
        android:background="#ffffff"
        android:text="Hello world" />

    </LinearLayout>
</FrameLayout>

The java code in your onCreate for DisplayMetrics:

   DisplayMetrics metrics = new DisplayMetrics();
            getWindowManager().getDefaultDisplay().getMetrics(metrics);

            mylinearlayout.setMinimumHeight((int)(metrics.heightPixels * 0.4));

I think this will help.

Wiggly

have you seen the picture 3, the above area is not showing with scrolling/dragging the map. – Gibson

Bro I tried it and its working with dragging the map. I'll attach the snapshot as happening in my device. See the above snippet. Or use googleMap.getUiSettings().setScrollGesturesEnabled(true); in your OnMapReady() function if you can't scroll. – Wiggly

Scrolling is worknig, I can scroll, can you capture another screen shot, which shows the region, like I have posted in Picture 1 and picture 3. scrolling to the top, and let me see it – Gibson

Ya man, top and bottom in my screenshot were cut too. Got your point, check the updated solution, you can do like this. – Wiggly

seems, after adding your code, I will have 40% bottom map area on background of linearlayout.. am I right ? – Gibson

yes, but the whole map will be scrollable, no cutting at bottom. If it solves your issue, can you please mark the answer correct? :P – Wiggly

Let us continue this discussion in chat. – Wiggly

@AbdulWahab do you found any solution? – Besiege