android 点击下弹动画实现

下弹动画的实现

下弹动画在很多应用都有使用，比如豌豆荚中的应用介绍界面，百度手机助手的应用介绍界面等。

只要熟悉android动画的使用接口，制作动画并不困难。 这里使用开源库nineoldandroids,其实和android3.0 以上直接使用动画接口是一样的。

实现效果

具体可以看youku动画：http://v.youku.com/v_show/id_XNjYyODgzNjQ4.html

PS, 搞了半天GIF 才能播放。原来是最大边不能太大了。原来图片尺寸太大，被默认转成jpg了。现在总算能看到效果了。

DropDownExample.java

1. package com.buptfarmer.devapp;
2. import com.nineoldandroids.animation.Animator;
3. import com.nineoldandroids.animation.AnimatorListenerAdapter;
4. import com.nineoldandroids.animation.ValueAnimator;
5. import android.app.Activity;
6. import android.os.Bundle;
7. import android.view.View;
8. import android.view.View.OnClickListener;
9. import android.view.ViewGroup;
10. public class DropDownExample extends Activity implements OnClickListener {
11. private View mHolder;
12. private View mHolder2;
13. //    private static final int DURATION = 2000;
14. @Override
15. protected void onCreate(Bundle savedInstanceState) {
16. super.onCreate(savedInstanceState);
17. initView();
18. }
19. private void initView() {
20. setContentView(R.layout.drop_down_example);
21. mHolder = findViewById(R.id.holder);
22. mHolder2 = findViewById(R.id.holder2);
23. mHolder.setOnClickListener(this);
24. mHolder2.setOnClickListener(this);
25. }
26. public static ValueAnimator createHeightAnimator(final View view, int start, int end) {
27. ValueAnimator animator = ValueAnimator.ofInt(start, end);
28. animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
29. @Override
30. public void onAnimationUpdate(ValueAnimator valueAnimator) {
31. int value = (Integer) valueAnimator.getAnimatedValue();
32. ViewGroup.LayoutParams layoutParams = view.getLayoutParams();
33. layoutParams.height = value;
34. view.setLayoutParams(layoutParams);
35. }
36. });
37. //        animator.setDuration(DURATION);
38. return animator;
39. }
40. public static void animateExpanding(final View view) {
41. view.setVisibility(View.VISIBLE);
42. final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
43. final int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
44. view.measure(widthSpec, heightSpec);
45. ValueAnimator animator = createHeightAnimator(view, 0, view.getMeasuredHeight());
46. animator.start();
47. }
48. public static void animateCollapsing(final View view) {
49. int origHeight = view.getHeight();
50. ValueAnimator animator = createHeightAnimator(view, origHeight, 0);
51. animator.addListener(new AnimatorListenerAdapter() {
52. public void onAnimationEnd(Animator animation) {
53. view.setVisibility(View.GONE);
54. };
55. });
56. animator.start();
57. }
58. @Override
59. public void onClick(View v) {
60. if (v == mHolder) {
61. if (View.GONE == mHolder.findViewById(R.id.hiddenview).getVisibility()) {
62. animateExpanding(mHolder.findViewById(R.id.hiddenview));
63. } else {
64. animateCollapsing(mHolder.findViewById(R.id.hiddenview));
65. }
66. } else if (v == mHolder2) {
67. if (View.GONE == mHolder2.findViewById(R.id.hiddenview).getVisibility()) {
68. animateExpanding(mHolder2.findViewById(R.id.hiddenview));
69. } else {
70. animateCollapsing(mHolder2.findViewById(R.id.hiddenview));
71. }
72. }
73. }
74. }

drop_down_example.xml

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:orientation="vertical" >
6. <LinearLayout
7. android:id="@+id/holder"
8. android:layout_width="fill_parent"
9. android:layout_height="wrap_content"
10. android:background="@color/greenyellow"
11. android:orientation="vertical" >
12. <LinearLayout
13. android:layout_width="fill_parent"
14. android:layout_height="wrap_content"
15. android:gravity="center_vertical"
16. android:orientation="horizontal"
17. android:paddingLeft="1dp" >
18. <ImageView
19. android:id="@+id/app_icon"
20. android:layout_width="wrap_content"
21. android:layout_height="wrap_content"
22. android:layout_gravity="center"
23. android:contentDescription="picture"
24. android:minWidth="32dp"
25. android:src="@drawable/ic_launcher" />
26. <TextView
27. android:id="@+id/app_label"
28. android:layout_width="wrap_content"
29. android:layout_height="wrap_content"
30. android:layout_marginLeft="5dp"
31. android:ellipsize="end"
32. android:gravity="left"
33. android:singleLine="true"
34. android:text="what's your dream?"
35. android:textSize="13sp" />
36. </LinearLayout>
37. <LinearLayout
38. android:id="@+id/hiddenview"
39. android:layout_width="fill_parent"
40. android:layout_height="40dp"
41. android:gravity="center_vertical"
42. android:orientation="horizontal"
43. android:paddingLeft="1dp"
44. android:visibility="gone" >
45. <TextView
46. android:id="@+id/hidden_text"
47. android:layout_width="wrap_content"
48. android:layout_height="fill_parent"
49. android:text="过个好年，马上有房" />
50. </LinearLayout>
51. </LinearLayout>
52. <LinearLayout
53. android:id="@+id/holder2"
54. android:layout_width="fill_parent"
55. android:layout_height="wrap_content"
56. android:background="@color/blueviolet"
57. android:orientation="vertical" >
58. <LinearLayout
59. android:layout_width="fill_parent"
60. android:layout_height="wrap_content"
61. android:gravity="center_vertical"
62. android:orientation="horizontal"
63. android:paddingLeft="1dp" >
64. <ImageView
65. android:id="@+id/app_icon"
66. android:layout_width="wrap_content"
67. android:layout_height="wrap_content"
68. android:layout_gravity="center"
69. android:contentDescription="picture"
70. android:minWidth="32dp"
71. android:src="@drawable/ic_launcher" />
72. <TextView
73. android:id="@+id/app_label"
74. android:layout_width="wrap_content"
75. android:layout_height="wrap_content"
76. android:layout_marginLeft="5dp"
77. android:ellipsize="end"
78. android:gravity="left"
79. android:singleLine="true"
80. android:text="Self introduction"
81. android:textSize="13sp" />
82. </LinearLayout>
83. <LinearLayout
84. android:id="@+id/hiddenview"
85. android:layout_width="fill_parent"
86. android:layout_height="40dp"
87. android:gravity="center_vertical"
88. android:orientation="horizontal"
89. android:paddingLeft="1dp"
90. android:visibility="gone" >
91. <ImageView
92. android:contentDescription="avatar"
93. android:src="@drawable/avatar"
94. android:layout_width="wrap_content"
95. android:layout_height="wrap_content"
96. android:layout_gravity="center"/>
97. <TextView
98. android:id="@+id/hidden_text"
99. android:layout_width="wrap_content"
100. android:layout_height="fill_parent"
101. android:text="乐山好事，积极乐观" />
102. </LinearLayout>
103. </LinearLayout>
104. </LinearLayout>