带有浮动按钮的 ScrollView

Posted 2023-04-18

【中文标题】带有浮动按钮的 ScrollView

【英文标题】：ScrollView with floating button

【发布时间】：2019-06-11 21:28:20

【问题描述】：

我制作了一个应用程序，其中一个活动包含两个 TextView、一个 ImageView 和 FloatingActionButton。我想做这样的布局。

这是我的代码。

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:fillViewport="true"
    tools:context=".DetailsActivity"
    android:id="@+id/scrollView"
    >

    <android.support.design.widget.CoordinatorLayout
        android:layout_
        android:layout_>



    <LinearLayout
        android:layout_
        android:layout_
        android:orientation="vertical"
        >


 <!--    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_
        android:layout_
        android:layout_gravity="center" /> -->

    <TextView
        android:id="@+id/titleTextView"
        android:layout_
        android:layout_
        android:layout_margin="15dp"
        android:textSize="25sp"
        android:textStyle="bold"
        />

    <TextView
        android:id="@+id/blogContent"
        android:layout_
        android:layout_
        android:layout_margin="16dp"
        android:textSize="16sp"
        />

        <ImageView
            android:id="@+id/youtubeThumbnailImage"
            android:layout_
            android:layout_
            android:layout_marginBottom="20dp"
            android:src="@mipmap/ic_launcher"
            android:visibility="gone"
            />


    </LinearLayout>

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_
            android:layout_
            android:layout_gravity="start"
            android:layout_margin="20dp"
            android:src="@drawable/icons8_share_480"
            app:fabSize="auto"

            />

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

我使用 post 中的代码使其在所有 android api 上向下滚动时隐藏。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) 
            scrollView.setOnScrollChangeListener(new View.OnScrollChangeListener() 
                @Override
                public void onScrollChange(View v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) 
                    if (scrollY > 0 && fab.isShown()) 
                        fab.setVisibility(View.GONE);
                     else if (scrollY < 0) 
                        fab.setVisibility(View.VISIBLE);

                    
                
            );
         else 
            scrollView.getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() 
                @Override
                public void onScrollChanged() 
                    int mScrollY = scrollView.getScrollY();
                    if (mScrollY > 0 && fab.isShown()) 
                        fab.setVisibility(View.GONE);
                     else if (mScrollY < 0) 
                        fab.setVisibility(View.VISIBLE);
                    
                
            );
        

这适用于 android 6.0。但高于 6.0，浮动按钮出现在活动的右上角。这是下面的图片。

我尝试了许多属性选项，例如-android:layout_gravity=""，并将 FloatingButton 直接放在主 LinearLayout 或 FrameLayout 上。这些布局仍然不起作用。

【参考方案1】：

使用 CoordinatorLayout，您应该尝试将 FloatingActionButtons 锚点设置为引用 LinearLayout，并使用 layout_anchorGravity 定位 FAB。

FAB 的示例代码：

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_
        android:layout_
        app:layout_anchor="@id/linearLayoutID"
        app:layout_anchorGravity="bottom|right|end"
        android:layout_margin="16dp"
        android:src="@drawable/icons8_share_480"
        />

记得为你的LinearLayout设置一个ID。我使用@id/linearLayoutID 作为占位符。

【讨论】：

我看到这个错误 Android 资源链接失败 输出：D:\Courses\Java\Android Projects\DummyApp\app\src\main\res\layout\activity_details.xml:16: error: attribute android :layout_anchor 未找到。 D:\Courses\Java\Android Projects\DummyApp\app\src\main\res\layout\activity_details.xml:16：错误：找不到属性 android:layout_anchorGravity。

感谢编辑，一定错过了。我希望这个解决方案对你有用。