Android中SwipeBack实现右滑返回效果

现在有很多App支持右滑返回,比如知乎,效果比较赞。

于是自己对Activity和Fragment进行了继承,派生出SwipeBackActivity和SwipeBackFragment,用于对这种效果的实现,也就是只要继承这两个类就可以了。

效果如下

Activity

Fragment

Frgament的效果实现比Activity稍微简单,因为Activity要考虑到dectorView。

支持滑动的控件SwipeLayout,核心思路就是把原有的控件添加到支持滑动的控件中,SwipeLayout要注意计算手势速度,源码如下:

package com.ui.jerry.swipebackdemo; import android.content.Context; import android.util.AttributeSet; import android.util.Log; import android.view.LayoutInflater; import android.view.MotionEvent; import android.view.VelocityTracker; import android.view.View; import android.view.ViewConfiguration; import android.view.ViewGroup; import android.widget.LinearLayout; import android.widget.Scroller; import android.widget.Toast; public class SwipeLayout extends LinearLayout { public static final String TAG = "SwipeLayout"; private View mEmptyView; private View mContentView; private int mLeftEdge; private int mWidth; private int mMaxScrollX; private Scroller mScroller; private VelocityTracker mVelocityTracker = null; private int mMaxFlingVelocity; private int mLastX; ViewGroup.LayoutParams childParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT); private Context mContext; public static final int DURATION = 1500; //满屏滑动时间 public static final int OPEN_ANIM_DURATION = 1000; public static int SNAP_VELOCITY = 600; //最小的滑动速率 private OnFinishListener mOnFinishListener; public SwipeLayout(Context context) { this(context, null); } public SwipeLayout(Context context, AttributeSet attrs) { super(context, attrs); mContext = context; init(); } public void setOnFinishListener(OnFinishListener mOnFinishListener) { this.mOnFinishListener = mOnFinishListener; } void init() { mScroller = new Scroller(mContext); mMaxFlingVelocity = ViewConfiguration.get(mContext).getScaledMaximumFlingVelocity(); mWidth = DisplayUtils.getScreenWidth(mContext) * 2; mMaxScrollX = mWidth / 2; mLeftEdge = mMaxScrollX - mMaxScrollX / 3; setOrientation(LinearLayout.HORIZONTAL); childParams.width = DisplayUtils.getScreenWidth(mContext); mEmptyView = LayoutInflater.from(mContext).inflate(R.layout.view_translate, null); addView(mEmptyView, childParams); } public void setContentView(View contentView) { if (mContentView != null) { removeView(mContentView); } mContentView = contentView; addView(contentView, childParams); postDelayed(new Runnable() { @Override public void run() { openActivityAnimation(); } }, 200); } /** * 获取速度追踪器 * * @return */ private VelocityTracker getVelocityTracker() { if (mVelocityTracker == null) { mVelocityTracker = VelocityTracker.obtain(); } return mVelocityTracker; } /** * 回收速度追踪器 */ private void recycleVelocityTracker() { if (mVelocityTracker != null) { mVelocityTracker.clear(); mVelocityTracker.recycle(); mVelocityTracker = null; } } @Override public boolean onTouchEvent(MotionEvent ev) { //1.获取速度追踪器 getVelocityTracker(); //2.将当前事件纳入到追踪器中 mVelocityTracker.addMovement(ev); int pointId = -1; switch (ev.getAction()) { case MotionEvent.ACTION_DOWN: //如果屏幕的动画还没结束,你就按下了,我们就结束上一次动画,即开始这次新ACTION_DOWN的动画 // clearScrollHis(); mLastX = (int) ev.getX(); pointId = ev.getPointerId(0); break; case MotionEvent.ACTION_MOVE: int nextScrollX = (int) (mLastX - ev.getX() + getScrollX()); if (scrollTo(nextScrollX)) { mLastX = (int) ev.getX(); } break; case MotionEvent.ACTION_CANCEL: case MotionEvent.ACTION_UP: //3.计算当前速度 mVelocityTracker.computeCurrentVelocity(1000, mMaxFlingVelocity); //获取x y方向上的速度 float vX = mVelocityTracker.getXVelocity(pointId); Log.i(TAG, "mVelocityX:" + vX); //大于某个速率 直接滑动 if (vX > SNAP_VELOCITY) { scrollToLeft(); } else if (vX < -SNAP_VELOCITY) { scrollToRight(); } else { snapToDestation(); } //4.回收速度追踪器 recycleVelocityTracker(); break; } return true; } private void openActivityAnimation() { clearScrollHis(); mScroller.startScroll(getScrollX(), 0, mMaxScrollX - getScrollX(), 0, OPEN_ANIM_DURATION); invalidate();//这里必须调用invalidate()才能保证computeScroll()会被调用,否则不一定会刷新界面,看不到滚动效果 } public void closeActivityAnimation() { clearScrollHis(); mScroller.startScroll(getScrollX(), 0, -getScrollX(), 0, OPEN_ANIM_DURATION); invalidate();//这里必须调用invalidate()才能保证computeScroll()会被调用,否则不一定会刷新界面,看不到滚动效果 } private void clearScrollHis() { if (mScroller != null) { if (!mScroller.isFinished()) { mScroller.abortAnimation(); } } } /** * 根据现在的滚动位置判断 */ private void snapToDestation() { int scrollX = getScrollX(); if (scrollX > 0 && scrollX <= mLeftEdge) { smoothScrollTo(0); } else if (scrollX > mLeftEdge) { smoothScrollTo(mMaxScrollX); } } /** * 直接滚动 * * @param x * @return */ public boolean scrollTo(int x) { if (x < 0) { scrollTo(0, 0); } else if (x > mMaxScrollX) { scrollTo(mMaxScrollX, 0); } else { scrollTo(x, 0); } return true; } public void scrollToRight() { smoothScrollTo(mMaxScrollX); } public void scrollToLeft() { smoothScrollTo(0); } @Override protected void onScrollChanged(int l, int t, int oldl, int oldt) { super.onScrollChanged(l, t, oldl, oldt); Log.d(TAG, "left:" + l); if (l == 0) { Log.d(TAG, "OnFinish"); Toast.makeText(mContext, "Finished", Toast.LENGTH_SHORT).show(); if(mOnFinishListener!=null){ mOnFinishListener.onFinish(); } } } public void smoothScrollTo(int fx) { if (fx < 0) { smoothScrollTo(0, 0); } else if (fx > mMaxScrollX) { smoothScrollTo(mMaxScrollX, 0); } else { smoothScrollTo(fx, 0); } } // //调用此方法滚动到目标位置 public void smoothScrollTo(int fx, int fy) { int dx = fx - getScrollX(); int dy = fy - getScrollY(); smoothScrollBy(dx, dy); } //调用此方法设置滚动的相对偏移 public void smoothScrollBy(int dx, int dy) { //设置mScroller的滚动偏移量 mScroller.startScroll(getScrollX(), 0, dx, dy, Math.abs(dx * DURATION / mMaxScrollX)); invalidate();//这里必须调用invalidate()才能保证computeScroll()会被调用,否则不一定会刷新界面,看不到滚动效果 } @Override public void computeScroll() { //先判断mScroller滚动是否完成 if (mScroller.computeScrollOffset()) { //这里调用View的scrollTo()完成实际的滚动 scrollTo(mScroller.getCurrX(), mScroller.getCurrY()); //必须调用该方法,否则不一定能看到滚动效果 postInvalidate(); } super.computeScroll(); } /** * fragment或者activity 结束的接口 */ public interface OnFinishListener{ void onFinish(); } }

