Android属性动画实现布局的下拉展开效果

Android属性动画实现布局的下拉展开效果,第1张

概述在Android的3.0之后,google又提出了属性动画的这样一个框架,他可以更好的帮助我们实现更丰富的动画效果。所以为了跟上技术的步伐,今天就聊一聊属性动画。

在AndroID的3.0之后,Google又提出了属性动画的这样一个框架,他可以更好的帮助我们实现更丰富的动画效果。所以为了跟上技术的步伐,今天就聊一聊属性动画。

这一次的需求是这样的:当点击一个VIEw的时候,显示下面隐藏的一个VIEw,要实现这个功能,需要将V IEw的visibility属性设置gone为visible即可,但是这个过程是一瞬间的,并不能实现我们要的效果。所以,属性动画是个不错的方案。

先把效果贴上

第一个:


 第二个:

前面的这个是隐藏着,后面这个是显示的。当点击这个箭头的时候,来切换显示或者隐藏。

现在开始编码:

布局文件如下

<linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  xmlns:tools="http://schemas.androID.com/tools"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  androID:orIEntation="vertical"  tools:context="com.ltl.mpiggybank.MainActivity" >  <relativeLayout    androID:layout_wIDth="match_parent"    androID:layout_height="wrap_content"    androID:background="#458EFD"    androID:padding="10dip" >    <TextVIEw      androID:layout_wIDth="wrap_content"      androID:layout_height="wrap_content"      androID:layout_centerInParent="true"      androID:gravity="center_vertical"      androID:text="下拉展开动画"      androID:textcolor="#ffffff"      androID:textSize="20sp" />  </relativeLayout>  <linearLayout    androID:layout_wIDth="match_parent"    androID:layout_height="wrap_content"    androID:background="#548AEA"    androID:gravity="center"    androID:orIEntation="vertical" >    <TextVIEw      androID:layout_wIDth="wrap_content"      androID:layout_height="wrap_content"      androID:layout_margin="20dip"      androID:text="昨日收益(元)"      androID:textcolor="#ffffff"      androID:textSize="16sp" />    <TextVIEw      androID:layout_wIDth="wrap_content"      androID:layout_height="wrap_content"      androID:text="0.00"      androID:textcolor="#ffffff"      androID:textSize="45sp" />  </linearLayout>  <linearLayout    androID:ID="@+ID/linear_hIDden"    androID:layout_wIDth="match_parent"    androID:layout_height="120dip"    androID:background="#548AEA"    androID:gravity="center"    androID:orIEntation="vertical" >    <TextVIEw      androID:layout_wIDth="wrap_content"      androID:layout_height="wrap_content"      androID:layout_margin="20dip"      androID:text="显示的VIEw"      androID:textcolor="#ffffff"      androID:textSize="16sp" />    <TextVIEw      androID:layout_wIDth="wrap_content"      androID:layout_height="wrap_content"      androID:text="0.00"      androID:textcolor="#ffffff"      androID:textSize="35sp" />  </linearLayout>  <linearLayout    androID:layout_wIDth="match_parent"    androID:layout_height="wrap_content"    androID:background="#548AEA"    androID:gravity="center"    androID:onClick="onClick"    androID:orIEntation="vertical" >    <ImageVIEw      androID:ID="@+ID/my_iv"      androID:layout_wIDth="25dip"      androID:layout_height="25dip"      androID:layout_margin="20dip"      androID:src="@drawable/scroll" />  </linearLayout></linearLayout>

这里面代码并不多,也很简单,三个线性布局,里面装载着各自的控件,并且还设置了ID。按钮是一个线性布局,采用了onClick自身的点击事件。接下来,当点击了这个线性布局的时候,需要隐藏的控件最终到达一个高度,这个就是我们的目标值,只需要通过布局中的dp转换成像素就行了。

mDensity = getResources().getdisplayMetrics().density;mHIDdenVIEwMeasuredHeight = (int) (mDensity * 120 + 0.5);

