2024年安卓最新Android-高级-UI-进阶之路-(一)-View-的基础知识你必须知道(1),android高级开发面试题

分享读者

作者2013年java转到Android开发,在小厂待过,也去过华为,OPPO等大厂待过,18年四月份进了阿里一直到现在。

被人面试过,也面试过很多人。深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,不成体系的学习效果低效漫长,而且极易碰到天花板技术停滞不前!

我们整理了一份阿里P7级别的Android架构师全套学习资料,特别适合有3-5年以上经验的小伙伴深入学习提升。

主要包括腾讯,以及字节跳动,阿里,华为,小米,等一线互联网公司主流架构技术。

腾讯T3架构师学习专题资料

如果你觉得自己学习效率低,缺乏正确的指导,可以一起学习交流!

我们致力打造一个平等,高质量的Android交流圈子,不一定能短期就让每个人的技术突飞猛进,但从长远来说,眼光,格局,长远发展的方向才是最重要的。

35岁中年危机大多是因为被短期的利益牵着走,过早压榨掉了价值,如果能一开始就树立一个正确的长远的职业规划。35岁后的你只会比周围的人更值钱。

网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友,可以戳这里获取

一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!

val velocityTracker = VelocityTracker.obtain()
velocityTracker.addMovement(event)
复制代码

接着,当我们先知道当前的滑动速度时,这个时候可以采用如下方式来获得当前的速度:

velocityTracker.computeCurrentVelocity(1000)
val xVelocity = velocityTracker.getXVelocity()
val yVelocity = velocityTracker.getYVelocity()
复制代码

这一步有 2 点需要注意,其一 获取速度之前必须先计算速度,既 getXVelocity 和 getYVelocity 这两个方法的前面必须要调用 computeCurrentVelocity 方法,第二点,这里的速度是指一段时间内手指所滑过的像素值,比如将时间间隔设为 1000 ms 时,那么就是在 1s 内手指在水平方向从左向右滑动 500 px 那么水平速度就是 500,注意速度可以为负数,当手指从右往左滑动时,水平方向速度即为负值,这个需要理解一下。速度的计算可以用如下公式:

速度 = ( 终点位置 - 起点位置) / 时间段

根据上面的公式再加上 Android 系统的坐标体系,可以知道,手指逆着坐标系的正方向滑动,所产生的速度就为负值,另外,computeCurrentVelocity 这个方法的参数表示的是一个时间单元或者说时间间隔,它的单位是毫秒 (ms), 计算速度时得到的速度就是在这个时间间隔内手指在水平或竖直方向上所滑动的像素值。

针对上面的例子,如果我们通过 obtain.computeCurrentVelocity(1000) 来获取速度,那么得到的速度就是手指在 1000 ms 毫秒内所滑过的 px 值,因此可以直接套上面公式:

水平速度 = 500 px / 每 1000 ms

既水平速度为 500 , 这里需要好好理解一下。

最后,当不需要它的时候,需要调用 clear 方法来重置并回收内存:

velocityTracker.clear()
velocityTracker.recycle()
复制代码

VelocityTracker 的 API 简单明了,我们可以记住一个套路。

  1. 在触摸事件为 ACTION_DOWN或是进入 onTouchEvent方法时,通过 obtain获取一个 VelocityTracker
  2. 在触摸事件为 ACTION_UP时,调用 recycle进行释放 VelocityTracker
  3. 在进入 onTouchEvent方法或将 ACTION_DOWNACTION_MOVEACTION_UP的事件通过 addMovement方法添加进 VelocityTracker
  4. 在需要获取速度的地方,先调用 computeCurrentVelocity方法,然后通过 getXVelocitygetYVelocity获取对应方向的速度

解锁更多姿势可以参考该文章

GestureDetector

GestureDetector 的作用用于辅助检测用户的单机、滑动、长按、双击等行为。要使用 GestureDetector 也不复杂,参考如下过程:

  1. 首先创建一个 GestureDetector 对象并实现 OnGestureListener 接口,根据需要我们还可以实现 OnDoubleTapListener 从而能够监听双击行为;

val mGetDetector = GestureDetector(context,this)
//解决长按屏幕后无法拖动的现象
mGetDetector.setIsLongpressEnabled(false)
复制代码

  1. 接管目前 View 的 onTouchEvent 方法,在 View 的 onTouchEvent 方法中添加如下代码:

override fun onTouchEvent(event: MotionEvent) = mGetDetector.onTouchEvent(event)
复制代码

