如何把一個透明的佈局浮動動作按鈕

Question

我正在一個應用程序，我想在整個屏幕上放一個透明的視圖，我已經獲得了一些百分比的成功，但我的屏幕包含浮動動作按鈕也
我無法把透明的佈局上面漂浮操作按鈕

這是我的XML

<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:id="@+id/root_view" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:fitsSystemWindows="true" 
tools:context="com.groomefy.consumer.Trending.DetailedActivity"> 

<android.support.design.widget.AppBarLayout 
    android:id="@+id/app_bar" 
    android:layout_width="370dp" 
    android:layout_height="wrap_content" 
    android:fitsSystemWindows="true" 
    android:theme="@style/AppTheme.AppBarOverlay"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/toolbar_layout" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:fitsSystemWindows="true" 
     app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

     <RelativeLayout 
      android:id="@+id/layout" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_marginTop="-10dp" 
      app:layout_collapseMode="parallax"> 

      <ImageView 
       android:id="@+id/main_image" 
       android:layout_width="match_parent" 
       android:layout_height="430dp" 
       android:scaleType="fitEnd" 
       android:src="@drawable/image_placeholder_square" /> 

      <!-- 
          <ImageView 
           android:id="@+id/curve_image" 
           android:layout_width="match_parent" 
           android:layout_height="match_parent" 
           android:layout_alignParentBottom="true" 
           android:layout_marginBottom="-20dp" 
           android:scaleType="fitEnd" 
           android:src="@drawable/postdetail_curve" 
           app:layout_anchor="@id/main_image" 
           app:layout_collapseMode="none" /> 
      --> 
     </RelativeLayout> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="@color/white" 
      app:contentInsetEnd="0dp" 
      app:contentInsetLeft="0dp" 
      app:contentInsetRight="0dp" 
      app:contentInsetStart="0dp" 
      app:layout_collapseMode="pin" 
      app:popupTheme="@style/AppTheme.PopupOverlay"> 

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

       <RelativeLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:padding="10dp"> 

        <ImageButton 
         android:id="@+id/btn_cancel" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_alignParentLeft="true" 
         android:background="@android:color/transparent" 
         android:padding="10dp" 
         android:src="@drawable/backicon" /> 

        <com.groomefy.consumer.fontutils.OpenSansBold 
         android:id="@+id/title_text_view" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_centerInParent="true" 
         android:text="@string/fragment_blogs" 
         android:textColor="@color/title_text_color" 
         android:textSize="@dimen/title_text_size" 
         android:textStyle="bold" /> 

        <ImageView 
         android:id="@+id/iv_more" 
         android:layout_width="@dimen/more_btn_height" 
         android:layout_height="@dimen/more_btn_height" 
         android:layout_alignParentRight="true" 
         android:layout_centerVertical="true" 
         android:scaleType="center" 
         android:src="@drawable/more" /> 

       </RelativeLayout> 

       <View 
        android:layout_width="match_parent" 
        android:layout_height="1dp" 
        android:background="#a6a6a6" /> 

      </LinearLayout> 
     </android.support.v7.widget.Toolbar> 


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