这里是120就是我们布局里面定义的高度。

然后给这个过程增加一个动画效果。

  ValueAnimator animator = ValueAnimator.ofInt(start,end);    animator.addUpdateListener(new AnimatorUpdateListener() {      @OverrIDe      public voID onAnimationUpdate(ValueAnimator arg0) {        int value = (int) arg0.getAnimatedValue();        VIEwGroup.LayoutParams layoutParams = v.getLayoutParams();        layoutParams.height = value;        v.setLayoutParams(layoutParams);      }    });

通过这样一个简单的ValueAnimator ,就可以很方便的实现显示和隐藏的动画效果了。
下面是完整的代码。

import androID.animation.Animator;import androID.animation.AnimatorListenerAdapter;import androID.animation.ValueAnimator;import androID.animation.ValueAnimator.AnimatorUpdateListener;import androID.os.Bundle;import androID.support.v7.app.ActionBaractivity;import androID.vIEw.VIEw;import androID.vIEw.VIEwGroup;import androID.vIEw.Window;import androID.vIEw.animation.Animation;import androID.vIEw.animation.RotateAnimation;import androID.Widget.ImageVIEw;import androID.Widget.linearLayout;public class MainActivity extends ActionBaractivity {  private linearLayout mHIDdenLayout;  private float mDensity;  private int mHIDdenVIEwMeasuredHeight;  private ImageVIEw mIv;  @OverrIDe  protected voID onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    requestwindowFeature(Window.FEATURE_NO_Title);    setContentVIEw(R.layout.activity_main);    mHIDdenLayout = (linearLayout) findVIEwByID(R.ID.linear_hIDden);    mIv = (ImageVIEw) findVIEwByID(R.ID.my_iv);    mDensity = getResources().getdisplayMetrics().density;    mHIDdenVIEwMeasuredHeight = (int) (mDensity * 120 + 0.5);  }  public voID onClick(VIEw v) {    if (mHIDdenLayout.getVisibility() == VIEw.GONE) {      animateOpen(mHIDdenLayout);      animationIvopen();    } else {      animateClose(mHIDdenLayout);      animationIvClose();    }  }  private voID animateOpen(VIEw v) {    v.setVisibility(VIEw.VISIBLE);    ValueAnimator animator = createDropAnimator(v,mHIDdenVIEwMeasuredHeight);    animator.start();  }  private voID animationIvopen() {    RotateAnimation animation = new RotateAnimation(0,180,Animation.relative_TO_SELF,0.5f,0.5f);    animation.setFillAfter(true);    animation.setDuration(100);    mIv.startAnimation(animation);  }  private voID animationIvClose() {    RotateAnimation animation = new RotateAnimation(180,0.5f);    animation.setFillAfter(true);    animation.setDuration(100);    mIv.startAnimation(animation);  }  private voID animateClose(final VIEw vIEw) {    int origHeight = vIEw.getHeight();    ValueAnimator animator = createDropAnimator(vIEw,origHeight,0);    animator.addListener(new AnimatorListenerAdapter() {      @OverrIDe      public voID onAnimationEnd(Animator animation) {        vIEw.setVisibility(VIEw.GONE);      }    });    animator.start();  }  private ValueAnimator createDropAnimator(final VIEw v,int start,int end) {    ValueAnimator animator = ValueAnimator.ofInt(start,end);    animator.addUpdateListener(new AnimatorUpdateListener() {      @OverrIDe      public voID onAnimationUpdate(ValueAnimator arg0) {        int value = (int) arg0.getAnimatedValue();        VIEwGroup.LayoutParams layoutParams = v.getLayoutParams();        layoutParams.height = value;        v.setLayoutParams(layoutParams);      }    });    return animator;  }}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android属性动画实现布局的下拉展开效果全部内容,希望文章能够帮你解决Android属性动画实现布局的下拉展开效果所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1148838.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-31
下一篇2022-05-31

发表评论

登录后才能评论

评论列表(0条)

    保存