做完了上面这 2 步,我们就可以有选择的实现 OnGestureListener 和 OnDoubleTapListener 中的方法了,这 2 个接口中的方法介绍如下所示:

OnGestureListener / 方法名描述
onDown手指轻轻触摸屏幕的一瞬间,由 1 个 ACTION_DOWN 触发
onShowPress手指轻轻触摸屏幕, 尚未松开或拖动,由一个 ACTION_DOWN 触发,它强调的是没有松开或者拖动的状态
onSingleTapUp手指(轻轻触摸屏幕后)松开,伴随着 1 个 MotinEvent.ACTION_UP 而触发,这是单击行为
onScroll手指按下屏幕并拖动,由 1 个 ACTION_DOWN ,多个 ACTION_MOVE 触发,这是拖动行为
onLongPress用户长久的按着屏幕不放,既长按
onFling用户按下触摸屏、快速滑动后松开,由 1 个 ACTION_DOWN 、多个 ACTION_MOVE 和 1 个 ACTION_UP 触发,这是快速滑动行为
OnDoubleTapListener / 方法名描述
onDoubleTap双击,由 2 次连续的单击组成,它不可能和 onSingleTapConfirmed 共存
onSingleTapConfirmed严格的单机行为(注意它和 onSingleTapUp 的区别,如果触发了 onSingleTapConfirmed, 那么后面不可能再紧跟着另一个单击行为,既这只可能是单击,而不可能是双击中的一次单击)
onDoubleTapEvent表示发生了双击行为,在双击的期间, ACTION_DOWN 、ACTION_MOVE 和 ACTION_UP 都会触发此回调

上面图表里面的方法很多,但是并不是所有的方法都会被时常用到,在日常开发中,比较常用的有 onSingleTapUp 单击、onFling 快速滑动 、onScroll 拖动 、onLongPress 长按、onDoubleTap 双击 。另外在说一下,在实际开发中,可以不使用 GestureDector, 完全可以自己在 View 的 OnTouchEvent 方法中实现所需要的监听,这个看实际场景跟个人喜好了。

Scroller

Scroller 用于实现 View 的弹性滑动。我们知道,当使用 View 的 scrollTo / scrollBy 方法进行滑动时,其过程是瞬间完成的,没有一个过渡的效果体验是不友好的,那么这个时候就可以借助 Scroller 来实现过渡效果的滑动。Scroller 本身无法让 View 弹性滑动,它需要和 View 的 computeScroll 方法配合使用才能共同完成这个功能。那么如何使用 Scroller 呢?它的典型代码可以说是固定的,如下所示:

class ScrollerSample_1 : LinearLayout {

constructor(context: Context, attrs: AttributeSet?) : super(context, attrs)

constructor(context: Context) : super(context)

/**

  • 定义滑动 Scroller
    */
    private val mScroller = Scroller(context)

public fun smoothScrollTo(destX: Int = -100, destY: Int = -100) {
//滑动了的位置
val scrollX = scrollY;
val delta = destY - scrollY;
//2000 ms 内滑动到 destX 位置,效果就是缓慢滑动
mScroller.startScroll(scrollX, 0, 0, delta, 2000)
invalidate()
}

override fun computeScroll() {
if (mScroller.computeScrollOffset()) {
scrollTo(mScroller.currX, mScroller.currY)
postInvalidate()
}
}
}
复制代码

主要实现有 3 步:

  • 第一步实例化 Scroller

  • 第一步调用 Scroller 的 startScroll 方法,让其内部保存新的变量值

  • 第二步重写 View 的 computeScroll 方法,调度自身的 scrollTo 方法,让其缓慢弹性滑动

View 的滑动

上面咱们介绍了 View 的一些基本知识和一些位置参数概念,该小节将来介绍一个重要的内容 View 的滑动

现在市面上所有软件应该几乎都具备滑动的功能吧?可以说滑动功能是一个 APP 的标配,滑动在 Android 开发中具有很重要的作用,因此,掌握滑动的方法是实现优化用户体验的基础。滑动可以通过以下三种方式来实现,当然并不是只有三种,其它还得靠自己去挖掘。其方式如下:

  1. 通过 View 本身提供的 scrollTo / scrollBy 方法来实现滑动(上一小节咱们已经用到 scrollTo 方法了)
  2. 通过动画给 View 施加平移效果来实现滑动
  3. 通过改变 View 的位置参数

