本文实例为大家分享了Android仿天猫加入购物车的具体代码,供大家参考,具体内容如下
先上效果图
实现思路:
首先,我们需要三个Imagview
第一个是原商品图片, 这个图片是布局文件中创建的 我们称作A
第二个是做动画的图片 这个我们是在代码中创建的 我们称作B
第三个是购物车图片 这个图片是布局文件中创建的 我们称作C
接着,我们需要将A图片设置给B
A图片一般是联网获取到的,给Imagview设置图片有两种方式
如果是通过setBackgroundDrawable 那么就通过getBackground()获取到Drawable对象,设置给B
如果是通过setImageDrawable 那么就通过getDrawable()获取到Drawable对象,设置给B
再接着 我们获取到A的位置 作为动画开始的位置 获取到C的位置 作为动画结束的位置
然后 创建动画图层,开始执行动画
这个动画集合中,包括: 水平位移匀速平移 竖直方向加速平移 缩放动画
最后 一定不要忘了 为我们的动画集合添加监听set.setAnimationListener
动画执行前让Imagview 可见 动画执行后让Imagview 不可见
下边是MainActivity中的代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
|
public class MainActivity extends Activity { private ImageView top; private ImageView bottom; private ImageView animImageView; private ViewGroup anim_mask_layout; // 动画层 @Override protected void onCreate(Bundle savedInstanceState) { super .onCreate(savedInstanceState); setContentView(R.layout.activity_main); top = (ImageView) findViewById(R.id.top); bottom = (ImageView) findViewById(R.id.bottom); } public void startAnim(View view) { // 记录开始的位置 int [] startLocation = new int [ 2 ]; // 一个整型数组,用来存储按钮的在屏幕的X、Y坐标 top.getLocationInWindow(startLocation); // 这是获取购买按钮的在屏幕的X、Y坐标(这也是动画开始的坐标) // 创建要做动画的ImageView animImageView = new ImageView( this ); // 设置animImageView的背景 Drawable background = top.getBackground(); Drawable zoomDrawable = zoomDrawable(background, dip2Px( this , 200 ), dip2Px( this , 200 )); animImageView.setBackgroundDrawable(zoomDrawable); // 开始执行动画 setAnim(animImageView, startLocation, top); } /** * 设置动画 * * @param v * @param startLocation * @param view */ private void setAnim( final View v, int [] startLocation, final View view) { anim_mask_layout = null ; anim_mask_layout = createAnimLayout(); anim_mask_layout.addView(v); // 把动画小球添加到动画层 final View viewa = addViewToAnimLayout(anim_mask_layout, v, startLocation); int [] endLocation = new int [ 2 ]; // 存储动画结束位置的X、Y坐标 bottom.getLocationInWindow(endLocation); // shopCart是那个购物车 // 计算位移 int endX = endLocation[ 0 ] - startLocation[ 0 ]; // 动画位移的X坐标 int endY = endLocation[ 1 ] - startLocation[ 1 ]; // 动画位移的y坐标 TranslateAnimation translateAnimationX = new TranslateAnimation( 0 , endX, 0 , 0 ); translateAnimationX.setInterpolator( new LinearInterpolator()); translateAnimationX.setRepeatCount( 0 ); // 动画重复执行的次数 translateAnimationX.setFillAfter( true ); TranslateAnimation translateAnimationY = new TranslateAnimation( 0 , 0 , 0 , endY); translateAnimationY.setInterpolator( new AccelerateInterpolator()); translateAnimationY.setRepeatCount( 0 ); // 动画重复执行的次数 translateAnimationX.setFillAfter( true ); ScaleAnimation scaleAnimation = new ScaleAnimation( 0 .6f, 0 .1f, 0 .6f, 0 .1f); scaleAnimation.setInterpolator( new AccelerateInterpolator()); scaleAnimation.setRepeatCount( 0 ); // 动画重复执行的次数 scaleAnimation.setFillAfter( true ); AnimationSet set = new AnimationSet( false ); set.setFillAfter( false ); set.addAnimation(scaleAnimation); set.addAnimation(translateAnimationY); set.addAnimation(translateAnimationX); set.setDuration( 600 ); // 动画的执行时间 viewa.startAnimation(set); // 动画监听事件 set.setAnimationListener( new AnimationListener() { // 动画的开始 @Override public void onAnimationStart(Animation animation) { v.setVisibility(View.VISIBLE); } @Override public void onAnimationRepeat(Animation animation) { } // 动画的结束 @Override public void onAnimationEnd(Animation animation) { v.setVisibility(View.GONE); } }); } /** * @Description: 创建动画层 * @param * @return void * @throws */ private ViewGroup createAnimLayout() { ViewGroup rootView = (ViewGroup) ((Activity) this ).getWindow() .getDecorView(); LinearLayout animLayout = new LinearLayout( this ); LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams( LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT); animLayout.setLayoutParams(lp); animLayout.setId(Integer.MAX_VALUE); animLayout.setBackgroundResource(android.R.color.transparent); rootView.addView(animLayout); return animLayout; } private View addViewToAnimLayout( final ViewGroup parent, final View view, int [] location) { int x = location[ 0 ]; int y = location[ 1 ]; LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams( LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT); lp.leftMargin = x; lp.topMargin = y; view.setLayoutParams(lp); return view; } /** * 将drawable对象进行指定大小的缩放 * * @param drawable * @param w * @param h * @return */ public Drawable zoomDrawable(Drawable drawable, int w, int h) { int width = drawable.getIntrinsicWidth(); int height = drawable.getIntrinsicHeight(); Bitmap oldbmp = drawableToBitmap(drawable); // drawable 转换成 bitmap Matrix matrix = new Matrix(); // 创建操作图片用的 Matrix 对象 float scaleWidth = (( float ) w / width); // 计算缩放比例 float scaleHeight = (( float ) h / height); matrix.postScale(scaleWidth, scaleHeight); // 设置缩放比例 Bitmap newbmp = Bitmap.createBitmap(oldbmp, 0 , 0 , width, height, matrix, true ); // 建立新的 bitmap ,其内容是对原 bitmap 的缩放后的图 return new BitmapDrawable(newbmp); // 把 bitmap 转换成 drawable 并返回 } /** * 将drawable 转换成 bitmap * * @param drawable * @return */ public Bitmap drawableToBitmap(Drawable drawable) { int width = drawable.getIntrinsicWidth(); // 取 drawable 的长宽 int height = drawable.getIntrinsicHeight(); Bitmap.Config config = drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888 : Bitmap.Config.RGB_565; // 取 drawable 的颜色格式 Bitmap bitmap = Bitmap.createBitmap(width, height, config); // 建立对应 // bitmap Canvas canvas = new Canvas(bitmap); // 建立对应 bitmap 的画布 drawable.setBounds( 0 , 0 , width, height); drawable.draw(canvas); // 把 drawable 内容画到画布中 return bitmap; } // dp转换为像素px public static int dip2Px(Context context, float dp) { final float scale = context.getResources().getDisplayMetrics().density; return ( int ) (dp * scale + 0 .5f); } } |
下边是布局文件中代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
< RelativeLayout 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" tools:context = "${relativePackage}.${activityClass}" > < ImageView android:id = "@+id/top" android:layout_width = "60dp" android:layout_height = "60dp" android:background = "@drawable/cart_product_img" android:onClick = "startAnim" /> < ImageView android:id = "@+id/bottom" android:layout_width = "60dp" android:layout_height = "60dp" android:layout_alignParentBottom = "true" android:layout_alignParentRight = "true" android:background = "@drawable/gouwuche_ico" /> </ RelativeLayout > |
点击这里下载源码
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。
原文链接:https://blog.csdn.net/Jeff169/article/details/51523916