【Android】Android开发实现带有反弹效果，仿IOS反弹scrollview详解教程

最新推荐文章于 2023-04-27 11:11:33 发布
置顶 最新推荐文章于 2023-04-27 11:11:33 发布
阅读量2.5k 收藏 1
点赞数 3
分类专栏： Android开发小项目学习总结 文章标签： android ios github android开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_21376985/article/details/52468306
版权

作者：程序员小冰，GitHub主页：https://github.com/QQ986945193
新浪微博：http://weibo.com/mcxiaobing
首先给大家看一下我们今天这个最终实现的效果图：
这里写图片描述
这个是ios中的反弹效果。当然我们安卓中如果想要实现这种效果，
感觉不会那么生硬，滚动到底部或者顶部的时候。当然
使用scrollview是无法实现的。所以我们需要新建一个view继承ScrollView

package davidbouncescrollview.qq986945193.com.davidbouncescrollview;

import android.annotation.SuppressLint;
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;

/**
 * @author ：程序员小冰
 * @新浪微博 ：http://weibo.com/mcxiaobing
 * @GitHub:https://github.com/QQ986945193
 * @CSDN博客: http://blog.csdn.net/qq_21376985
 * @交流Qq ：986945193
 * 类名：带有反弹效果的scrollview
 */
public class BounceScrollView extends ScrollView {
    private View inner;// 孩子View

    private float y;// 点击时y坐标

    private Rect normal = new Rect();// 矩形(这里只是个形式，只是用于判断是否需要动画.)

    private boolean isCount = false;// 是否开始计算

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

    /***
     * 根据 XML 生成视图工作完成.该函数在生成视图的最后调用，在所有子视图添加完之后. 即使子类覆盖了 onFinishInflate
     * 方法，也应该调用父类的方法，使该方法得以执行.
     */
    @SuppressLint("MissingSuperCall")
    @Override
    protected void onFinishInflate() {
        if (getChildCount() > 0) {
            inner = getChildAt(0);
        }
    }

    /***
     * 监听touch
     */
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        if (inner != null) {
            commOnTouchEvent(ev);
        }

        return super.onTouchEvent(ev);
    }

    /***
     * 触摸事件
     *
     * @param ev
     */
    public void commOnTouchEvent(MotionEvent ev) {
        int action = ev.getAction();
        switch (action) {
            case MotionEvent.ACTION_DOWN:
                break;
            case MotionEvent.ACTION_UP:
                // 手指松开.
                if (isNeedAnimation()) {
                    animation();
                    isCount = false;
                }
                break;
            /***
             * 排除出第一次移动计算，因为第一次无法得知y坐标， 在MotionEvent.ACTION_DOWN中获取不到，
             * 因为此时是MyScrollView的touch事件传递到到了LIstView的孩子item上面.所以从第二次计算开始.
             * 然而我们也要进行初始化，就是第一次移动的时候让滑动距离归0. 之后记录准确了就正常执行.
             * https://github.com/QQ986945193
             */
            case MotionEvent.ACTION_MOVE:
                final float preY = y;// 按下时的y坐标
                float nowY = ev.getY();// 时时y坐标
                int deltaY = (int) (preY - nowY);// 滑动距离
                if (!isCount) {
                    deltaY = 0; // 在这里要归0.
                }

                y = nowY;
                // 当滚动到最上或者最下时就不会再滚动，这时移动布局
                if (isNeedMove()) {
                    // 初始化头部矩形
                    if (normal.isEmpty()) {
                        // 保存正常的布局位置
                        normal.set(inner.getLeft(), inner.getTop(),
                                inner.getRight(), inner.getBottom());
                    }
//              Log.e("jj", "矩形：" + inner.getLeft() + "," + inner.getTop()
//                      + "," + inner.getRight() + "," + inner.getBottom());
                    // 移动布局
                    inner.layout(inner.getLeft(), inner.getTop() - deltaY / 2,
                            inner.getRight(), inner.getBottom() - deltaY / 2);
                }
                isCount = true;
                break;

            default:
                break;
        }
    }

    /***
     * 回缩动画
     */
    public void animation() {
        // 开启移动动画
        TranslateAnimation ta = new TranslateAnimation(0, 0, inner.getTop(),
                normal.top);
        ta.setDuration(200);
        inner.startAnimation(ta);
        // 设置回到正常的布局位置
        inner.layout(normal.left, normal.top, normal.right, normal.bottom);

//      Log.e("jj", "回归：" + normal.left + "," + normal.top + "," + normal.right
//              + "," + normal.bottom);

        normal.setEmpty();

    }

    // 是否需要开启动画
    public boolean isNeedAnimation() {
        return !normal.isEmpty();
    }

    /***
     * 是否需要移动布局 inner.getMeasuredHeight():获取的是控件的总高度
     * <p/>
     * getHeight()：获取的是屏幕的高度
     * <p/>
     * https://github.com/QQ986945193
     *
     * @return
     */
    public boolean isNeedMove() {
        int offset = inner.getMeasuredHeight() - getHeight();
        int scrollY = getScrollY();
//      Log.e("jj", "scrolly=" + scrollY);
        // 0是顶部，后面那个是底部
        if (scrollY == 0 || scrollY == offset) {
            return true;
        }
        return false;
    }
}

然后他的用法就是和ScrollView用法一样了。比如直接在布局中引用：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"

    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="davidbouncescrollview.qq986945193.com.davidbouncescrollview.MainActivity">

    <davidbouncescrollview.qq986945193.com.davidbouncescrollview.BounceScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

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

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />

            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@android:color/black" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="大家好，我是程序员小冰" />
        </LinearLayout>

    </davidbouncescrollview.qq986945193.com.davidbouncescrollview.BounceScrollView>

