如何添加一個TextView一個FloatingActionButton以上的Android

Question

我想添加一個FloatingActionButton上面一個TextView，我使用的FrameLayout作爲TextView的和FloatingActionButton的父佈局，這裏是我的示例代碼：

<FrameLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"> 

    <android.support.design.widget.FloatingActionButton 
     xmlns:app="http://schemas.android.com/apk/res-auto" 
     android:id="@+id/fab" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:backgroundTint="#00fff0" 
     app:borderWidth="0dp" 
     android:elevation="0dp" 
     app:fabSize="normal" /> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textColor="#000000" 
     android:text="above"/> 

</FrameLayout> 

但它是無用的，TextView的是FloatingActionButton下方，這樣

，我希望它表明這樣的：

我對此很窮，任何人都可以幫助我嗎？

Answer 1

你只需要高程屬性爲TextView的

<FrameLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"> 

    <android.support.design.widget.FloatingActionButton 
     xmlns:app="http://schemas.android.com/apk/res-auto" 
     android:id="@+id/fab" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     app:backgroundTint="#00fff0" 
     app:borderWidth="0dp" 
     android:elevation="0dp" 
     app:fabSize="normal" /> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textColor="#000000" 
     android:text="above" 
     android:elevation="7dp"/> 

</FrameLayout> 

Answer 2

它是一個z順序問題。在你的FrameLayout移動<FloatingActionButton

<FrameLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content"> 

    <TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textColor="#000000" 
    android:text="above"/> 

    <android.support.design.widget.FloatingActionButton 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    app:backgroundTint="#00fff0" 
    app:borderWidth="0dp" 
    android:elevation="0dp" 
    app:fabSize="normal" /> 
</FrameLayout> 

上述<TextView應該這樣做

Answer 3

這裏是您的解決方案：

<FrameLayout 
android:layout_width="wrap_content" 
android:layout_height="wrap_content"> 

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


<android.support.design.widget.FloatingActionButton 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    app:backgroundTint="#00fff0" 
    app:borderWidth="0dp" 
    android:elevation="0dp" 
    app:fabSize="normal" /> 

<TextView 
    android:layout_toRightOf="@+id/fab" 
    android:layout_marginLeft="-10dp" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textColor="#000000" 
    android:text="above"/> 
</RelativeLayout> 

</FrameLayout> 

Answer 4

相應地設置兩個視圖的高程。此外，將您的TextView XML代碼移動到FAB XML代碼上方更有意義。

Answer 5

爲了支持低端設備同時使用android:elevation和app:elevation

組兩個值爲0的Fab

<FrameLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content"> 

<android.support.design.widget.FloatingActionButton 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    app:backgroundTint="#00fff0" 
    app:borderWidth="0dp" 
    android:elevation="0dp" 
    app:elevation="0dp" 
    app:fabSize="normal" /> 

<TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textColor="#000000" 
    android:text="above"/> 

    </FrameLayout>