弹性ScrollView,和下啦刷新的效果类似 实现下拉弹回和上拉弹回

2024-01-30 20:50

本文主要是介绍弹性ScrollView,和下啦刷新的效果类似 实现下拉弹回和上拉弹回,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

今天做了一个弹性ScrollView,和下啦刷新的效果类似,我想这个很多需求都用的这种效果

其实这是一个自定义的scrollView,上代码,这是我写在一个公共的组件包里的

package com.pb.soft.widget;
import android.content.Context;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.TranslateAnimation;
import android.widget.ScrollView;


/**
 * 有弹性的ScrollView 实现下拉弹回和上拉弹回
 * 
 * @author shaozuhceng
 */
public class UserDefineScrollView extends ScrollView {


private static final String TAG = "UserDefineScrollView ";


// 移动因子, 是一个百分比, 比如手指移动了100px, 那么View就只移动50px
// 目的是达到一个延迟的效果
private static final float MOVE_FACTOR = 0.5f;


// 松开手指后, 界面回到正常位置需要的动画时间
private static final int ANIM_TIME = 300;


// ScrollView的子View, 也是ScrollView的唯一一个子View
private View contentView;


// 手指按下时的Y值, 用于在移动时计算移动距离
// 如果按下时不能上拉和下拉, 会在手指移动时更新为当前手指的Y值
private float startY;


// 用于记录正常的布局位置
private Rect originalRect = new Rect();


// 手指按下时记录是否可以继续下拉
private boolean canPullDown = false;


// 手指按下时记录是否可以继续上拉
private boolean canPullUp = false;


// 在手指滑动的过程中记录是否移动了布局
private boolean isMoved = false;


public UserDefineScrollView(Context context) {
super(context);
}


public UserDefineScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}


@Override
protected void onFinishInflate() {
if (getChildCount() > 0) {
contentView = getChildAt(0);
}
}


@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);


if (contentView == null)
return;


// ScrollView中的唯一子控件的位置信息, 这个位置信息在整个控件的生命周期中保持不变
originalRect.set(contentView.getLeft(), contentView.getTop(), contentView.getRight(), contentView.getBottom());
}


/**
* 在触摸事件中, 处理上拉和下拉的逻辑
*/
@Override
public boolean dispatchTouchEvent(MotionEvent ev) {


if (contentView == null) {
return super.dispatchTouchEvent(ev);
}


// 手指是否移动到了当前ScrollView控件之外
boolean isTouchOutOfScrollView = ev.getY() >= this.getHeight() || ev.getY() <= 0;


if (isTouchOutOfScrollView) { // 如果移动到了当前ScrollView控件之外
if (isMoved) // 如果当前contentView已经被移动, 首先把布局移到原位置, 然后消费点这个事件
boundBack();
return true;
}


int action = ev.getAction();


switch (action) {
case MotionEvent.ACTION_DOWN:


// 判断是否可以上拉和下拉
canPullDown = isCanPullDown();
canPullUp = isCanPullUp();


// 记录按下时的Y值
startY = ev.getY();


break;


case MotionEvent.ACTION_UP:


boundBack();


break;
case MotionEvent.ACTION_MOVE:


// 在移动的过程中, 既没有滚动到可以上拉的程度, 也没有滚动到可以下拉的程度
if (!canPullDown && !canPullUp) {
startY = ev.getY();
canPullDown = isCanPullDown();
canPullUp = isCanPullUp();


break;
}


// 计算手指移动的距离
float nowY = ev.getY();
int deltaY = (int) (nowY - startY);


// 是否应该移动布局
boolean shouldMove = (canPullDown && deltaY > 0) // 可以下拉, 并且手指向下移动
|| (canPullUp && deltaY < 0) // 可以上拉, 并且手指向上移动
|| (canPullUp && canPullDown); // 既可以上拉也可以下拉(这种情况出现在ScrollView包裹的控件比ScrollView还小)


if (shouldMove) {
// 计算偏移量
int offset = (int) (deltaY * MOVE_FACTOR);


// 随着手指的移动而移动布局
contentView.layout(originalRect.left, originalRect.top + offset, originalRect.right, originalRect.bottom + offset);


isMoved = true; // 记录移动了布局
}


break;
default:
break;
}


return super.dispatchTouchEvent(ev);
}


/**
* 将内容布局移动到原位置 可以在UP事件中调用, 也可以在其他需要的地方调用, 如手指移动到当前ScrollView外时
*/
private void boundBack() {
if (!isMoved)
return; // 如果没有移动布局, 则跳过执行


// 开启动画
TranslateAnimation anim = new TranslateAnimation(0, 0, contentView.getTop(), originalRect.top);
anim.setDuration(ANIM_TIME);


contentView.startAnimation(anim);


// 设置回到正常的布局位置
contentView.layout(originalRect.left, originalRect.top, originalRect.right, originalRect.bottom);


// 将标志位设回false
canPullDown = false;
canPullUp = false;
isMoved = false;
}


/**
* 判断是否滚动到顶部
*/
private boolean isCanPullDown() {
return getScrollY() == 0 || contentView.getHeight() < getHeight() + getScrollY();
}


/**
* 判断是否滚动到底部
*/
private boolean isCanPullUp() {
return contentView.getHeight() <= getHeight() + getScrollY();
}


}


然后就是你在布局文件中引用你的自定义scrollView,需要注意的是,使用自定义的scrollView需要带上你的全部包名

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

