Android页面动画效果的调整

作者:课课家教育更新于： 2017-01-11 16:57:36

　　我们的app应用主要的是要吸引到客户，那么我们可以在设计的元素上增加一点不一样的效果来起到推动的作用，那么各种手机的大小尺寸都是有区别的，我们可以根据两种方式来表达，一个是中心动画一个是预留位置。既然我们要改变动态的效果，那么我们在设计上是否要做一些变动，选择增加插件还是根据像素来移动。

　　一、主要讲解两种启动方式,一种是中心动画,一种是预留位置.

　　1.中心动画:使用动画效果逐渐显示控件,如位移,渐变,缩放等.当你使用动画特效的时候你要考虑这几个方面，动画效果的缩放，渐变，和控件的插入反式等等问题，

　   2.预留位置:改变设备的大小，位移，划入划出，位置匹配。

　　下面是一张移动app的动画效果浏览。

　　二、中心动画

　　我们在插入空间中从三个方面来处理动画的方式，关于这个动画设计的位移，渐变和缩放问题进行思想，这些元素其实可以单独使用也可以结合使用。，但是它的核心是查看工具的中心动画。

　　我们在代码中把控制Y轴的距离,向上移动300像素.

　　代码如下：

　　／／向上移动

　　viewcompat.animate（mivlogo）

　　.translationy（300）

　　.setstartdelay（启动延迟_）

　　.setduration（动画__项目时间）

　　.setinterpolator（新decelerateinterpolator（1.2f））

　　.start（）；

　　当位移调整后，我们把默认为0的alpha改为1，然后移动50的像素。

　　代码如下：

　　查看动画=viewcompat动画（V）。

　　。translationy（50）-（1）。

　　。setstartdelay（（item_delay*我）+500）

　　setDuration（1000）；

　　三、缩放是能显示最终的效果，那么在这次的缩放中我们把scaleX和scaleY从0变为1的调整。

　　代码如下：

　　查看动画=viewcompat动画（V）。

　　。称为（1），scaleX（1）

　　。setstartdelay（（item_delay*我）+500）

　　setDuration（500）；

　　注意:setStartDelay延迟启动动画,setDuration动画持续时间。

　　四、预留位置

　　在控件显示的过程中,可以改变位置和大小,动画效果可以是坍塌和滑入.坍塌效果与CollaPSingToolbarLayout相同,通过本文代码,理解实现原理.到这一步我可以用代码来解释动画控件在显示过程中出现的一些问题，例如如何改变其位置大小，动画效果的坍塌和滑入功能，倒塌的工具栏布局等解析。

　　坍塌:使用价值的动画改变工具栏的高度,在结束时,启动其他动画。

　　代码：

　　//工具栏坍塌成ActionBar

　　collapsetoolbarprivatevoid（intheight）{

　　TypedValue电视=新typedvalue()；

　　gettheme()。resolveattribute（Android.r.attr.actionbarsize，电视，真的）；

　　国际toolbarheight=TypedValue。complextodimensionpixelsize（tv.data，getresources()。getdisplaymetrics()）；

　　ValueAnimatorValueAnimator=ValueAnimator。ofInt（身高、toolbarheight）；//动画

　　ValueAnimator。addupdatelistener（动画->{

　　viewgroup.layoutparamsLP=mttoolbar。getlayoutparams()；

　　lp.height=（整数）getanimatedvalue()动画；

　　mttoolbarsetlayoutparams（LP）；

　　}）；

　　start()ValueAnimator；

　　ValueAnimator。听听（新animatorlisteneradapter(){

　　@Overridepublicvoidonanimationend（动画动画）{

　　超级onanimationend（动画）；

　　mphrecycleradapter。setItems（modelitem。getfakeitems()）；

　　ViewCompat。动画（mfabbar）。setstartdelay（500）

　　。setDuration（500），scaleX（1），scaleY（1）。start()；

　　}

　　}）；

　　}

　　五、接着我们用渐入的形式来表达动画加载卡片渐入的效果到列表中，就是用滑入的方式加载图片。

　　代码如下：

　　//列表适配器

　　公共静态类phrecycleradapter延伸recyclerview。适配器{

　　私人最终ArrayListmitems=新的ArrayList<>（）；//数据

　　publicvoidsetItems（表项目）{

　　//启动动画的关键位，顺次添加动画效果

　　intpos=getitemcount()；

　　mitems测（项目）；

　　notifyitemrangeinserted（POS，mitems。size()）；

　　}

　　@Override

　　市民PhViewHolderonCreateViewHolder（ViewGroup母，intViewType）{

　　视图v=LayoutInflater。从（父。getcontext()）。充气（r.layout.item_card，母，假）；

　　返回新的phviewholder（V）；

　　}

　　@Override

　　公共无效onbindviewholder（phviewholder持有人，int的位置）{

　　架。bindto（mitems。得到（位置））；

　　}

　　@Overridepublicintgetitemcount(){

　　mitemssize()返回；

　　}

　　//数据存储

　　公共静态类phviewholder延伸recyclerview.viewholder{

　　“绑定（r.id.item_tv_titleTextViewmtvtitle）；

　　“绑定（r.id.item_iv_imageImageViewmivimage）；

　　民营背景mcontext；

　　市民PhViewHolder（查看itemview）{

　　超（itemview）；

　　butterknife绑定（这，itemview）；

　　mcontext=itemview。getcontext()。getapplicationcontext()；

　　}

　　公共无效的结合（modelitem项目）{

　　Picasso，（mcontext）。负荷（项目。getimgid()）到（mivimage）；

　　mtvtitle。setText（项目。getname()）；

　　}

　　}

　　}

　　六、注意:在渐入的形式时候我们要确保每一张图片是根据notifyItemRangeInserted(pos,mItems.size的动画效果，设置列表(RecyclerView)的Item动画:mRvRecycler.setItemAnimator(…);

　　总结：这就是我们最终的动画效果，你也从上面的GIF图中看到我们这次的调整结果，我们在增加了元素的前提下加载了页面的动画效果和大小的调整，一些酷炫的加载动画，可以与任何View配合使用，使得页面的中心动画和加载动画进度条更加的实体化。以上就是这次的动画优化技能，你们学会了吗？