00:00
好,我们继续啊。好。嗯。那我们看一下测试部分,还有一部分我们没有讲,嗯,看我们这个文档。这些文档呢,这边还有一个模块效果,其实就是一些动画的一个效果啊,我们来看一下吧。啊,这里面我把它分为了有几个啊,它这个上面排的是基本效果滑动和弹入弹出以及什么呢,自定义,但我讲的顺序呢,跟这个不一样,我们先来去看一下,一个叫什么呢?淡入淡出。嗯,这里面呢,有一些需求,我们按照这个需求做就行了。
01:03
啊,这里面呢,有一个div啊,它是一个红色的一个背景的一个div啊,我们要点击按钮来实现。弹出就是慢慢消失,能懂吧,弹入了就一点一点的显示出来。啊,最后呢,我一个按钮是它能够自动进行什么切换,如果是隐藏的它就能显示出来,如果是显示的,我一点它就慢慢消失啊就这样一个效果,我们来看一下。啊,还是一样需要去给这些按钮加点监听。对吧,哎,我们把那其他的两个也准备好吧,这个没什么难度,我们来看现在呢,我要去实现当中,首先我得找到这个元素吧,啊找到元素我提前先找好,反复可以用啊,反复用啊放到外面这是一个class,那我用什么,是不是用点的好下面。
02:17
我们来看一下。我第一个我要点击这个八乘一,要慢慢的什么弹出就是慢慢消失,那这一个应该用什么呢?我们来看一下,它有一个飞的印,有一个什么f out,我应该用什么out吧啊F,我们试一试点什么f out,我先不传参数,看一下有没有效果。刷下。有没有,是不是有一个过程吧,啊有个过程,哎,我们来看一下,你说他怎么做到的。是不是得盯着这个,盯着他啊看他。
03:04
改变的是什么?改变的是什么样的样式?看不出来吗?中间看不见清楚是吗?中间在改变的是什么,那央视属性。对不知道吗,透明度。对吧,这个透明度它是从一不断的变为什么呢?零,最后把它的那个是指定一个样式叫display等于什么那。就不断的,其实这一个弹弹出就是不断改变o city。嗯。这其实并不难吧,对吧,好,那现在啊,有一个事情。这个动画你觉得还有什么可以去指定的呢?啊,它可以有一个概念叫持续的时间,应该这一个不传参,它应该有一个有一个默认的时间是吧,我们可以看一下文档,也就是说它在这里面可以去传的一个参数叫什么speed,什么意思,速度。
04:23
啊,那也可以传哪些呢?这个速度啊,它可以传字符串,这个字符串不能随便瞎传,有路有normal,有什么bus是什么意思,快速。啊,那同时也可以去指定一个数值,也可以指定一个数值。那数值什么意思,是不是持续的时间呢?啊哎,我们看下,那有人可能就问了老师,这一个代表多长时间呢?它上面也没说,但最后通过它那个例子你应该也能看出来,这个slow代表多长时间,600啊后面有一个有一个FAST200按normal呢,那你应该你用老子想你应该能想得出来,我说你咋就知道,我就没办法了,好其实按说来说啊,你不指地应该是一个normal是吧,是不是常规的,好,那我可不可以试一下来啊,是一个慢点的,慢点的用什么lo试一下呗,是吧,看看。
05:49
这个说实话,因为一个一个是410,一个是一个是600是吧,啊像没很难看出来有多大的一个,因为不是说同时在变化,这还真看不太看不出来啊,那我们可以指定一个时间,可能会比较明显是吧,1000应该是效果会比较就已经很明显了,一秒以内嘛,是吧,来看一下。
06:23
是吧,诶这个时候因为时间相差比较大了,你就能很很明显的感觉出来,确实就比以前什么慢了很多是吧。这个很懂吧,这其其实是很简单一个事啊,那好了,那我在这里面呢,除了能够写啊,能够去隐藏,还可以做什么,是不是单单路啊,单路用什么。其实就非常简单了,Div点多了福,Div点肺的E啊,我就不想参数了啊,就不用研究这些东西了,看一下行不行,那也就是说我点它了是消失是吧,我点它应该什么出来,是不是这个明显快一点呢?啊明显快一些能懂吧啊OK。
07:22
其实这个你也能看出来它是怎么做的,其实到底是一样的,我当路是什么?是不是先把那个OB从零不断改变,为什么一当我改变E以后,我马上指定display,为什么block。好,下面自动切换,也就是说我点一下它如果显示的我就隐藏,如果是隐藏我就显示啊,这个地方它有专门的方法,你看有人懂啊,这没什么太多好说的,来一个什么C的to to的意思,切换开关的意思。
08:00
那很简单了,其实哪一个div点试一下。简单吧,简单,它其实还有一些参数是可以指定的,譬如说这个这里面的。这里面是一个什么东西呢?这里面是你变化的速率是不是匀可以指定,为什么呢?匀速的或者一个变数的啊,它一个电话的一个效果,OK,好,这个倒用的是这个,这个有用。这个FN是一个回调函数,回调函数用来干嘛呢?回调函数肯定监听一个什么东西,监听什么呀,动画是否已经完成,有的时候都画完成,我是不得知道啊,那我怎么才能知道了来非常简单啊,其实哪个都可以啊,哪个都有,我就是以个为例,哎,Alert一下。
09:05
说什么动画完成了对吧,我们看它能不能提示啊弹出。有没有有,那有的时候我们在动画完成之后,是不是要做一些事情呢?那做一些事情就可以在这个回调函数里面做。就这么点事啊。OK,那这个地方你一定要知道,我这个单入单出是它的原理是什么,其实非常简单,就是不断改变元素的什么透明度,那个透明度那个属形叫什么包C形来实现的。简单吧,啊,还是挺简单的,好,下面呢,我们看它的另外一个,另外一个有单单珠,还有一个什么滑动,一个叫down,一个叫skin up,还有叫to,就切换呗,一试你就知道啊,这东西都比较简单,我们就一起讲这个了。
10:16
差不多,我希望什么呢?我点这个按钮,它就搜索起来,搜索起来最终是不是就消失了,那搜索起来以后,我再点这个按第二个按钮会怎么样,是慢慢向下展开啊。是不是就慢慢可见了?我们的显示隐藏啊,无非就是通过透明度去操作,再一个就是通过高度或者宽度操作呗,对吧,来试一下,这东西都有比较简单啊,搞一搞,呃,还是一样,先找到我的这一个div,先把它取到啊,接着给那些按钮了加点,点击尾巴它捞过来吧,这东西都差不多。
11:03
结构都是一样的,我就不再写了,好,我们点击BUTTON1,它要慢慢收缩,要慢慢缩,我去调用它的什么方法,Ne大还是up啊啊,我要我现在是不是要向上滑动,向上滑完是不是收缩呀,大耳。还是up啊,OK,不知道是吧,你得试一个对不对,你管他时候你先试一个行不行,管他呢啊好,我来先试一个,但是呢,他现在当前是不是已经是展开的呀,展开我是不是上去对不对,那我的用什么啊,我时间我就不止了,一时间是不是一个意思啊,这个里面可以传阅参数跟开始一样的,我就不再去研究了,好。
12:08
OK,可以,那他是怎么做的哟,看一下,这不就是看我这个div吗?是不是找你看不太清楚,是不是看不太清楚怎么办?秒三秒,这还看不清楚啊。呃,走里大家看呢,主要变化的是什么?高度其实主要变化的包,别看别的啊,别的基本上没种啊,主要变化的是什么,它当前元素的什么高度其实也非常大,小也能想得出来啊,OK,落点它是不是要展开啊,所一等于是。
13:00
点击第二个,这不是发吗。嗯,非常简单,我们来去写一下,在这个地方就是它点击button啊是吧,他要的不是up了,而是什么啊,好,这个我就不再去加这么长时间了,好,我把三也告掉,这个也太简单了。这个是三好,这个时候我们用实力的什么呢?是不是透切换吧,来试一下啊,把这个关了吧,因为我们研究过了,收起来啊没问题是吧,可以收展开各位接着切换。
14:05
行可以吧,可以啊,看那这个时候啊,我们要知道它是如何实现的,不但改变什么元素的高度。实现。能理解吧,好啊,有了这些东西以后,下面我们要讲另外一个概念叫显示异常,那你说我弹不弹出滑动,是不是显示异常,是,但是呢,这一次啊,我们也会去讲的,也是关于显示异常的啊,一个叫数,一个叫会的,一个叫top,只是这一个显示隐藏,它可以有两种方式,一种是不带动画的,一种是什么呢?带动画的。
15:04
我们来看一下啊,这里有四个。嗯,操作了跟开始一样,所以说呢,我先把那个把这个东西都拿过来呗,因为这太简单了。啊,还有这一个点击也都是一样的结果啊,啊,我们点击B千1要立即显示,我应该去调什么方法显示是吧?啊显示好了,那我点大家看它点击BUTTON2,它要慢慢显示。那你说我慢慢显示是怎么个显示法呀,指定时千接着说1000可不可以,好,那我要点击八三要慢慢隐藏。
16:06
首先得说隐藏应该用什么方法,是不是可以的慢慢隐藏,那我要指定一个时间呗。可以吧,好,我们点击它进行显示隐藏再切换啊,这个要改一改是吧,这三这是间四,好记着这个方法应该叫什么。是不是直接就talk呀,啊,我也不传这个时间了,我如果不穿时间是它是不是什么瞬间完成的吧?啊瞬间完成了,我们来看一下是一个什么样的效果啊,一看就懂,这个比较简单。还是隐藏的总理?是瞬间显示还是慢慢显示的好,再来一次啊。
17:02
大家看一下这个显示的过程是怎么个显示法,你告诉我改变它的宽高,除了宽高有没有透明度的改变呢?有没有,有这就为什么我后来才说这个。啊,前面我们是不是相当于这个单路单单路弹出它只是改变什么OB。是不是,而我们的滑动改变什么高度,而我们的这个显示隐藏这个虚K的,他们如果带动画的话,是一个什么样动画啊,有透明度,OB city有高度,还有什么宽度,而且它有一个固定的位置,左上角是位置是固定的。对不对啊,这就是我为什么要先说这两个啊,再去给大家去说这个显示隐藏,其实他的这个文档是先说它是基本的,那我觉得这个文档写在有点不太就这一点上啊,因为他们俩是基本的,相当于他是个这一个这一个说黑的是个复复合的。
18:15
只是说我这个说黑的可以没有动画。可以没有动画,这也是经常有的,有的时候不是不是什么时候都需要动画,我有时候就需要显示,显示一下或者隐藏一下。啊,OK,再一个切换,我们来看一下切换。这个动画吧,没有我能呢,有动画呀,可以啊,你说再加个时间,他不就有动画了吗。但是那个动画的那个一那几个属性是不是还是几个属性啊city wide和什么。
19:00
啊,这里面一定要记住啊,默认是没有动画啊,显示一下默认的动画是有,哎,有动画是有个动画写一下啊动画巴黎几个部分,一个是OPPO city,还有什么,还有我们的hit,还有一个weather,是不是这三个属性的一个变化呀,就这个模式。还是比较简单的。行。他勒着。
我来说两句