00:00
好，那接着我们往下来写啊，还是看我们这个home fragment这里边。啊，按照这个顺序的话呢，我们往下写，那就开始来写这个圆形进度条了，嗯，这个呢属于一个自定义组件。啊，或者叫自定义视图啊，下边呢，我们重点呢就来搞定它啊，嗯，做它的话呢，那你得考虑说我这个视图应该继于view，还是应该继承于view group。哎，显然是一个VIVO啊，View是个布局了啊，就是嗯，你怎么去想这个事呢？就是你看看这个东西到底可见不可见了，相当于是是吧，啊这个一般不可见的，我们说就是一般是不是就是个布局啊。对啊，我们这里边呢，就是有一个效果了，肯定是一个可见的，这就是一个view了，那我们这呢，就去创建一下啊，既然是一个view，我们这呢提供了个UI，专门在它下边呢，来提供这些自定义的组件啊啊定一个class。
01:02
我们叫around progress。哎，让他呢，去继承于我们的view啊，集成VI以后呢，我们自然而然的要重写它的生命，呃，这个扩大器啊，我们可以提供这三个。啊，OK一下。三个里边呢，主要我们说一下其中的前两个啊，这个呢，一般什么时候我们去用啊。哎，对，在代码中就我们自己扭的时候，对吧，这个呢。哎，在工具文件当中去使用，嗯，这个要区分开啊，行，然后这个写完以后呢，你看这个super它掉的啊，这个呢，它直接是写这个操作了啊，其实像以前的时候呢，这个view，它这个里边调的实际上是这个，然后把这个呢，就是写成了几个now是吧，那这个修的话呢，还是用的这个Z次1233个参数，那实际上调的就这个。就是你这个调的休克，休克里掉的跟这个直接调的休克其实一样啊，所以你把这个可以改成那this。
02:02
类似的时候，这个可以写个零是吧，哎，其实这个呢，像以前的话呢，它也是调的这个，所以你现在其实这样改一下也没问题啊，类似呢，写个no这样。哎，那如果你有一些初始化的操作，是不是就写这里就OK了。就这样啊好，嗯，这个完了以后的话呢，我们，呃，紧接着呢，需要把这个类呢，我们得用一下啊，你这是自定义的一个视图。来自定义视图啊，然后把它放的话呢，声明在我们的这个布局文件当中找到fragment home。哎，我们这儿呢，之前是用的这个。斜哪看看它圆形进度条，就它把它呢改一下。Round progress啊。嗯，宽高marin top这个就不要了。嗯，然后的话呢，应该给一个ID。嗯，我们这就叫wrong的一个简写了啊P。
03:04
然后吧。行，这个呢，我们就提供好了，那关键呢，我们就是过来呢，需要呢去如何去提供这个视图，需要我们关心一下啊。嗯，这也是今天我们需要大家去分享的，中午就是关于view和view的生命周期啊，这就涉及到我们如何去自定义view，或者再定一个view group啊这样的操作了啊嗯，那我们这里边呢，需要做这个绘制了，那很显然需要重写哪个方法。哎，按照方法，哎，那这呢，我们重点来写这个方法啊，这个super的话呢，你打开这里边什么也没有，因为呢具不知道它具体是个什么view了啊，所以这个你干掉了。关键呢是来写这个方法，这个方法的话呢，我们来做一个绘制啊，这个绘制呢，做好的这个效果我们。在看这个的时候呢，也能看得着啊。
04:01
这算是怎么画呀？好像没有什么思路似的啊，看着或者有时稍微有点复杂啊。嗯，这里边儿如果我把它这个分一分的话，这算是有几部分呢。还说有两部分的，有说三部分的，其实都有道理啊，你要说两部分呢，就一个圆环，有一个文本。呃，你要说三部分呢，对这个圆环的话呢，其实你要是没有进度，就是一个灰色的，然后上面呢，就根据你的这个进度值，是不是又刷了一层，或者有个清闲点刷了一层那个红的，根据你的进度值，然后看看刷多长。所以可以看成三部分啊，第一部呢，画一个圆环，嗯。嗯，圆环，然后第二部分呢。的进度，就是画一个叫圆弧吧。哎，不是一个环了啊，画一个圆弧，然后第三个哎，文本。
05:01
嗯，直接用什么progress SPA，那不行，没有现成的圆形进度条啊，只有水平进度条，水平进度条的话呢，它有个进度值，然后圆形那个呢，没有那个具体数值，所以这个呢，不能没没有系统的可以用，只能是用我们自己定义的啊好这三部分，那下边呢，我们就考虑一下这三部分该怎么去实现了，那就意味着呢，在我们重启的这个按照方法里边，我们要做三个事儿，第一个啊，绘制圆环。圆弧。绘制文本。啊，总感觉叫绘制文本比较怪啊，但实际上呢，它就是个绘制的好，那这三个的话呢，我们得分别去考虑应该如何去做了，比如说绘制这个圆环，哎，我们呢，就是拿这个看vers画布啊，嗯，你画圆环呢，就照一个circle呗。画个圆嘛，就它啊，那它的话呢，我们看到这个行3CX CY readus。
06:07
是不是大概也能猜出来这几个参数的意思啊？那前两个是什么呀，你觉得。哎，圆心坐标嘛，是不是半径啊。画笔就是你画什么颜色呀等等，你得在P里边指明一下，呃，大概就这样的几个事情啊好，那这个事情怎么去写，那这块呢，我们给大家提供了一个。呃，这个PPT啊，看一下。来看这个事儿，通过这个呢，我们把它呢直接一下，要是直接干说的话呢，还不太好理解啊，嗯，我们现在比较关心的就是整个这个圆环，我这用的是个蓝色的，它的圆心半径pen的好说。啊，圆心半径好，先看圆心吧。圆心的话呢，是在这儿啊嗯，那这个圆心我们关心的是它的坐标。啊，那它的坐标的话呢，那那得考虑既然是个坐标了，那你得先是从哪个点开始它的坐标啊，那你这里边坐标原点是哪。
07:10
啊。啊，这是这个点了啊，哎，应该是左上顶点是不是它呀。哎，那这个景点为什么就是它了呢？呃，实际上是取决于我们的画布。啊，这个颜色稍微不太好啊，取接于我们这个画布，就是我们通过coververs呢，去照一下指定的坐标，Coververs多大，那个coververs对应的那个位置，整个那个区域的左上顶点就是它的一个坐标原点，那convers就这么大，那其实就是对应着我们当前你画的这个convers，是不是就画的是它是吧，它呢，是不是在我们这个，呃，布局文件当中对应的就是这样的一个。一百二一百二这样一个区域啊，哎，所以说呢，这个区域啊的左上顶点就是我们的坐标原点啊，就是我们这个converse啊这样的一个范围。
08:02
啊，我们在这里边稍微描述一下，这个要要能够确定出来啊，这个covers呢，我们称作叫画布，然后就对应着我们这个视图啊，在布局中的这个。嗯，叫什么范围啊，范围区间吧。啊，就像以前我们画这个快速索引一样啊，啊在整个这个屏幕当中，哎，重画这整个这个屏幕当中呢，我们右边呢，是要快速索引是这个条啊，那这个时候我们画这个abcd的时候呢，你也要考虑这些的坐标是多少，那这个时候它的坐标原点是哪呢。是不是这个点啊，哎，就是全看你这个画布到底多大，画布呢，又取决于你这个视图到底是多大，哎，视图的范围就是我们画布的范围，对应的左上顶点就是坐标原点啊。然后呢，范围的左上。顶点即为啊坐标。啊，原点啊，那这个时候呢，有了原点以后，你就可以指它的这个宽高了啊，指它这个坐标原点了啊，那这个原点的话呢，我们应该怎么去衡量。
09:09
对。啊，那你要想知道这个点是不是还差一个值啊。你这个整个圆，我们这是不是有一个外切的正方形，我我这稍微差点意思啊，你实在往下拽拽再拽就凸出去了啊，你就把它看成是我切的。嗯，这个外切的这个正方形，它有一个宽度。宽度的一半是不是恰好就是这个坐标原点的这个位置？嗯，那现在我们相当于是不是还得需要计算一个量，这个量呢，就是你整个这个视图的一个宽度啊。对吧。哎，宽度得到以后呢，这个宽度一半，这不就是我们这个横坐标吗。啊，那类似的，你这个宽度的一半。是不是就是这个也是纵坐标啊，高度的一半，但高度跟宽度是一样的，对吧？对，因为它就是个正方形啊行，那这里边呢，就出现了一个新的量啊叫。
10:06
就是我们当前视图的一个宽度，或者叫高度啊，因为一样那怎么着。哎，Get one，这个时候get one还差点意思哈。或者说你在这里边用get还不太好，嗯，你先画好以后再试图上来，那在这个界面上再盖环报是吧，是不是应该是当初你测量的时候啊。哎，对，我们这个还就不是还提到一个测量的草，哎，这个会掉了on measure啊，也可能有同学这个都忘了啊，这个S能删吗。不要删啊，这super里边呢，它就是整个确定你当前这个视图的一个宽高的啊，不要删掉，哎，在这个里边呢，我们可以做的事情呢，以前我们说重启啊，Measure的一个作用是什么。风险，它的意义是什么呀？
11:00
呃，是不是要获取当前视图或者当前视图的子视图的广告啊？我们这呢是一个view，所以呢就不涉及到子视图了啊，获取当前视图的一个宽高，哎，我们在这里边呢，是不是有这个叫this.get一个measure的was或者hat啊，哎，我们这个问题当中，因为你这。宽方一样嘛，所以我就写一个了啊，然后这个变量呢，我们下边要用，所以我把它抽取为一个属性啊。放这儿了，哎，当前视图的一个宽度，哎，当然了也是高度啊，哎，等于这个高度。行，有了它以后的话呢，这个圆的半径，我们圆的圆点坐标就搞定了，那半径。安静注意哈。要按照我们的理解这个半径看看上面这个红线，就直观感觉的话呢，是按说应该是上面这个。啊，或者有的同学说，我觉得上面那个不是，我觉得应该就是到里边这个到这儿。
12:05
嗯，那也可以，反正大家都有不同的想法啊，嗯，但是真正是哪呢？真正是这个。嗯，也就是说呢，你用外边这个，因为它是个环的啊，你用外边这个边界横到边界呢，不合适，用里边这也不合适，那干脆到中间。嗯，所以这个点呢，是这个圆环的，嗯，拉一个这个线的话，就是它的一个中心点啊。中心的这个值啊，所以这是这个radius OK，那这个radius。嗯，应该是多少。半径尺是吧。嗯，怎么算。嗯，你可以理解成就像刚才那个一样，但是这个里边你得把这个圆环有一个宽度，圆环的宽度的一半减掉了。哎，那或者你从这看也行，就把你刚才就就这一小块就得给它剪出去是吧，哎，所以这个呢，就是得这样算了。
13:07
哎，这里边呢，哎，首先有这个宽度是整个我们这个外边这个矩型的一个宽度减一半，减去我们这个圆环的一个宽度，我就写一个叫round的，呃，Y吧。呃，它的宽度的一半。就可了。哎，这就是我们这个半径啊，就这里边呢，就涉及到这样的一些值了，叫round with，这个round with呢，那完全取决于你自己，你想画多宽你就画多宽啊，所以呢，我们这里边实际上还需要一些属性啊，你像这个圆环的宽度啊，颜色呀，嗯，这个回头这个圆弧的宽，呃，圆弧的颜色呀，还有你这个中间文本的颜色字体呀等等这些呢，都是我们可以自定义的。我们先写上它啊，嗯，这个完了以后，我们差不多其实就能够搞定这样的一个圆环啊圆环了啊，那下边我们就来看一下啊，那我们就先照着这个来写，嗯，首先呢，先啊获取一下这个圆心坐标。
14:14
原坐标刚才已经说了，哎，我们这个叫C，嗯，看看我们这个类型往这一放啊，它是float的型的啊float型的我们就直接先这样写吧，因为我们这个Y得到其实这个。In的形的哈，它除以二。啊，这就是我们得到的这个。圆心的一个横坐标。当然纵坐标跟他一样啊。行，把这个CXCY放这，然后半径。啊，半径这个readers，哎，刚才说了你得是需要用啊wise。哎，除以二，然后呢，再减去你这个圆环的一个宽度的一半。呃，这些呢，都取决于我们一开始的定义，所以呢，我们不妨呢，把常用的你这样的一些，呃，就是你要设置的这样的一些参数呢，我们给它声明出来啊设置。
15:08
啊，绘制的。啊圆环及啊文本。的一个，呃属性的情况，比如说呢，我们先设置一下呃，他们的一些宽度吧，呃颜色吧，液态型的一个，比如说叫。嗯，的一个color。这就是圆环的一个颜色，我们可以用一个灰色的。哎，然后因带形的一个圆弧的哈，或者我们叫圆的一个进度，它的一个。颜色。哎，我们可以用一个红色的。还有我们文本的颜色。
16:02
嗯，这个我们用一个，比如说一个blue行。行，除了这些之外呢，还有啊，比如我们这个，嗯，圆弧的一个宽度。哎的一个Y这个宽度的话呢，我们尽可能是不是应该用DP这个概念啊。哎，所以我们这就是UIU94点。是不是用这个方法就想，哎十个哎就相当于10DB吧，嗯，这个叫啊圆环的。或者叫圆弧也行啊，它的一个宽度。印的形的，还有这个文本的，就是这个一个字体大小。Size。嗯，UI点啊DP啊，然后比如20DP啊，20你这这其实用的是DP了啊。嗯，这个是本本的一个。
17:03
T大小。这个呢，相当于实际上还是用那个DP的概念是吧，那这个呢，我们就或者说我们也不希望它随着这个你这个整个系统的变化而变化了，因为中间这个圆环它有的时候比较小啊，像我们在这个第二个这个页面当中。啊，这个我们还没写呢啊。第二个页面中的这个，呃，文本也是用的。这个里边哈。这呢也是用的我们刚才画的这个，呃，你要是系统这个字体变大的话，这个一变大有时候就超出这个圈了，看着到不好看了，所以这呢，我们就用DP了啊，就不用SP了。好，这个呢是设置它，然后以及呢，其实我们模拟的话呢，也可以先给一个呃，整个圆环的最大值哈，比如就是100个，以及呢，当前模拟一个进度啊，比如写一个50。这样啊。嗯，圆环的一个最大值。
18:05
啊，圆环的一个进度这样啊，啊，这是我们需要的一些变量。我们提前呢，都先定义好啊，然后呢。来回过来，我们说一下这个半径，半径的话呢，我们这还同样的可以生分成in形的read。嗯，这个整个这个半径，呃，整个这个Y的一半，再减去我们刚才算的round的Y它的一半。这不就我们刚才说的这个值吗？好，这就搞定了啊，然后的话呢，还需要一个。画笔对画笔，那就造一下下边也需要啊，所以我们这整个还是生明成一个属性的方式。定义一个画笔，哎，只要是我们自定义这个是view的啊，自定义这个view的这个子类，你既然是有一个展示具体的一个样子了，就会重写它，那一定也会有个画笔啊，这个画笔的话呢，还得需要初始化。
19:11
来画笔，那我拿这个paint呢，就等于new一个，哎，Paint，然后一般我们习惯上呢，再让它点叫set us。一个改这个叫什么意思啊。呃，去除这个锯齿是吧，除啊放杂除啊，这个呢，你叫哎或者叫去除。这么叫，呃，这个叫锯齿是吧，或者有时候叫去除，这个叫毛边，这个也行是吧。这个你发音得准一点啊，要容易有歧义啊。就是你比如我们这个圆弧，你画的时候呢，你看这个就稍微有点这个。是吧，把这个呢，就是擦的更更圆润一些啊，这个或者锯齿这都可以啊啊这个揉了以后呢，嗯，你这还差点意思，因为这个圆环这得有点颜色是吧。
20:02
所以我们在这个位置，具体的这啊这塞一个color。那这不，我们刚才指定了那个color呢，就是叫round color。对吧？嗯，然后呢，你这画的是个圆环哈，那你圆环的话呢，那你不得设置点别的东西吗？比如设置一下你的这个style是吧，你的样式啊paint.style。啊，点你是一个，呃，就是圆环的。啊设置啊，圆环的一个样式。啊，然后呢，以及你这个圆环多宽啊，这个得指明一下啊，Set一下叫ton wise，刚才我们指明了啊，叫round wise。啊，设置圆环的宽度。哎，这样的一些参数也需要做一些调整，这个比较简单啊，这是一个画笔颜色。好，这样设置完以后呢，我们做了一个照，那就意味着应该可以画出来了，然后我们这个视图呢，在我们的布局文件当中做了一个使用，那下面我们跑一下看看，有这时候这个模拟器没有看出来，然在震机上跑啊。
21:14
刚才就是整半天这个。整不出来它这个模拟器啊，其实还是这个journey motion比较好用，但是它这个。离我而去是吧？欢迎界面完了以后，我们应该看到一个回拐。这个搞定了是吧，那下一步呢，我们就开始画这个这个圆弧啊。
我来说两句