以上就是本文的全部内容,希望对大家的学习有所帮助。

时间: 2024-09-02 16:09:59

Android中SwipeBack实现右滑返回效果的相关文章

Android中SwipeBack实现右滑返回效果_Android

现在有很多App支持右滑返回,比如知乎,效果比较赞. 于是自己对Activity和Fragment进行了继承,派生出SwipeBackActivity和SwipeBackFragment,用于对这种效果的实现,也就是只要继承这两个类就可以了. 效果如下 Activity Fragment Frgament的效果实现比Activity稍微简单,因为Activity要考虑到dectorView. 支持滑动的控件SwipeLayout,核心思路就是把原有的控件添加到支持滑动的控件中,SwipeLayo

Android实现类似IOS右滑返回的效果(原因分析及解决办法)

使用类库SwipeBackLayout https://github.com/Issacw0ng/SwipeBackLayout 出现的问题: 1. 主Activity返回时黑屏或者返回只是看到桌面背景而没有看到上一个Activity界面 原因: 使用滑动返回需要在Activity的额主题中声明android:windowIsTranslucent=true,而该属性是设置Activity为是否为透明主题,当主Activity采用透明主题时,由于是app Activity栈中的第一个,所以滑动返

Android中viewPager+fragment实现滑页效果实例

效果图如下,手指在手机向左或者向右滑就可以实现相应的页面切换. 先看activity_main.xml文件,非常简单,主要是三个标题TextView和viewpager                                      我们再看看相应的MainActivity需要准备些什么 package com.example.keranbin.view.activity; import android.app.Activity; import android.os.Bundle; i