scrollTo、scrollBy

为了实现 View 的滑动看,自身专门提供了 scrollTo 和 scrollBy 方法来实现,如下所示:

//View.java
public void scrollTo(int x, int y) {
/**

  • 传入的位置跟自己目前所滑动的位置不一致才开始滑动
    */
    if (mScrollX != x || mScrollY != y) {
    int oldX = mScrollX;
    int oldY = mScrollY;
    mScrollX = x;
    mScrollY = y;
    invalidateParentCaches();
    onScrollChanged(mScrollX, mScrollY, oldX, oldY);
    if (!awakenScrollBars()) {
    postInvalidateOnAnimation();
    }
    }
    }

public void scrollBy(int x, int y) {
/**

  • 其内部也是调用了 View 的 scrollTo 方法,把当前滑动的 mScrollX,mScrollY 分别加上指定的位 * 置,然后滑动,多次调用相当于接着上一次位置滑动
    */
    scrollTo(mScrollX + x, mScrollY + y);
    }

通过上面的源码我们知道 scrollBy 方法内部是调用了 scrollTo 方法,那么他们之前有什么区别呢?请看下面分析:

scrollTo: 基于所传递的 x , y 坐标来进行绝对滑动,重复点击如果不改变滑动参数,那么内部就会做判断,相等就不会再滑动了。

scrollBy: 通过源码我们知道内部调用了 scrollTo 方法传递了 mScrollX + x, mScrollY + y 那么这是什么意思呢?其实就是基于当前的位置来做的相对滑动。重复点击滑动会继续在当前所在的位置上继续滑动。

还有一个知识点我们要知道,就是这里出现了 2 个默认的变量 mScrollX , mScrollY 通过 scrollTo 内部实现我们知道,其传递进去的 x,y 分别赋值给了 mScrollX 和 mScrollY 那么它们在这里这么做的具体含义是什么呢?它们可以通过 getScrollX 和 getScrollY 来获取具体的值。下面我们就来具体分析下:

mScrollX: 在滑动过程中,mScrollX 的值总是等于 View 左边缘和 View 内容左边缘在水平方向的距离。并且当 View 左边缘在 View 内容左边缘的右边时, mScrollX 值为正,反之为负,通俗的来讲就是如果从左向右滑动,那么 mScrollX 为 负值,反之为正值。

mScrollY: 在滑动过程中,mScrollY 的值总是等于 View 上边缘和 View 内容上边缘在水平方向的距离。并且当 View 上边缘在 View 内容上边缘下边时,mScrollY 为正,反之为负,通俗的来讲就是如果从上往下滑动,那么 mScrollY 为负值,反之为正值。

上面解释了这么多,为了更好的理解我这里就画一张水平跟竖值方向都滑动了 100 px, 然后来看对应的 mScrollX 和 mScrollY 值是多少,请看下图:

注意: 在使用 scrollBy / scrollTo 对 View 滑动时,只能将 View 的内容进行移动,并不能将 View 本身进行移动。

使用动画

上一小节我们知道可以采用 View 自身的 scrollTo / scrollBy 方法来实现滑动功能,本小节介绍另外一个实现滑动的方式,即使用动画,通过动画我们能够让一个 View 进行平移,而平移就是一种滑动。使用动画来移动 View ,主要是操作 View 的 translationX 和 translationY 属性,可以采用传统的 View 动画,也可以使用属性动画,如果采用属性动画注意要兼容 3.0 一下版本,当然现在都 androidX 版本了,可以看实际项目情况来具体处理,实现滑动的平移代码如下:

  1. 采用 View 动画,将 View 在 100ms 内从原始位置向右下角移动 100 px
<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android=“http://schemas.android.com/apk/res/android”
android:fillAfter=“true”



复制代码

注意: View 动画并不能真正改变 View 的位置。

  1. 采用属性动画,将 View 在 100ms 内从原始位置向右平移 100 px

//动画属性有 translationX 、translationY 、alpha 、rotation、rotationX、rotationY 、scaleX、scaleY
val objAnimator = ObjectAnimator.ofFloat(View targetView,“translationX”,0f,100f).setDuration(100).start()
复制代码

改变 View LayoutParams

本小节将介绍第三种实现 View 滑动的方法,那就是直接改变布局参数,即 LayoutParams。比如我们想把一个 LinearLayout 向右平移 100px 只需要将它的 LayoutParams 内部的 marginLeft 参数的值增加 100 px 就行,代码如下:

val layoutParams = scroller.layoutParams as LinearLayout.LayoutParams
layoutParams.let {
it.leftMargin += 100
it.weight += 100
}
scroller.requestLayout()
复制代码

通过改变 LinearLayout 的 LayoutParams 参数同样也实现了 View 的滑动。

滑动方式对比

上面分别介绍了 3 种不同的滑动方式,它们都能实现 View 的滑动,那么它们之间的差异是什么呢?请看下表:

实现方式优点缺点
scrollTo/scrollBy专门用于 View 的滑动,比较方便地实现滑动效果且不影响自身的单机事件只能滑动 View 的内容,不能滑动 View 本身
动画复杂动画使用属性动画来完成比较简单View 动画不能改变自身属性
改变布局参数使用不简洁

针对上面情况这里做一个小总结:

  • scrollTo/scrollBy 操作简单,适合对 View 内容的滑动
  • 动画操作简单,主要适合用于没有交互的 View 和实现复杂的动画效果
  • 改变布局参数操作稍微复杂,适用于有交互的 View

弹性滑动

知道了 View 如何滑动,我们还要知道如何实现 View 的弹性滑动,比较生硬的滑动体验确实很差,下面我们介绍 View 如何实现弹性滑动

使用 Scroller

请参考该篇 View基础知识#Scroller 介绍

通过动画

利用动画的特性来实现一些动画不能实现的效果,模仿 Scroller 来实现 View 的弹性滑动,代码如下:

val valueAnimator = ValueAnimator.ofInt(0, 1).setDuration(2000);
valueAnimator.addUpdateListener {
val animatedFraction = it.animatedFraction
scroller.scrollTo(- (100 * animatedFraction).toInt(), 0)
}
valueAnimator.start()

在上述代码中,我们的动画本质上没有作用于任何对象上,它只是在 2s 内完成了整个动画过程,利用这个特性我们就可以在动画的每一帧到来时获取动画完成的比例,然后根据这个比例计算滑动的距离。

通过延时策略

该小节我们继续介绍另一种实现弹性滑动的效果,即延时策略,它的核心思想是通过发送一系列延时消息从而达到一种渐近式的效果,代码如下:

val MESSAGE_SCROLLER_TO = 1;
val FRAME_COUNT = 30;
val DELAYED_TIME = 33L;
var mCount = 0;
private val mHandler = object : Handler() {
override fun handleMessage(msg: Message) {
super.handleMessage(msg)
when (msg.what) {
MESSAGE_SCROLLER_TO -> {
mCount++
if (mCount <= FRAME_COUNT) {
val fraction = mCount / FRAME_COUNT.toFloat()
val scrollX = (fraction * 100).toInt()
scroller.scrollTo(scrollX, 0)
sendEmptyMessageDelayed(MESSAGE_SCROLLER_TO, DELAYED_TIME)
}
}

}
}
}

其效果都是一样的,这里就不再贴效果了,在实际中可以根据项目需求或灵活性来选择到底使用哪一种来实现弹性滑动。

基础知识就讲到这里了,下面基于我们所学的基础知识练习几道关于滑动的自定义 View

运用所学知识进行实战

这里由浅到深的案例练习。

1. View 随着手指移动

public class SlideView1(context: Context?, attrs: AttributeSet?) : View(context, attrs) {

/**

  • 记录上次滑动的坐标
    */
    private var mLastX = 0;
    private var mLastY = 0;

/**

  • 初始化画笔
    */
    val paint = Paint().apply {
    color = Color.BLACK
    isAntiAlias = true
    strokeWidth = 3f
    }

override fun onTouchEvent(event: MotionEvent): Boolean {
when (event.action) {
MotionEvent.ACTION_DOWN -> {
//拿到相对于屏幕按下的坐标点
mLastX = event.getX().toInt();
mLastY = event.getY().toInt();
println(“拿到相对于屏幕按下的坐标点: x: m L a s t X y : mLastX y: mLastXy:mLastY”)

}
MotionEvent.ACTION_MOVE -> {
var offsetX = event.getX().toInt() - mLastX;//计算 View 新的摆放位置
var offsetY = event.getY().toInt() - mLastY;
//重新放置新的位置
layout(getLeft() + offsetX, getTop() + offsetY, getRight() + offsetX, getBottom() + offsetY);
}

MotionEvent.ACTION_UP -> {

}
}
return true//消耗触摸事件
}

override fun onDraw(canvas: Canvas) {
super.onDraw(canvas)
canvas.drawCircle(300f, 300f, 150f, paint)
}

}