<android.support.v4.widget.NestedScrollView 
    android:id="@+id/nested_view" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

    <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:card_view="http://schemas.android.com/apk/res-auto" 
     android:id="@+id/main_root_view" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     card_view:cardBackgroundColor="@color/white"> 

     <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_marginTop="35dp" 
      android:gravity="left" 
      android:orientation="vertical" 
      android:padding="5dp"> 

      <LinearLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:orientation="vertical"> 

       <RelativeLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:paddingBottom="5dp" 
        android:paddingLeft="10dp" 
        android:paddingRight="10dp"> 

        <TextView 
         android:id="@+id/likes" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_alignParentLeft="true" 
         android:text="likes" 
         android:textSize="16sp" /> 

        <TextView 
         android:id="@+id/comments" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_marginLeft="20dp" 
         android:layout_toRightOf="@+id/likes" 
         android:text="comments" 
         android:visibility="gone" /> 

       </RelativeLayout> 

       <RelativeLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 

        <com.groomefy.consumer.fontutils.OpenSansRegular 
         android:id="@+id/blog_main_text" 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:inputType="textMultiLine" 
         android:paddingLeft="10dp" 
         android:paddingRight="10dp" 
         android:text="di am first #firsttag i am second #secondtag and i am third  #thirtag di am first #firsttag i am second #secondtag and i am third  #thirtag di am first #firsttag i am second #secondtag and i am third  #thirtag di am first #firsttag i am second #secondtag and i am third  #thirtag" 
         android:textSize="15sp" /> 

        <com.groomefy.consumer.fontutils.OpenSansRegular 
         android:id="@+id/time_text" 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:layout_below="@+id/blog_main_text" 
         android:gravity="center_vertical" 
         android:paddingLeft="10dp" 
         android:paddingRight="10dp" 
         android:paddingTop="5dp" 
         android:text="this is time text " 
         android:textSize="15sp" /> 

       </RelativeLayout> 

      </LinearLayout> 

      <RelativeLayout 
       android:id="@+id/header_view" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:padding="10dp"> 

       <FrameLayout 
        android:id="@+id/fl_profile_pic" 
        android:layout_width="45dp" 
        android:layout_height="45dp"> 

        <ImageView 
         android:id="@+id/image_view_profile" 
         android:layout_width="@dimen/list_user_pro_img_radius" 
         android:layout_height="@dimen/list_user_pro_img_radius" 
         android:layout_marginLeft="3dp" 
         android:background="@color/grey_3" 
         android:scaleType="center" 
         android:src="@drawable/profile_placeholder_g" /> 

        <ImageView 
         android:layout_width="48dp" 
         android:layout_height="@dimen/list_user_pro_img_radius" 
         android:background="@drawable/profile_placeholder_top_layer" 
         android:scaleType="fitXY" /> 
       </FrameLayout> 

       <com.groomefy.consumer.fontutils.OpenSansBold 
        android:id="@+id/text_view_blogger_name" 
        style="@style/black.regular" 
        android:layout_centerVertical="true" 
        android:layout_marginLeft="@dimen/mar_hor_regular" 
        android:layout_toRightOf="@+id/fl_profile_pic" 
        android:gravity="top" 
        android:text="Jaine Helor" /> 
      </RelativeLayout> 

      <com.groomefy.consumer.fontutils.OpenSansBold 
       android:id="@+id/get_similar_suggestions" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_gravity="center" 
       android:layout_margin="10dp" 
       android:background="@drawable/text_rectangle" 
       android:gravity="center" 
       android:padding="2dp" 
       android:text="Get Similar Suggestions" 
       android:textAllCaps="true" 
       android:textColor="@color/title_text_color" 
       android:textStyle="bold" /> 

     </LinearLayout> 


    </android.support.v7.widget.CardView> 


</android.support.v4.widget.NestedScrollView> 

<android.support.v7.widget.RecyclerView 
    android:id="@+id/recycler_view" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
<View 
    android:id="@+id/tranparent_view" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/grey_very_light_semi_transparent" 
    android:elevation="15dp" 
    android:fitsSystemWindows="true" 
    android:visibility="gone" /> 

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/like_img" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="80dp" 
    android:background="@color/white" 
    android:elevation="10dp" 
    android:src="@drawable/like" 
    app:fabSize="normal" 
    app:layout_anchor="@id/app_bar" 
    app:layout_anchorGravity="bottom|center_vertical" /> 

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/fav_img" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:elevation="10dp" 
    android:src="@drawable/add_to_stylebook" 
    app:fabSize="normal" 
    app:layout_anchor="@id/app_bar" 
    app:layout_anchorGravity="bottom|center" /> 


