前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >android自定义滑块解锁,android 滑动解锁

android自定义滑块解锁,android 滑动解锁

作者头像
全栈程序员站长
发布于 2022-09-07 08:36:24
发布于 2022-09-07 08:36:24
2K0
举报

大家好,又见面了,我是你们的朋友全栈君。

通过android自定义View实现横向的滑动解锁,1、滑动到中间会自动返回到原始的位置,2、滑动到底部会自动解锁,会触发解锁的回调;首先看效果图如下:

实现以上部分一共分为三部分:

其中背景通过shape.xml实现

滑动的锁是一张图片

文字通过Paint绘制在中间,高度可定制

主要介绍一下实现的主要部分:

(1)有自定义的属性如下:

(2)重写ondraw()方法,绘制文字和锁:

@Overrideprotected void onDraw(Canvas canvas)

{

canvas.getClipBounds(mTipsTextRect);

int cHeight = mTipsTextRect.height();

int cWidth = mTipsTextRect.width();

mPaint.setTextAlign(Paint.Align.LEFT);

mPaint.getTextBounds(mTipText, 0, mTipText.length(), mTipsTextRect);

float x = cWidth / 2f – mTipsTextRect.width() / 2f – mTipsTextRect.left;

float y = cHeight / 2f + mTipsTextRect.height() / 2f – mTipsTextRect.bottom;

canvas.drawText(mTipText, x, y, mPaint);

int rightMax = getWidth() – mLockRadius * 2;

if (mLocationX < 0) {

canvas.drawBitmap(mLockBitmap, 0, 0, mPaint);

} else if (mLocationX > rightMax) {

canvas.drawBitmap(mLockBitmap, rightMax, 0, mPaint);

} else {

canvas.drawBitmap(mLockBitmap, mLocationX, 0, mPaint);

}

}

(3)最重要的一步是触摸事件的处理,1、当触摸屏幕是触发ACTION_DOWN事件,计算时候触摸到锁,只有当触到锁的时候才能滑动;2、手指移动时,获得新的位置后计算新的位置,然后重新绘制,若移动到另一端表示解锁成功,执行回调方法解锁成功;3、手指离开屏幕后重新reset View,动画回到初始位置:

@Override

public boolean onTouchEvent(MotionEvent event) {

switch (event.getAction()) {

case MotionEvent.ACTION_DOWN: {

float xPos = event.getX();

float yPos = event.getY();

if (isTouchLock(xPos, yPos)) {

mLocationX = xPos – mLockRadius;

mIsDragable = true;

invalidate();

} else {

mIsDragable = false;

}

return true;

}

case MotionEvent.ACTION_MOVE: {

if (!mIsDragable) return true;

int rightMax = getWidth() – mLockRadius * 2;

resetLocationX(event.getX(),rightMax);

invalidate();

if (mLocationX >= rightMax){

mIsDragable = false;

mLocationX = 0;

invalidate();

if (mLockListener != null){

mLockListener.onOpenLockSuccess();

}

Log.e(“AnimaterListener”,”解锁成功”);

}

return true;

}

case MotionEvent.ACTION_UP: {

if (!mIsDragable) return true;

resetLock();

break;

}

}

return super.onTouchEvent(event);

}

(4)重新回到初始位置resetLock代码如下:

private void resetLock(){

ValueAnimator anim = ValueAnimator.ofFloat(mLocationX,0);

anim.setDuration(300);

anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

@Override

public void onAnimationUpdate(ValueAnimator valueAnimator) {

mLocationX = (Float) valueAnimator.getAnimatedValue();

invalidate();

}

});

anim.start();

}

这就是完成滑动解锁的主要步骤,最后github地址在SlideView

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/148688.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
Android项目实战(二十三):仿QQ设置App全局字体大小
一、项目需求: 因为产品对象用于中老年人,所以产品设计添加了APP全局字体调整大小功能。 这里仿做QQ设置字体大小的功能。 QQ实现的效果是,滚动下面的seekbar,当只有seekbar到达某一个刻
听着music睡
2018/05/18
2.4K0
Android 自定义一个简单的刮奖 View
使用相对布局,先写一个 TextView,然后自定义一个 EraseView,写一个同样大小的 EraseView 覆盖在 TextView 上面即可。
程序员飞飞
2020/02/29
6970
Android自定义控件之滑动解锁
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/149102.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/12
2.1K0
Android自定义控件之滑动解锁
android 打造不同的Seekbar
最近项目需要用到双向的seekbar,网上找了好多野不能达到要求,偶然一次机会看到了大众点评的例子,然后我最他做了优化,并对常用的seekbar做了总结. 向上两张图: 比如双向seekbar pub
xiangzhihong
2018/02/02
1.6K0
android 打造不同的Seekbar
Android进阶之绘制-自定义View完全掌握(四)
前面的案例中我们都是使用系统的一些控件通过组合的方式来生成我们自定义的控件,自定义控件的实现还可以通过自定义类继承View来完成。从该篇博客开始,我们通过自定义类继承View来实现一些我们自定义的控件。 我们通过一个案例来学习,现在来实现这样一个效果。
wangweijun
2020/01/20
5580
Android利用SRC_OUT模式下的Xfermode实现刮刮卡效果
和橡皮擦相同,只是在最下层加一个显示结果的图片 private Bitmap bitmapRes, bitmapSrc, bitmapDst; private Paint mPaint = new Paint(); private Paint pathPaint = new Paint(); private Path path = new Path(); //透明画布 private Canvas dstCanvas; public Guaguak
aruba
2020/07/02
8430
Android利用SRC_OUT模式下的Xfermode实现刮刮卡效果
Android自定义控件之局部图片放大镜--BiggerView
零、前言: 本文的知识点一览 1.自定义控件及自定义属性的写法,你也将对onMesure有更深的认识 2.关于bitmap的简单处理,及canvas区域裁剪 3.本文会实现两个自定义控件:Fi
张风捷特烈
2018/11/21
2.4K0
相关推荐
Android项目实战(二十三):仿QQ设置App全局字体大小
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档