Davide3i Davide3i - 4 months ago 57
Android Question

Place Autocomplete in MapFragment: invisible on old APIs

After quite a lot of struggle, I managed to put a Place Autocomplete inside of my MapFragment. Still, there's a problem.

On my Android emulator (API 24), it's visible and I can use it:

EMULATOR

On my smartphone (API 19) I can't see it, apart for a little instant just before the map loads.

SMARTPHONE

My map_layout.xml is like this:

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

<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_gravity="top"
android:layout_margin="5dp"
android:layout_width="match_parent"
android:layout_height="40dp"
card_view:cardCornerRadius="4dp">
</android.support.v7.widget.CardView>

</RelativeLayout>


The code inside of the MapFragment.java is this one:

@Override
public void onViewCreated(View view, Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);

// Initialise a new fragment inside of this one.
mFragmentManager = getChildFragmentManager();
mSupportMapFragment = (SupportMapFragment) mFragmentManager.findFragmentByTag("mapFragment");
mSupportPlaceAutocompleteFragment = (SupportPlaceAutocompleteFragment) mFragmentManager.findFragmentByTag("autocompleteFragment");

// Never inflate fragments inside other fragments in a layout.xml!
// Do it programmatically.
// See here for reference: http://stackoverflow.com/a/19815266/4938112.
if (mSupportMapFragment == null) {
mSupportMapFragment = new SupportMapFragment();
mFragmentTransaction = mFragmentManager.beginTransaction();
mFragmentTransaction.add(R.id.map_fragment_container, mSupportMapFragment, "mapFragment");
mFragmentTransaction.commit();
mFragmentManager.executePendingTransactions();
}

// Asynchronous thread to load map.
mSupportMapFragment.getMapAsync(this);

if (mSupportPlaceAutocompleteFragment == null) {
mSupportPlaceAutocompleteFragment = new SupportPlaceAutocompleteFragment();
mFragmentTransaction = mFragmentManager.beginTransaction();
mFragmentTransaction.add(R.id.card_view, mSupportPlaceAutocompleteFragment, "autocompleteFragment");
mFragmentTransaction.commit();
mFragmentManager.executePendingTransactions();
}

}


I've found out that if I just append the Place Autocomplete directly to the map_fragment_container, I'll be able to see it even on my smartphone, but it would have an invisible background.

Any hints?

Answer

Just put both components inside a parent FrameLayout:

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/map_fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <android.support.v7.widget.CardView
        android:id="@+id/card_view"
        android:layout_gravity="top"
        android:layout_margin="@dimen/margin_1"
        android:layout_width="match_parent"
        android:layout_height="@dimen/card_view_height"
        card_view:cardCornerRadius="@dimen/card_corner_radius"/>

</FrameLayout>
Comments