实现 Android 上滑悬浮效果

1. 整体流程

为了实现 Android 上滑悬浮效果,我们需要按照以下步骤进行操作:

步骤 描述
步骤一 创建一个包含滑动视图的 Android 布局文件
步骤二 在 Java 代码中实现滑动逻辑
步骤三 设置滑动监听器
步骤四 根据滑动距离调整悬浮视图的位置

2. 具体步骤

步骤一:创建布局文件

首先,我们需要在 Android 布局文件中创建一个包含滑动视图的布局。可以使用 LinearLayout 或者 RelativeLayout 等布局容器来实现。

<RelativeLayout
    xmlns:android="
    android:id="@+id/mainLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- 滑动视图 -->
    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        
        <!-- 滑动内容 -->
        <LinearLayout
            android:id="@+id/contentLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            
            <!-- 具体内容 -->
            
        </LinearLayout>
    </ScrollView>
    
    <!-- 悬浮视图 -->
    <LinearLayout
        android:id="@+id/floatLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        
        <!-- 悬浮内容 -->
        
    </LinearLayout>
</RelativeLayout>

步骤二:实现滑动逻辑

接下来,我们需要在 Java 代码中实现滑动逻辑。可以使用 OnTouchListener 接口来监听触摸事件,并通过计算滑动距离来判断是否需要显示悬浮视图。

float startY = 0;
float floatViewY = 0;
boolean isFloatViewVisible = false;

scrollView.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                startY = event.getY();
                floatViewY = floatLayout.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                float deltaY = event.getY() - startY;
                if (deltaY > 0 && !isFloatViewVisible) {
                    // 向下滑动,显示悬浮视图
                    floatLayout.setVisibility(View.VISIBLE);
                    isFloatViewVisible = true;
                } else if (deltaY < 0 && isFloatViewVisible) {
                    // 向上滑动,隐藏悬浮视图
                    floatLayout.setVisibility(View.GONE);
                    isFloatViewVisible = false;
                }
                break;
        }
        return false;
    }
});

步骤三:设置滑动监听器

为了实现滑动效果,我们需要在 Activity 的 onCreate 方法中设置滑动监听器。

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // 获取滑动视图和悬浮视图
    ScrollView scrollView = findViewById(R.id.scrollView);
    LinearLayout floatLayout = findViewById(R.id.floatLayout);

    // 设置滑动监听器
    setScrollListener(scrollView, floatLayout);
}

步骤四:调整悬浮视图的位置

最后,我们需要根据滑动距离来调整悬浮视图的位置。可以使用 setY 方法来设置悬浮视图的 Y 坐标。

private void setScrollListener(final ScrollView scrollView, final LinearLayout floatLayout) {
    floatLayout.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            floatLayout.setY(scrollView.getHeight() - floatLayout.getHeight());
        }
    });
}

3. 甘特图

gantt
    dateFormat  YYYY-MM-DD
    title       Android 上滑悬浮效果实现流程
    section 创建布局文件
    步骤一             :done, 2022-01-01, 1d
    section 实现滑动逻辑
    步骤二             :done, 2022-01-02, 1