android - 如何使用 DrawerButton、SearchView 和半透明状态栏创建 Google 地图，例如 Toolbar，以便在状态栏后面可以看到地图？

Question

我想得到像这张图片一样的工具栏。此外，请考虑显示在半透明状态栏下方的地图。

Answer 1

我已经想出了如何实现那种工具栏。

这是我的activity_maps.xml：

<?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_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MapsActivity">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

        <fragment
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/map"
                android:name="com.google.android.gms.maps.SupportMapFragment"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toBottomOf="parent"
                android:fitsSystemWindows="true"
                app:layout_constraintEnd_toEndOf="parent"/>

        <FrameLayout android:layout_width="match_parent"
                     android:fitsSystemWindows="true"
                     android:layout_height="wrap_content">

            <androidx.cardview.widget.CardView
                    android:layout_width="match_parent"
                    android:layout_margin="4dp"
                    app:cardUseCompatPadding="true"
                    app:cardCornerRadius="4dp"
                    app:cardElevation="2dp"
                    android:layout_height="?attr/actionBarSize">

                <com.google.android.material.appbar.AppBarLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

                    <androidx.appcompat.widget.Toolbar
                            app:title="Title"
                            android:background="@drawable/bg_gradient"
                            android:id="@+id/toolbar"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"/>

                </com.google.android.material.appbar.AppBarLayout>

            </androidx.cardview.widget.CardView>

        </FrameLayout>

    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <com.google.android.material.navigation.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/nav_header_drawer"
            app:menu="@menu/activity_drawer_drawer"/>

</androidx.drawerlayout.widget.DrawerLayout>

style.xml：

<style name="MapsTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">false</item>
</style>

输出：

Answer 2

对于状态栏执行此操作，您在创建时调用 ths 并传入状态栏的颜色

private void changeStatusBarColor(String color){
    if (Build.VERSION.SDK_INT >= 21) {
        Window window = getWindow();
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        window.setStatusBarColor(Color.parseColor(color));
    }
} 

对于工具栏，您必须使用我认为卡片视图背景创建自定义工具栏样式，并将默认工具栏替换为您设计的工具栏