第二种 setX/setY 方式

public class SlideView2(context: Context?, attrs: AttributeSet?) : View(context, attrs) {

/**

  • 记录上次滑动的坐标
    */
    private var mLastX = 0;
    private var mLastY = 0;

private val mScroller = Scroller(context)

/**

  • 初始化画笔
    */
    val paint = Paint().apply {
    color = Color.BLACK
    isAntiAlias = true
    strokeWidth = 3f
    }

override fun onTouchEvent(event: MotionEvent): Boolean {
when (event.action) {
MotionEvent.ACTION_DOWN -> {
//拿到相对于屏幕按下的坐标点
mLastX = event.getRawX().toInt();
mLastY = event.getRawY().toInt();
println(“拿到相对于屏幕按下的坐标点: x: m L a s t X y : mLastX y: mLastXy:mLastY”)

}
MotionEvent.ACTION_MOVE -> {
//1
// x = event.getRawX() - mLastX
// y = event.getRawY() - mLastY

//2
translationX = event.getRawX() - mLastX
translationY = event.getRawY() - mLastY
}

MotionEvent.ACTION_UP -> {

}
}
return true//消耗触摸事件
}

override fun onDraw(canvas: Canvas) {
super.onDraw(canvas)
canvas.drawCircle(300f, 300f, 150f, paint)
}
}
复制代码

第二种方法是调用 View 的 setX、setY 其实内部就是调用的是 setTranslationX、setTranslationY 这 2 中方式其实都一样 setX 内部也会调用 setTranslationX,可以看一下源码,如下:

//View.java
public void setX(float x) {
setTranslationX(x - mLeft);
}

这里为了演示效果,代码没有做边界判断,下来感兴趣的可以自己去研究,还有其它随着手指滑动的实现就靠自己去发掘了。

2.高仿 ViewPager

下面就以 Scroller 来实现一个简版的 ViewPager 效果,要实现 Scroller 效果其固定步骤如下:

  1. 创建 Scroller 的实例
  2. 调用 startScroll() 方法来初始化滚动数据并刷新界面
  3. 重写 computeScroll() 方法,并在其内部完成平滑滚动的逻辑

/**

  • author  : devyk on 2019-11-16 19:23
    
  • blog    : https://juejin.im/user/578259398ac2470061f3a3fb/posts
    
  • github  : https://github.com/yangkun19921001
    
  • mailbox : yang1001yk@gmail.com
    
  • desc    : This is ScrollerViewPager
    

/
class ScrollerViewPager(context: Context?, attrs: AttributeSet?) : ViewGroup(context, attrs) {
/
*

  • 第一步 定义 Scroller 实例
    */
    private var mScroller = Scroller(context)

/**

  • 判断拖动的最小移动像素点
    */
    private var mTouchSlop = 0

/**

  • 手指按下屏幕的 x 坐标
    */
    private var mDownX = 0f

/**

  • 手指当前所在的坐标
    */
    private var mMoveX = 0f

/**

  • 记录上一次触发 按下是的坐标
    */
    private var mLastMoveX = 0f

尾声

一转眼时间真的过的飞快。我们各奔东西,也各自踏上了自己的旅途,但是即使多年不见,也因为这份情谊我们依旧如从前那般“亲密”。不忘初心方得始终。加油吧,程序员们,在我看来35岁,40岁从来不是危机,只要永远不要忘记自己为何踏上征程!

为了让更多在学习中或者最近要准备面试的朋友们看到这篇文章,希望你们能多多评论,点赞+转发!

再次感谢所有给我提供过题目的朋友们,感谢一路有你!

网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友,可以戳这里获取

一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!

veX = 0f

/**

  • 记录上一次触发 按下是的坐标
    */
    private var mLastMoveX = 0f

尾声

一转眼时间真的过的飞快。我们各奔东西,也各自踏上了自己的旅途,但是即使多年不见,也因为这份情谊我们依旧如从前那般“亲密”。不忘初心方得始终。加油吧,程序员们,在我看来35岁,40岁从来不是危机,只要永远不要忘记自己为何踏上征程!

为了让更多在学习中或者最近要准备面试的朋友们看到这篇文章,希望你们能多多评论,点赞+转发!

再次感谢所有给我提供过题目的朋友们,感谢一路有你!

网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友,可以戳这里获取

一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!

  • 11
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值