您好,登錄后才能下訂單哦!
本篇內容主要講解“android如何實現滑動解鎖”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“android如何實現滑動解鎖”吧!
效果圖
需要用到的畫筆, 整體灰色的背景, 滑塊, 滑動之后綠色背景, 字體
mSliPaint = new Paint(); mSliPaint.setColor(Color.parseColor("#4a4c5b")); mSliPaint.setAntiAlias(true); mBgPaint = new Paint(); mBgPaint.setColor(Color.parseColor("#a6a6a6")); mBgPaint.setAntiAlias(true); mBluePaint = new Paint(); mBluePaint.setColor(Color.parseColor("#009496")); mBluePaint.setAntiAlias(true); mPaint = new Paint(); mPaint.setColor(Color.WHITE); mPaint.setTextSize(mTextSize); //該方法即為設置基線上那個點究竟是left,center,還是right mPaint.setTextAlign(Paint.Align.LEFT);
在onDraw中繪制 mMovex為手指滑動的X坐標
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //背景色 RectF oval = new RectF(margin, margin, width - margin, height - margin);// 設置個新的長方形 canvas.drawRect(oval,mBgPaint); //劃過去背景色 RectF ovalBlue= new RectF(margin,margin,mMoveX+margin,mR*2+margin*3); canvas.drawRect(ovalBlue,mBluePaint); //文字 Paint.FontMetrics fontMetrics = mPaint.getFontMetrics(); float top = fontMetrics.top;//為基線到字體上邊框的距離 float bottom = fontMetrics.bottom;//為基線到字體下邊框的距離 int baseLineY = (int) (height / 2 - top / 2 - bottom / 2);//基線中間點的y軸計算公式 canvas.drawText(mText, mTextLeft, baseLineY, mPaint); //滑塊 RectF oval2 = new RectF(mMoveX+margin,margin,mMoveX+mR*3+margin*3,mR*2+margin*3);// 設置個新的長方形 canvas.drawRect(oval2,mSliPaint);//方形 //三個小箭頭 Bitmap bitmap = BitmapFactory.decodeResource(this.getContext().getResources(), R.mipmap.arrow_right_small); canvas.drawBitmap(bitmap,mMoveX+(mMoveX+mR*3+margin*3-mMoveX)/2-15,mR-margin,mSliPaint); canvas.drawBitmap(bitmap,mMoveX+(mMoveX+mR*3+margin*3-mMoveX)/2,mR-margin,mSliPaint); canvas.drawBitmap(bitmap,mMoveX+(mMoveX+mR*3+margin*3-mMoveX)/2+15,mR-margin,mSliPaint); }
onTouch中進行滑動監聽 負值
@Override public boolean onTouchEvent(MotionEvent event) { // Log.e(event.getAction()+""); // 點擊是否在滑塊上 if (event.getAction() != MotionEvent.ACTION_DOWN && !mSliderRect.contains((int) mStartX, (int) mStartY)) { if (event.getAction() == MotionEvent.ACTION_UP || event.getAction() == MotionEvent.ACTION_CANCEL) { mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); } return super.onTouchEvent(event); } acquireVelocityTrackerAndAddMovement(event); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: mStartX = event.getX(); mStartY = event.getY(); mLastX = mStartX; mHandler.removeMessages(MSG_REDRAW); // L.e("按下"); Log.e("SlideU","按下"); break; case MotionEvent.ACTION_MOVE: Log.e("SlideU","移動"); mLastX = event.getX(); if (mLastX > mStartX) { if (mLastX - mStartX > mSlidableLength) { mLastX = mStartX + mSlidableLength; mMoveX = mSlidableLength; } else { mMoveX = (int) (mLastX - mStartX); } } else { mLastX = mStartX; mMoveX = 0; } invalidate(); break; case MotionEvent.ACTION_UP: case MotionEvent.ACTION_CANCEL: Log.e("SlideU","超出或抬起"); mVelocityTracker.computeCurrentVelocity(1000, mMaxVelocity); float velocityX = mVelocityTracker.getXVelocity(); Log.e("SlideU","速度"+velocityX); if (mLastX - mStartX > mEffectiveLength || velocityX/2 > mEffectiveVelocity) { startAnimator(mLastX - mStartX, mSlidableLength, velocityX, true); } else { startAnimator(mLastX - mStartX, 0, velocityX, false); mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); } releaseVelocityTracker(); break; } return super.onTouchEvent(event); }
整體代碼
public class LoadAwaySlideUnlockView extends View { public interface UnlockListener { void onLoadAwayUnlock(); } private UnlockListener mUnlockListener; public void setUnlockListener(UnlockListener unlockListener) { mUnlockListener = unlockListener; } private static final int MSG_REDRAW = 1; private static final int DRAW_INTERVAL = 50; private static final int STEP_LENGTH = 10;//速度 private Paint mPaint;//文字的畫筆 private Paint mSliPaint;//滑塊畫筆 private Paint mBgPaint;//背景畫筆 private Paint mBluePaint;//劃過去之后藍色背景的畫筆 private VelocityTracker mVelocityTracker;//滑動速度 private int mMaxVelocity; private LinearGradient mGradient;//漸變色 private LinearGradient bgGradient;//背景漸變色 // private LinearGradient sliGradient;//滑塊漸變色 // LinearGradient有兩個構造函數; // // public LinearGradient(float x0, float y0, float x1, float y1, int[] colors, float[] positions,Shader.TileMode tile) // // 參數: // // float x0: 漸變起始點x坐標 // // float y0:漸變起始點y坐標 // // float x1:漸變結束點x坐標 // // float y1:漸變結束點y坐標 // // int[] colors:顏色 的int 數組 // // float[] positions: 相對位置的顏色數組,可為null, 若為null,可為null,顏色沿漸變線均勻分布 // // Shader.TileMode tile: 渲染器平鋪模式 // // // // public LinearGradient(float x0, float y0, float x1, float y1, int color0, int color1,Shader.TileMode tile) // // float x0: 漸變起始點x坐標 // // float y0:漸變起始點y坐標 // // float x1:漸變結束點x坐標 // // float y1:漸變結束點y坐標 // // int color0: 起始漸變色 // int color1: 結束漸變色 // // Shader.TileMode tile: 渲染器平鋪模式 private int[] mGradientColors; private int[] bgGradientColors; private int mGradientIndex; private Interpolator mInterpolator; private float mDensity; private Matrix mMatrix; private ValueAnimator mValueAnimator; private int width; private int height; private String mText;//文字 private int mTextSize;//文字大小 private int mTextLeft;//文字距離左邊 private int mR;//滑塊的半徑 private float margin; private Rect mSliderRect; private int mSlidableLength; // SlidableLength = BackgroundWidth - LeftMagins - RightMagins - SliderWidth private int mEffectiveLength; // Suggested length is 20pixels shorter than SlidableLength private float mEffectiveVelocity = 1000;//滑塊自動回滾的速度 private float mStartX; private float mStartY; private float mLastX; private float mMoveX; public LoadAwaySlideUnlockView(Context context) { this(context, null); } public LoadAwaySlideUnlockView(Context context, AttributeSet attrs) { this(context, attrs, 0); } public LoadAwaySlideUnlockView(Context context, AttributeSet attrs, int defStyleAttr) { this(context, attrs, defStyleAttr, 0); } public void setText(String text){ mText = text; } public LoadAwaySlideUnlockView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) { super(context, attrs, defStyleAttr, defStyleRes); mDensity = getResources().getDisplayMetrics().density; ViewConfiguration configuration = ViewConfiguration.get(context); mMaxVelocity = configuration.getScaledMaximumFlingVelocity(); mInterpolator = new AccelerateDecelerateInterpolator(); setClickable(true); setFocusable(true); setFocusableInTouchMode(true); mSlidableLength = 200; mTextSize = 30;//文字大小 mTextLeft = 10;//文字距離左邊 mMoveX = 0; mGradientIndex = 0; mSliPaint = new Paint(); mSliPaint.setColor(Color.parseColor("#4a4c5b")); mSliPaint.setAntiAlias(true); mBgPaint = new Paint(); mBgPaint.setColor(Color.parseColor("#a6a6a6")); mBgPaint.setAntiAlias(true); mBluePaint = new Paint(); mBluePaint.setColor(Color.parseColor("#009496")); mBluePaint.setAntiAlias(true); mPaint = new Paint(); mPaint.setColor(Color.WHITE); mPaint.setTextSize(mTextSize); //該方法即為設置基線上那個點究竟是left,center,還是right mPaint.setTextAlign(Paint.Align.LEFT); // mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int specWidthSize = MeasureSpec.getSize(widthMeasureSpec);//寬 int specHeightSize = MeasureSpec.getSize(heightMeasureSpec);//高 mMatrix = new Matrix(); width = specWidthSize; height = specHeightSize; mTextLeft = (int) (height * 1.5); margin = height / 20; mR = (int) (((height-margin*2) / 2)-margin); //最大滑動距離 mSlidableLength = (int) (specWidthSize -(mMoveX+mR*3+margin*3-mMoveX+margin)); //有效距離 mEffectiveLength = mSlidableLength-20; mSliderRect=new Rect((int)margin, (int)margin, 300, (int)(height - margin)); mGradientColors = new int[]{Color.argb(255, 120, 120, 120), Color.argb(255, 120, 120, 120), Color.argb(255, 255, 255, 255)}; mGradient = new LinearGradient(0, 0, width/2, 0, mGradientColors, new float[]{0, 0.7f, 1}, Shader.TileMode.MIRROR); bgGradient = new LinearGradient( 0, 0, 0, (float) ((height)/2.0), Color.argb(80, 0X77, 0X77, 0X77), Color.argb(200, 0X11, 0X11, 0X11), Shader.TileMode.CLAMP ); mHandler.removeMessages(MSG_REDRAW); mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //背景色 RectF oval = new RectF(margin, margin, width - margin, height - margin);// 設置個新的長方形 canvas.drawRect(oval,mBgPaint); //劃過去背景色 RectF ovalBlue= new RectF(margin,margin,mMoveX+margin,mR*2+margin*3); canvas.drawRect(ovalBlue,mBluePaint); //文字 Paint.FontMetrics fontMetrics = mPaint.getFontMetrics(); float top = fontMetrics.top;//為基線到字體上邊框的距離 float bottom = fontMetrics.bottom;//為基線到字體下邊框的距離 int baseLineY = (int) (height / 2 - top / 2 - bottom / 2);//基線中間點的y軸計算公式 canvas.drawText(mText, mTextLeft, baseLineY, mPaint); //滑塊 RectF oval2 = new RectF(mMoveX+margin,margin,mMoveX+mR*3+margin*3,mR*2+margin*3);// 設置個新的長方形 canvas.drawRect(oval2,mSliPaint);//方形 //三個小箭頭 Bitmap bitmap = BitmapFactory.decodeResource(this.getContext().getResources(), R.mipmap.arrow_right_small); canvas.drawBitmap(bitmap,mMoveX+(mMoveX+mR*3+margin*3-mMoveX)/2-15,mR-margin,mSliPaint); canvas.drawBitmap(bitmap,mMoveX+(mMoveX+mR*3+margin*3-mMoveX)/2,mR-margin,mSliPaint); canvas.drawBitmap(bitmap,mMoveX+(mMoveX+mR*3+margin*3-mMoveX)/2+15,mR-margin,mSliPaint); } public void reset() { if (mValueAnimator != null) { mValueAnimator.cancel(); } mMoveX = 0; mPaint.setAlpha(255); mHandler.removeMessages(MSG_REDRAW); mHandler.sendEmptyMessageDelayed(MSG_REDRAW,200); } @Override public boolean onTouchEvent(MotionEvent event) { // Log.e(event.getAction()+""); // 點擊是否在滑塊上 if (event.getAction() != MotionEvent.ACTION_DOWN && !mSliderRect.contains((int) mStartX, (int) mStartY)) { if (event.getAction() == MotionEvent.ACTION_UP || event.getAction() == MotionEvent.ACTION_CANCEL) { mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); } return super.onTouchEvent(event); } acquireVelocityTrackerAndAddMovement(event); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: mStartX = event.getX(); mStartY = event.getY(); mLastX = mStartX; mHandler.removeMessages(MSG_REDRAW); // L.e("按下"); Log.e("SlideU","按下"); break; case MotionEvent.ACTION_MOVE: Log.e("SlideU","移動"); mLastX = event.getX(); if (mLastX > mStartX) { if (mLastX - mStartX > mSlidableLength) { mLastX = mStartX + mSlidableLength; mMoveX = mSlidableLength; } else { mMoveX = (int) (mLastX - mStartX); } } else { mLastX = mStartX; mMoveX = 0; } invalidate(); break; case MotionEvent.ACTION_UP: case MotionEvent.ACTION_CANCEL: Log.e("SlideU","超出或抬起"); mVelocityTracker.computeCurrentVelocity(1000, mMaxVelocity); float velocityX = mVelocityTracker.getXVelocity(); Log.e("SlideU","速度"+velocityX); if (mLastX - mStartX > mEffectiveLength || velocityX/2 > mEffectiveVelocity) { startAnimator(mLastX - mStartX, mSlidableLength, velocityX, true); } else { startAnimator(mLastX - mStartX, 0, velocityX, false); mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); } releaseVelocityTracker(); break; } return super.onTouchEvent(event); } private void startAnimator(float start, float end, float velocity, boolean isRightMoving) { if (velocity < mEffectiveVelocity) { velocity = mEffectiveVelocity; } int duration = (int) (Math.abs(end - start) * 1000 / velocity); mValueAnimator = ValueAnimator.ofFloat(start, end); mValueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { mMoveX = (Float) animation.getAnimatedValue(); invalidate(); } }); mValueAnimator.setDuration(duration); mValueAnimator.setInterpolator(mInterpolator); if (isRightMoving) { mValueAnimator.addListener(new Animator.AnimatorListener() { @Override public void onAnimationStart(Animator animation) { } @Override public void onAnimationEnd(Animator animation) { // L.e("解鎖"); Log.e("SlideU","解鎖"); if (mUnlockListener != null) { mUnlockListener.onLoadAwayUnlock(); } } @Override public void onAnimationCancel(Animator animation) { } @Override public void onAnimationRepeat(Animator animation) { } }); } mValueAnimator.start(); } private void acquireVelocityTrackerAndAddMovement(MotionEvent ev) { if (mVelocityTracker == null) { mVelocityTracker = VelocityTracker.obtain(); } mVelocityTracker.addMovement(ev); } private void releaseVelocityTracker() { if (mVelocityTracker != null) { mVelocityTracker.recycle(); mVelocityTracker = null; } } private Handler mHandler = new Handler() { public void handleMessage(Message msg) { super.handleMessage(msg); switch (msg.what) { case MSG_REDRAW: if(mMatrix==null){ mMatrix = new Matrix(); } mMatrix.setTranslate(mGradientIndex, 0); if(mGradient==null){ // L.e("mGradient空"); mGradientColors = new int[]{Color.argb(255, 120, 120, 120), Color.argb(255, 120, 120, 120), Color.argb(255, 255, 255, 255)}; mGradient = new LinearGradient(0, 0, width/2, 0, mGradientColors, new float[]{0, 0.7f, 1}, Shader.TileMode.MIRROR); } mGradient.setLocalMatrix(mMatrix); invalidate(); mGradientIndex += STEP_LENGTH ; if(mGradientIndex>=Integer.MAX_VALUE){ mGradientIndex = 0; } mHandler.sendEmptyMessageDelayed(MSG_REDRAW, DRAW_INTERVAL); break; } } }; }
xml布局
<xxxx.LoadAwaySlideUnlockView android:id="@+id/slideUnlock" android:layout_marginLeft="3dp" android:layout_marginRight="3dp" android:layout_width="match_parent" android:layout_height="56dp"/>
activity中 添加提示文字和滑動監聽即可
slideUnlock.setText("中間提示文字"); slideUnlock.setSlideListener(this);
到此,相信大家對“android如何實現滑動解鎖”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。