00:00
好的,我们继续啊,那么整完这个,哎,实时播放的这个时间啊,格式化显示以后呢,这节课我们来看啊,这个功能呢,就是在音乐播放的时候呢,我们要这个进度啊,这个实时的进度呢,要动态的跟着走。而且呢,它的起始位置呢,应该是零,也就说这个实时进度条的宽度上来是零。那么我们当前的项目呢,刚才呢,哎,我们为了看到效果呢,我们上来呢,是给他写了一个多宽呢,哎,咱们给他写了个100宽在哪呢?在这里对不对,那其实这个宽度呢,不应该在这写,因为这个宽度呢是个动态的啊,所以大家看我怎么写。那来到data塔中呢,我去初始化一个这个啊,Current外,嗯,默认为零,那这个呢,代表的是这个实时进度条的嗯宽度。没问题,而这个东西呢,应该来来到我们这个结构里边,找到我们的实时进度条。
01:02
我们呢,去给它设一个什么内联样式,哎,这个内联样式里边,我们要设的宽度呢,应该跟的是这个变量。那你别忘了啊,在这个变量里边呢,我们要去给人家去加一个什么RPX的。单位啊,那这个呢,是我们应该啊要考虑到的啊,那这样的话呢,其实呢,位置呢,它就是零了,或者说你要测的话,你看我这写个200。嗯,200啊,我们看一眼有没有效果过来。好的,现在啊,我随便点一首歌,那这个时候它的宽度呢,应该是200了,练习走。打卡这么长没有问题。对吧,好的,那现在呢,我们把这个还原成零。然后啊,你要注意这个宽度呢,我们应该要根据这个音乐实时的播放去动态的计算。所以接下来的计算呢,我们一定还是在哪呢,还是在那个接听里边。哎,在这个。监听音乐实时播放的进度里面去计算啊,这呢,我去let个这个current吧,它应该等于多少呢。
02:09
那应该等于多少呢?呃,其实就是一个比例关系,那么你想啊,我们应该是实时的进度时间。实时的时间是不是比上我们的总时间等于实时进度条的长度比上我们的总长度呀?啊,那也就current time。比上我们的duration time应该是等于我们的current。比上我们的。总的长度。那么现在当前的实践,我们是不是有。总时间是不是有?总长度其实也有啊,当初我们设计中间这个长度的时候,多少450,那这的话。好求吧啊,要求啊,四个值,已知三个值,要求一个值,那肯定好求了。那这个值怎么求呢?那就是它比它是不是再乘上这个四百五就可以了,来,那我们写一下啊。
03:05
首先呢,我们需要这个当也是实时的时间对吧,比上什么,我们的总时长就这个,嗯,Delicious time,然后呢,最后呢,再乘以四百五呗。那这样的话呢,我们把这个。Current time呢也给他啊更新一下啊,我们最终呢,来看一下我们的效果来过来。好的,来练习走。我们点击一下练习啊过来。嗯,那这个时候大家看啊,起始为零,来我们播放一下走。那在这里啊,这个进度条很明显走的不对劲,对吧,那我们看一下我们哪哪里出了问题了。呃,哦,这。我这粘错了吧,我们应该是要拿这个。实时的时间是不是要比上这个总时间呀,我呢这儿呢啊,它比它等于一了,那就上来直接四百五了。
04:02
好的,那我们把这个换过来啊,我们再看一眼。来控制弹呢,我们清掉啊,啊还是练习走。过来,我们再播放一下,走你。啊,那我们要稍微等个几秒钟才能看到啊,那这个时候呢,大家看啊,这个进度条呢,是实时往前走的。而且呢,最后的歌曲走完以后,我们把歌曲播放完,我们的进度条是不是正好走到我们的最右侧呀。没有问题啊,没有问题。好的,那这节课呢,哎,我们是实现了这个进入条啊,是根据这个音乐的播放呢,实时的去往前走,好的,那这一节课呢,我们先整到这里。
我来说两句