【问题标题】:Overlay on top of toolbar and fab叠加在工具栏和工厂的顶部
【发布时间】:2017-04-29 14:01:29
【问题描述】:

我想实现以下目标:
使用当前不可见的 LinearLayout 覆盖整个活动,并使用 CircularReveal 动画显示。然后它应该看起来像这样。 (另外,Fab 应该隐藏在覆盖层的半透明背景之下。)
截图取自 Android Studio 的预览版。

但在我的手机上测试时却是这样。

工具栏和工厂位于覆盖层之上。我在下面附上了我的布局。 我知道,我也可以通过一个新的活动来解决这个问题,该活动以透明主题绘制在前一个活动之上,但我更喜欢这种方法,因为它在未来更容易使用。

<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.jonas.gimmefood.MapsActivity">

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

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/Theme.gimmefood.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/Theme.gimmefood.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        app:fabSize="normal"
        android:elevation="2dp"
        app:srcCompat="@drawable/ic_my_location_24dp" />

    <!-- This is the overlay -->
    <LinearLayout
        android:id="@+id/overlay"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:visibility="visible">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="@dimen/app_bar_height"
            android:background="@color/primary_dark"
            android:orientation="vertical"
            android:elevation="2dp">
            <!-- elevation for the drop shadow -->

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:weightSum="1">

                <android.support.v7.widget.AppCompatEditText
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="start"
                    android:layout_marginEnd="52dp"
                    android:layout_marginStart="4dp"
                    android:hint="@android:string/search_go" />

                <android.support.v7.widget.AppCompatImageButton
                    android:id="@+id/toolbar_close_icon"
                    style="@style/Widget.AppCompat.Button.Borderless"
                    android:layout_width="42dp"
                    android:layout_height="42dp"
                    android:layout_gravity="end"
                    android:layout_marginEnd="4dp"
                    android:background="?selectableItemBackgroundBorderless"
                    android:src="@drawable/ic_close_24dp" />
            </FrameLayout>

            horizontal list view with all the circular buttons
            ...

        </LinearLayout>

        <View
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/background_transparent"/>

    </LinearLayout>

</android.support.design.widget.CoordinatorLayout>

【问题讨论】:

    标签: android xml android-layout layout toolbar


    【解决方案1】:

    我通过使用PopupWindow (reference here) 解决了它

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-02-18
      • 1970-01-01
      • 2011-09-29
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多