</LinearLayout>

最后直接运行即可看到上面的效果。
（AndroidStudio版）github下载地址：
https://github.com/QQ986945193/DavidBounceScrollView
（AndroidStudio版）CSDN免积分下载地址：
http://download.csdn.net/detail/qq_21376985/9624856
（AndroidStudio版）git开源中国下载地址：
http://git.oschina.net/MCXIAOBING/DavidBounceScrollView

程序员小冰
关注
专栏目录
Android代码-带回弹效果的ScrollView
08-06
BoundScrollView 类似于ios，带回弹效果的ScrollView 使用 Gradle compile 'com.rairmmd.boundscrollview:library:1.0.0' 布局中 和ScrollView一样使用 ··· childViews ··· 截图
android带反弹效果ScrollView
gdscp的博客
06-07 1049
自已写的一个带反弹效果的ScrollView，供参考 package cn.bassy.library.widget;    import android.content.Context;  import android.util.AttributeSet;  import android.view.MotionEvent;  import android.view.V
Android ScrollView反弹效果的实现
#ifndefine maxwit #define maxwit...#endif
06-03 635
自定义ScrollView控件：
Android自定义ScrollView实现上下反弹效果
sinat_31846227的博客
01-09 608
在Android中ScrollView是没有上下反弹效果，IOS中的控件默认是有上下反弹效果。实现上下反弹效果对于用户来说可能体验感觉会更好一些。ScrollView实现上下反弹效果原理很简单，下面先来说一下实现原理，然后在贴代码。 1、首先自定义个CustomerScrollView类，继承ScrollView 2、重写onFinishInflate()方法，该方法会在视图生成后调用，重写该
Android ScrollView实现反弹效果的实例
08-29
主要介绍了 Android ScrollView实现反弹效果的实例的相关资料,这里自定义scrollview 并实现反弹效果，需要的朋友可以参考下
Android仿IOS回弹效果,Android仿IOS回弹效果 支持任何控件
weixin_34058060的博客
05-28 387
本文实例为大家分享了Android仿IOS回弹效果的具体代码，供大家参考，具体内容如下效果图:导入依赖:dependencies {// ...compile 'me.everything:overscroll-decor-android:1.0.4'}RecyclerView支持线性布局和网格布局管理器(即所有原生Android布局)。可以轻松适应支持自定义布局管理器。RecyclerView ...
scrollview的回弹效果
12-24
有详细的代码注释，代码量少，易懂，当scrollview滑动至顶部或者底部时，都可以在回弹
android 按钮回弹效果,Android仿IOS回弹效果 支持任何控件
weixin_32098191的博客
05-26 636
本文实例为大家分享了Android仿IOS回弹效果的具体代码，供大家参考，具体内容如下效果图:导入依赖:dependencies {// ...compile 'me.everything:overscroll-decor-android:1.0.4'}RecyclerView支持线性布局和网格布局管理器(即所有原生Android布局)。可以轻松适应支持自定义布局管理器。RecyclerView ...
Android自定义ScrollView实现反弹效果
03-28 4330
android的ScrollView控件默认是没有反弹效果的，当滑动到边缘的时候便不能继续滑动。这里通过自定义ScrollView来实现反弹效果。看下面的效果图，红色图片在最左边，android默认ScrollView控件红色图片在最左边的时候是不能向右滚动的。 这里是水平滚动，我们可以通过自定义类继承自HorizontalScrollView类来实现。 public cl
Android仿IOS布局上拉下拉回弹，并显示底层控件
qq_18612815的博客
01-15 3855
先来看看一般的布局，比如LinearLayout 首先自定义一个LinearLayout，重写computeScroll、onTouchEvent等方法，在onTouchEvent中判断手势，如果手指抬起，则LinearLayout回到顶部，如果是其他的，则控件随着手指滚动。 public class MyLayout extends LinearLayout { private S
android ScrollView反弹效果的实现
苏东生的专栏
10-25 510
package cn.pocdoc.exam.views; import android.annotation.TargetApi; import android.content.Context; import android.graphics.Rect; import android.os.Build; import android.util.AttributeSet; import andr
Android ScrollView反弹效果
05-19
本Demo自定义了ScrollView控件，来实现上、下拉的反弹效果，提高了用户体验。
Android webView 实现阻尼回弹效果
最新发布
怎么可以吃恐龙呢
04-27 739
ios中对可以滚动的视图都在系统层面上实现了触碰到边缘的阻尼回弹效果，用户一看便知自己的操作已经到了边界。android中也有类似的方案，不过当到达边界的时候不是用阻尼的方式，而是逐渐显示一个渐变颜色。iOS webView默认滑动到顶部或者底部的时候，还可以继续通过手指拉扯滑动，松手后回弹；而Android webView默认是不行的，要实现跟iOS一样的效果，就需要自定义webView。
Android——仿ios阻尼回弹动画
小欣儿的专栏
04-19 5972
最近项目需求中要求给一个左右滑动的剧集列表添加阻尼回弹动画效果。大家都知道安卓原生的View一般滑动到View的边界之后就停止，不会有拖拽效果的，网上查找了一些方法，也跳了一些坑，今天就来总结下分享给大家。
Android版仿ios可以上下拉的ScrollView
litian921226的博客
04-19 506
自定义类似ios的可上下拉布局控件public class MyScrollView extends ScrollView { // 拖动的距离 size = 4 的意思 只允许拖动屏幕的1/4 private static final int size = 4; private View inner; private float y; pri
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

程序员小冰

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值