'Add toolbar and drawer menu to Android Google Maps Activity

I have created a standard Google Maps Activity in my app in Android Studio and the map works as expected.

My Activity is called 'NativeMap' and then the activity starts I see a ToolBar/AppBar at the top of the activity with the text "NativeMap".

The layout file for the activity is standard and calls a maps fragment:

<?xml version="1.0" encoding="utf-8"?>
<androidx.fragment.app.FragmentContainerView
    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=".NativeMap">

</androidx.fragment.app.FragmentContainerView>

As such, there is no toolbar defined in the XML for me to reference or customize...

The onCreate for this activity seems very simple as well, so again I can only assume that there is a lot of stuff included in the background.

// public class NativeMap extends FragmentActivity implements OnMapReadyCallback {
public class NativeMap extends AppCompatActivity implements OnMapReadyCallback {

    private static final String TAG = NativeMap.class.getSimpleName();

    private GoogleMap mMap;
    private ActivityNativeMapBinding binding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        binding = ActivityNativeMapBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());

        // Obtain the SupportMapFragment and get notified when the map is ready to be used.
        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                .findFragmentById(R.id.map);
        if (mapFragment != null) mapFragment.getMapAsync(this);
    }

    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;

        // Add a marker in Sydney and move the camera
        LatLng sydney = new LatLng(-34, 151);
        mMap.addMarker(new MarkerOptions().position(sydney).title("Marker in Sydney"));
        mMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));
    }
}

(Note that I have switched this class to extend AppCompatActivity to get the bar to appear at the top, when it extends FragmentActivity no top bar appears at all.)

How can I access this toolbar or replace it with a standard toolbar.

I also want to add a drawer menu to this activity, but everything looks so abstracted via this fragment inclusion that I have no idea how to.

I've been Googling for about a week now and can't find anything that even seems to point me in the right direction with this.



Solution 1:[1]

I figured it out.

androidx.fragment.app.FragmentContainerView can only contain fragments, so the base container in the layout needed to be changed.

I changed it to a <androidx.drawerlayout.widget.DrawerLayout to allow the main menu drawer to be included. (called "_drawer" in the tree view below)

Inside the DrawerLayout I added a androidx.constraintlayout.widget.ConstraintLayout to contain the main layout components, including the map fragment and the toolbar. (The contraint layout is called "mainLayout" in the treeview below)

The toolbar was then added inside a com.google.android.material.appbar.AppBarLayout.

The map fragment was then added in a <fragment> tag below the AppBarLayout.

This works as expected.

enter image description here

The layout XML is now as follows:

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/_drawer"
    android:animateLayoutChanges="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/mainLayout"
        android:animateLayoutChanges="true"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.google.android.material.appbar.AppBarLayout
            android:id="@+id/appBarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay"
            app:layout_constraintTop_toTopOf="parent">

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay">

                <androidx.appcompat.widget.AppCompatImageView
                    android:id="@+id/top_logo"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:contentDescription="@string/app_logo"
                    app:srcCompat="@drawable/ic_app_top_logo" />

            </androidx.appcompat.widget.Toolbar>
        </com.google.android.material.appbar.AppBarLayout>

        <fragment
            android:id="@+id/map"
            android:name="com.google.android.gms.maps.SupportMapFragment"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/appBarLayout"
            tools:context=".NativeMap" />


    </androidx.constraintlayout.widget.ConstraintLayout>


    <LinearLayout
        android:id="@+id/_nav_view"
        android:layout_width="320dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#EEEEEE">

        <include
            android:id="@+id/drawerMenu"
            layout="@layout/drawer_main" />
    </LinearLayout>
</androidx.drawerlayout.widget.DrawerLayout>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Fat Monk