<!-注意这里的使用全部的包名-->
    <com.pb.soft.widget.UserDefineScrollView
        android:id="@+id/set_scrollview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fadingEdge="none"
        android:focusable="false"
        android:overScrollMode="never"
        android:scrollbars="none" >


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp"
            android:background="@drawable/bg_input_background"
            android:orientation="vertical" >


            <RelativeLayout
                android:id="@+id/relativelayout_01"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >


                <TextView
                    android:id="@+id/personinfo_head_name"
                    android:layout_width="wrap_content"
                    android:layout_height="50dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试1"
                    android:textSize="16sp" />


                <ImageView
                    android:id="@+id/rel_set_personinfromation_arrow"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:id="@+id/line0"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


            <RelativeLayout
                android:id="@+id/relativelayout_02"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >


                <TextView
                    android:id="@+id/textview01"
                    android:layout_width="wrap_content"
                    android:layout_height="50dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试2"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


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


                <TextView
                    android:id="@+id/textview02"
                    android:layout_width="wrap_content"
                    android:layout_height="50dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试3"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


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


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="50dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试4"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="50dp" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="40dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试5"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="50dp" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="40dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试6"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="50dp" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="40dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试7"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="50dp" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="40dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试8"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/list_divide_line"
                android:contentDescription="@null" />


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="50dp" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="40dp"
                    android:layout_marginLeft="15dp"
                    android:ellipsize="end"
                    android:gravity="center_vertical"
                    android:includeFontPadding="false"
                    android:singleLine="true"
                    android:text="单元测试9"
                    android:textSize="16sp" />


                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_marginRight="10dp"
                    android:contentDescription="@null"
                    android:src="@drawable/ic_set_arrow" />
            </RelativeLayout>
        </LinearLayout>
    </com.pb.soft.widget.UserDefineScrollView>


</RelativeLayout>

然后在MainActivity中调用


package com.soft.userdefinescrollview;
import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity {


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


运行后的效果图



本人在这里还做了一个Demo。需要下载的朋友可以去下载,这里提供一个下载链接http://download.csdn.net/detail/shaozucheng/7752629

这篇关于弹性ScrollView,和下啦刷新的效果类似 实现下拉弹回和上拉弹回的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/661510

相关文章

Java中使用Java Mail实现邮件服务功能示例

《Java中使用JavaMail实现邮件服务功能示例》:本文主要介绍Java中使用JavaMail实现邮件服务功能的相关资料,文章还提供了一个发送邮件的示例代码,包括创建参数类、邮件类和执行结... 目录前言一、历史背景二编程、pom依赖三、API说明(一)Session (会话)(二)Message编程客

Java中List转Map的几种具体实现方式和特点

《Java中List转Map的几种具体实现方式和特点》:本文主要介绍几种常用的List转Map的方式,包括使用for循环遍历、Java8StreamAPI、ApacheCommonsCollect... 目录前言1、使用for循环遍历:2、Java8 Stream API:3、Apache Commons

C#提取PDF表单数据的实现流程

《C#提取PDF表单数据的实现流程》PDF表单是一种常见的数据收集工具,广泛应用于调查问卷、业务合同等场景,凭借出色的跨平台兼容性和标准化特点,PDF表单在各行各业中得到了广泛应用,本文将探讨如何使用... 目录引言使用工具C# 提取多个PDF表单域的数据C# 提取特定PDF表单域的数据引言PDF表单是一

使用Python实现高效的端口扫描器

《使用Python实现高效的端口扫描器》在网络安全领域,端口扫描是一项基本而重要的技能,通过端口扫描,可以发现目标主机上开放的服务和端口,这对于安全评估、渗透测试等有着不可忽视的作用,本文将介绍如何使... 目录1. 端口扫描的基本原理2. 使用python实现端口扫描2.1 安装必要的库2.2 编写端口扫

PyCharm接入DeepSeek实现AI编程的操作流程

《PyCharm接入DeepSeek实现AI编程的操作流程》DeepSeek是一家专注于人工智能技术研发的公司,致力于开发高性能、低成本的AI模型,接下来,我们把DeepSeek接入到PyCharm中... 目录引言效果演示创建API key在PyCharm中下载Continue插件配置Continue引言

MySQL分表自动化创建的实现方案

《MySQL分表自动化创建的实现方案》在数据库应用场景中,随着数据量的不断增长,单表存储数据可能会面临性能瓶颈,例如查询、插入、更新等操作的效率会逐渐降低,分表是一种有效的优化策略,它将数据分散存储在... 目录一、项目目的二、实现过程(一)mysql 事件调度器结合存储过程方式1. 开启事件调度器2. 创

使用Python实现操作mongodb详解

《使用Python实现操作mongodb详解》这篇文章主要为大家详细介绍了使用Python实现操作mongodb的相关知识,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、示例二、常用指令三、遇到的问题一、示例from pymongo import MongoClientf

SQL Server使用SELECT INTO实现表备份的代码示例

《SQLServer使用SELECTINTO实现表备份的代码示例》在数据库管理过程中,有时我们需要对表进行备份,以防数据丢失或修改错误,在SQLServer中,可以使用SELECTINT... 在数据库管理过程中,有时我们需要对表进行备份,以防数据丢失或修改错误。在 SQL Server 中,可以使用 SE

基于Go语言实现一个压测工具

《基于Go语言实现一个压测工具》这篇文章主要为大家详细介绍了基于Go语言实现一个简单的压测工具,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录整体架构通用数据处理模块Http请求响应数据处理Curl参数解析处理客户端模块Http客户端处理Grpc客户端处理Websocket客户端

Java CompletableFuture如何实现超时功能

《JavaCompletableFuture如何实现超时功能》:本文主要介绍实现超时功能的基本思路以及CompletableFuture(之后简称CF)是如何通过代码实现超时功能的,需要的... 目录基本思路CompletableFuture 的实现1. 基本实现流程2. 静态条件分析3. 内存泄露 bug