欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

程序员文章站 2022-07-23 15:43:10
效果分析: 仔细分析效果图发现,锁屏控件需要绘制的有三个部分,分别是: 1.图案点,图案点有四种状态,分别是默认、选中、正确和错误 2.图案点之间的连线 连线会根据1中点的状态改变发生颜色上的变化 3.悬空线段 就是图案点和悬空点之间的线段 实现: View的状态用一个枚举类型来表示: View的状 ......

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

效果分析:

仔细分析效果图发现,锁屏控件需要绘制的有三个部分,分别是:

1.图案点,图案点有四种状态,分别是默认、选中、正确和错误

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

2.图案点之间的连线

连线会根据1中点的状态改变发生颜色上的变化

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

3.悬空线段

就是图案点和悬空点之间的线段

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

实现:

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

View的状态用一个枚举类型来表示:

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

View的状态通过暴露一个方法给LockScreenViewGroup来进行设置。

在onDraw方法中判断类型,进行绘制:

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

这里在选中时用属性动画做了一个放大效果,在下次恢复正常的时候要将大小恢复回去

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

在构造函数中解析xml中的自定义属性:

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

这里有两个地方需要注意一下:

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

(3)在Up状态时,根据答案的正确与否,对LockScreenView设置不同的状态,并且对悬空线段起始点进行重置

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

在onTouchEvent方法最后会调用invalidate方法对视图进行重绘,这时会调用dispatchDraw方法进行子View的绘制。

在dispatchDraw方法中进行图像点间的线段路径以及悬空线段的绘制:

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

天才程序员教你写一个手势就能解锁的控件!是不是非常神奇!

最后附上源代码,文章来源:烧饼正努力

欢迎大家关注我的博客:https://home.cnblogs.com/u/sm123456/

欢迎大家加入千人交流答疑群:125240963