【No11.】仿IOS界面最常用的回弹效果

来源：互联网发布：ubuntu命令行修改文件编辑：程序博客网时间：2024/05/21 10:53

好久没来写文章了！

今天为大家分享一个仿照ios界面的回弹效果。（下面先上效果图）

其实就是通过重写ScrollView，监听onTouchEvent方法，再去移动布局实现回弹效果；

上代码：

IosScrollViewLayout.java

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;public class IosScrollViewLayout extends ScrollView {// 拖动的距离 size = 3 的意思 只允许拖动屏幕的1/3private static final int size = 3;private View inner;private float y;private Rect normal = new Rect();;public IosScrollViewLayout(Context context) {super(context);setVerticalScrollBarEnabled(false);//隐藏ScrollView滚动条}public IosScrollViewLayout(Context context, AttributeSet attrs) {super(context, attrs);setVerticalScrollBarEnabled(false);//隐藏ScrollView滚动条}@Overrideprotected void onFinishInflate() {if (getChildCount() > 0) {inner = getChildAt(0);}}@Overridepublic boolean onTouchEvent(MotionEvent ev) {if (inner == null) {return super.onTouchEvent(ev);} else {commOnTouchEvent(ev);}return super.onTouchEvent(ev);}public void commOnTouchEvent(MotionEvent ev) {int action = ev.getAction();switch (action) {case MotionEvent.ACTION_DOWN:y = ev.getY();break;case MotionEvent.ACTION_UP:if (isNeedAnimation()) {// Log.v("mlguitar", "will up and animation");animation();}break;case MotionEvent.ACTION_MOVE:final float preY = y;float nowY = ev.getY();/** * size=3 表示 拖动的距离为屏幕的高度的1/3 */int deltaY = (int) (preY - nowY) / size;// 滚动// scrollBy(0, deltaY);y = nowY;// 当滚动到最上或者最下时就不会再滚动，这时移动布局if (isNeedMove()) {if (normal.isEmpty()) {// 保存正常的布局位置normal.set(inner.getLeft(), inner.getTop(),inner.getRight(), inner.getBottom());return;}int yy = inner.getTop() - deltaY;// 移动布局inner.layout(inner.getLeft(), yy, inner.getRight(),inner.getBottom() - deltaY);}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);normal.setEmpty();}// 是否需要开启动画public boolean isNeedAnimation() {return !normal.isEmpty();}// 是否需要移动布局public boolean isNeedMove() {int offset = inner.getMeasuredHeight() - getHeight();int scrollY = getScrollY();if (scrollY == 0 || scrollY == offset) {return true;}return false;}}

activity_main.xml

<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.example.myscrollview.IosScrollViewLayout        android:layout_width="match_parent"        android:layout_height="match_parent" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:orientation="vertical" >            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="仿IOS界面回弹效果" />        </LinearLayout>    </com.example.myscrollview.IosScrollViewLayout></RelativeLayout>

MainActivity.java

import android.app.Activity;import android.os.Bundle;public class MainActivity extends Activity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);}}

0 0