Android实现SwipeBack(右滑退出)效果

效果演示 初始状态 滑动中状态 结束状态 这是目前实现在SegmentFault for Android v2.6中的效果. 一切一切的之前,感谢 ikew0ng/SwipeBackLayout 我使用这个库,并经过一些修改,支持了Android 4.0以上所有的版本. 我们来分析下SwipeBackLayout的源码 一些修改 我之前做过实验,碰到的最大问题是上层的Activity底下并不是透明的,因此看不见下层Activity的视图. 在SwipeBackLayout中采用的方案是使用一个叫

Android右滑返回上一个界面的实现方法

Android右滑返回上一个界面的实现方法 public class BaseActivity extends Activity implements OnTouchListener { public ProgressDialog progressDialog; public String states; public RequestQueue mQueue; /** 触摸时按下的点 **/ PointF downP = new PointF(); /** 触摸时当前的点 **/ PointF

ios 系统导航条,右滑 返回 没效果

问题描述 ios 系统导航条,右滑 返回 没效果 5C 使用的是系统导航条,设置了代理,还是没用,back item 和leftitem 都试过了也没用,两个都不设置,直接用系统导航条的返回也是没用,不知道为什么?系统是7以上的 解决方案 重新启动一下电脑就行了,我的也是这样 解决方案二: 没有代码看不到问题啊 解决方案三: 重新启动(????ω????) 解决方案四: 不方便上代码吗???? 解决方案五: 就是赶快上代码就是赶快上代码就是赶快上代码

iOS系统右滑返回全局控制方案

前言 今天有个小需求,在点击导航条上的返回按钮之前要调用某个API,并弹出UIAlertView来显示,根据用户的选项判断是否是返回还是继续留在当前控制器.举个简单的例子,当点击导航条上的左上角返回按钮时,就调用我们的API来提示是否知道,点击知道则返回,点击不知道则继续留在当前控制器. 那么问题来了,导航自带的右滑返回手势在点击系统的返回按钮时,不会没有办法处理,那是自动的,因此就要想办法改成leftBarButtonItem了,但是使用了leftBarButtonItem就没有了右滑返回手势

Origami练习生II:Swipe实现右滑返回

  Origami官网Demo练习,Swipe Patch实现iOS的原生交互-右滑返回,Hit Patch动态区域模拟点触,Publish Port传送门. 继续官网第三个Demo,主要练习Swipe Patch的使用.练习的交互场景是点触进入界面然后右滑返回,右滑返回可以说是个很原生的操作,在demo中做了一点视觉上的优化. 在滑动的这个场景中,核心交互是Feed和Detail这两个界面的切换,Feed界面里有零散的界面元素,所以在切换的过程中,一定是一个整体参与变化.动画可以分解为两个部分

Android中利用viewflipper动画切换屏幕效果_Android

整个项目的 package com.example.viewflipper; import android.R.integer; import android.app.Activity; import android.os.Bundle; import android.util.Log; import android.view.GestureDetector.OnDoubleTapListener; import android.view.Menu; import android.view.Me