<android.support.design.widget.FloatingActionButton 
    android:id="@+id/share_img" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginRight="70dp" 
    android:elevation="10dp" 
    android:src="@drawable/share" 
    app:fabSize="normal" 
    app:layout_anchor="@id/app_bar" 
    app:layout_anchorGravity="bottom|right" /> 


<LinearLayout 
    android:id="@+id/bottom_sheet" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:clipToPadding="true" 
    android:fitsSystemWindows="true" 
    android:orientation="vertical" 
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior"> 

    <android.support.v7.widget.CardView 
     android:id="@+id/card_view_sharing" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="bottom" 
     app:cardBackgroundColor="@color/white"> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 

      <com.groomefy.consumer.fontutils.OpenSansBold 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:background="@color/grey_very_light" 
       android:gravity="center" 
       android:padding="5dp" 
       android:text="@string/share_this_look" 
       android:textAllCaps="true" 
       android:textColor="@color/black_text" 
       android:textSize="@dimen/sharing_text_size" /> 


      <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:orientation="horizontal" 
       android:padding="10dp"> 

       <LinearLayout 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center" 
        android:orientation="vertical"> 

        <ImageView 
         android:id="@+id/share_on_facebook" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:adjustViewBounds="true" 
         android:src="@drawable/facebook" /> 

        <com.groomefy.consumer.fontutils.OpenSansRegular 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_marginTop="10dp" 
         android:text="Facebook" 
         android:textSize="@dimen/sharing_text_size" /> 
       </LinearLayout> 

       <LinearLayout 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center" 
        android:orientation="vertical"> 

        <ImageView 
         android:id="@+id/share_on_whatsapp" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:adjustViewBounds="true" 
         android:src="@drawable/whatsapp" /> 

        <com.groomefy.consumer.fontutils.OpenSansRegular 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_marginTop="10dp" 
         android:text="whatsapp" 
         android:textSize="@dimen/sharing_text_size" /> 

       </LinearLayout> 

       <LinearLayout 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center" 
        android:orientation="vertical"> 

        <ImageView 
         android:id="@+id/share_on_instagram" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:adjustViewBounds="true" 
         android:src="@drawable/instagram" /> 

        <com.groomefy.consumer.fontutils.OpenSansRegular 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_marginTop="10dp" 
         android:text="Instagram" 
         android:textSize="@dimen/sharing_text_size" /> 

       </LinearLayout> 

      </LinearLayout> 


     </LinearLayout> 


    </android.support.v7.widget.CardView> 
</LinearLayout> 

我試圖通過擡高解決這個問題，但是沒能實現這個
任何人都可以請建議我應該如何將佈局放在浮動動作按鈕上方

Answer 1

Android佈局是Z - 有序的，即在另一個之後定義的佈局將在其之上。在容納FAB的容器之後添加透明視圖，這樣透明視圖將位於FAB的頂部，並且可以有效地將其拖過來。

Answer 2

在FAB之後定義透明佈局。像這樣 -

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/like_img" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="80dp" 
    android:background="@color/white" 
    android:elevation="10dp" 
    android:src="@drawable/like" 
    app:fabSize="normal" 
    app:layout_anchor="@id/app_bar" 
    app:layout_anchorGravity="bottom|center_vertical" /> 

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/fav_img" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:elevation="10dp" 
    android:src="@drawable/add_to_stylebook" 
    app:fabSize="normal" 
    app:layout_anchor="@id/app_bar" 
    app:layout_anchorGravity="bottom|center" /> 


<android.support.design.widget.FloatingActionButton 
    android:id="@+id/share_img" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginRight="70dp" 
    android:elevation="10dp" 
    android:src="@drawable/share" 
    app:fabSize="normal" 
    app:layout_anchor="@id/app_bar" 
    app:layout_anchorGravity="bottom|right" /> 

<View 
    android:id="@+id/tranparent_view" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/grey_very_light_semi_transparent" 
    android:elevation="15dp" 
    android:fitsSystemWindows="true" 
    android:visibility="gone" /> 

Answer 3

在透明視圖中添加這一行：

android:translationZ="8dp"