模仿Path菜单按钮的效果

利用Animation动画实现Path菜单的效果。

首先说一下几个动画

1，RotateAnimation   是旋转动画，

new RotateAnimation(fromDegrees, toDegrees, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);

实例化时，包含6个参数，第一个参数是图片从多少角度开始，第二个参数是旋转到多少角度，第三个是x坐标的伸缩模式，Animation.RELATIVE_TO_SELF,是指以自身，第四个x坐标的伸缩比例，第五个第六个是y坐标的

2，new TranslateAnimation(0, toXDelta, 0, toYDelta)

包含四个参数比较容易理解，第一个x坐标开始位置，x坐标结束位置（都是相对当前坐标）同理3,4参数

3，new ScaleAnimation(1f, 2f, 1f, 2f);

缩放动画，第一个是x坐标开始时的缩放比例，第二个是x坐标结束时的缩放比例，3,4同理

4，new AlphaAnimation(1f, 0.3f);

透明度，0为完全透明，1为完全不透明，第一个参数是初始值，第二个是结束值

Path的按钮只是一个按钮，点击效果是，按钮旋转同时，弹出多个小按钮，再次点击按钮，旋转，回收小按钮。点击小按钮，按钮放大，进入相应的界面。

自己的做模仿效果，基本完成。xml文件如下

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout  
3.   xmlns:android="http://schemas.android.com/apk/res/android"  
4.   android:orientation="vertical"  
5.   android:layout_width="match_parent"  
6.   android:layout_height="match_parent"  
7.   android:background="@drawable/startup">  
8.       
9.     <Button   
10.         android:id="@+id/btn_composer_camera"  
11.         android:layout_width="30dip"  
12.         android:layout_height="30dip"  
13.         android:layout_marginLeft="40dip"  
14.         android:layout_alignParentBottom="true"  
15.         android:layout_marginBottom="40dip"  
16.         android:background="@drawable/composer_camera"  
17.     />  
18.       <Button   
19.         android:id="@+id/btn_composer_music"  
20.         android:layout_width="30dip"  
21.         android:layout_height="30dip"  
22.         android:layout_marginLeft="40dip"  
23.         android:layout_alignParentBottom="true"  
24.         android:layout_marginBottom="40dip"  
25.         android:background="@drawable/composer_music"  
26.     />  
27.       <Button   
28.         android:id="@+id/btn_composer_place"  
29.         android:layout_width="30dip"  
30.         android:layout_height="30dip"  
31.         android:layout_marginLeft="40dip"  
32.         android:layout_alignParentBottom="true"  
33.         android:layout_marginBottom="40dip"  
34.         android:background="@drawable/composer_place"  
35.     />  
36.       <Button   
37.         android:id="@+id/btn_composer_sleep"  
38.         android:layout_width="30dip"  
39.         android:layout_height="30dip"  
40.         android:layout_marginLeft="40dip"  
41.         android:layout_alignParentBottom="true"  
42.         android:layout_marginBottom="40dip"  
43.         android:background="@drawable/composer_sleep"  
44.     />  
45.       <Button   
46.         android:id="@+id/btn_composer_thought"  
47.         android:layout_width="30dip"  
48.         android:layout_height="30dip"  
49.         android:layout_marginLeft="40dip"  
50.         android:layout_alignParentBottom="true"  
51.         android:layout_marginBottom="40dip"  
52.         android:background="@drawable/composer_thought"  
53.     />  
54.       <Button   
55.         android:id="@+id/btn_composer_with"  
56.         android:layout_width="30dip"  
57.         android:layout_height="30dip"  
58.         android:layout_marginLeft="40dip"  
59.         android:layout_alignParentBottom="true"  
60.         android:layout_marginBottom="40dip"  
61.         android:background="@drawable/composer_with"  
62.     />  
63.       
64.         <RelativeLayout   
65.         android:layout_width="70dp"  
66.         android:layout_height="70dp"  
67.         android:layout_marginLeft="30dip"  
68.         android:layout_alignParentBottom="true"  
69.         android:layout_marginBottom="30dip"  
70.         android:background="@drawable/composer_button"  
71.     >  
72.         <Button   
73.             android:id="@+id/btn_composer"  
74.             android:layout_width="30dp"  
75.             android:layout_height="30dp"  
76.             android:background="@drawable/composer_icn_plus"  
77.             android:layout_centerInParent="true"  
78.             />  
79.     </RelativeLayout>  
80. </RelativeLayout>  

思路是将path按钮遮掩住小按钮，计算弹出来的位置，设置相应的动画。弹出来设置按钮可点击，收回去设置不可点击。

[java] view plaincopy

1. package com.ze.app.ImitatePath;  
2.   
3. import android.app.Activity;  
4. import android.os.Bundle;  
5. import android.view.Display;  
6. import android.view.View;  
7. import android.view.View.OnClickListener;  
8. import android.view.ViewGroup.MarginLayoutParams;  
9. import android.view.animation.AlphaAnimation;  
10. import android.view.animation.Animation;  
11. import android.view.animation.AnimationSet;  
12. import android.view.animation.RotateAnimation;  
13. import android.view.animation.ScaleAnimation;  
14. import android.view.animation.TranslateAnimation;  
15. import android.view.animation.Animation.AnimationListener;  
16. import android.widget.Button;  
17. import android.widget.RelativeLayout.LayoutParams;  
18.   
19. public class ImitatePathActivity extends Activity {  
20.     Button btn_main, btn_camera, btn_music, btn_with, btn_thought, btn_sleep, btn_place;  
21.     static int screen_width, screen_height;  
22.     Animation rotateAnimation, translateAnimation, scaleAnimation, alphaAnimation;  
23.     AnimationSet setAnimation;  
24.     static boolean isPress = false;  
25.     LayoutParams params = new LayoutParams(0,0);  
26.     int x,y;  
27.     /** Called when the activity is first created. */  
28.     @Override  
29.     public void onCreate(Bundle savedInstanceState) {  
30.         super.onCreate(savedInstanceState);  
31.         setContentView(R.layout.path_view);  
32.           
33.           
34.         setXY();  
35.         initWiget();  
36.     }  
37.     int composeX[],composeY[];  
38.     void setXY() {  
39.         composeX = new int[6];  
40.         composeY = new int[6];  
41.         for (int i = 0; i < 6; i++) {  
42.             composeX[i] = getX(90-i*18, 150);  
43.             composeY[i] = getY(90 - i*18, 150);  
44.         }  
45.     }  
46.     int getY(int degress, float r) {  
47.         return (int)(r * Math.sin(Math.PI*(degress/180f)));  
48.     }  
49.     int getX(int degress, float r) {  
50.         return (int)(r * Math.cos(Math.PI*(degress/180f)));  
51.     }  
52.     void initWiget() {  
53.         Display display = getWindowManager().getDefaultDisplay();  
54.         screen_height = display.getHeight();  
55.         screen_width = display.getWidth();  
56.         //用来根据比例缩放？  
57.         btn_main = (Button)findViewById(R.id.btn_composer);  
58.         btn_camera = (Button)findViewById(R.id.btn_composer_camera);  
59.         btn_music = (Button)findViewById(R.id.btn_composer_music);  
60.         btn_place = (Button)findViewById(R.id.btn_composer_place);  
61.         btn_with = (Button)findViewById(R.id.btn_composer_with);  
62.         btn_sleep = (Button)findViewById(R.id.btn_composer_sleep);  
63.         btn_thought = (Button)findViewById(R.id.btn_composer_thought);  
64.           
65.           
66.           
67.         btn_main.setOnClickListener(listener);  
68.         setOnclik(false);  
69.         bindListener();  
70.         initAnimation();  
71.           
72.     }  
73.     void initAnimation() {  
74.         setAnimation = new AnimationSet(true);  
75.         setAnimation.addAnimation(getAlphaAnimation());  
76.         setAnimation.addAnimation(getScaleAnimation());  
77.         setAnimation.setAnimationListener(new AnimationListener() {  
78.               
79.             @Override  
80.             public void onAnimationStart(Animation animation) {  
81.                 // TODO Auto-generated method stub  
82.                   
83.             }  
84.               
85.             @Override  
86.             public void onAnimationRepeat(Animation animation) {  
87.                 // TODO Auto-generated method stub  
88.                   
89.             }  
90.               
91.             @Override  
92.             public void onAnimationEnd(Animation animation) {  
93.                 // TODO Auto-generated method stub  
94.                 closeButton();  
95.             }  
96.         });  
97.     }  
98.     BtnOnclick listener = new BtnOnclick();  
99.     void bindListener() {  
100.         btn_camera.setOnClickListener(listener);  
101.         btn_thought.setOnClickListener(listener);  
102.         btn_music.setOnClickListener(listener);  
103.         btn_sleep.setOnClickListener(listener);  
104.         btn_with.setOnClickListener(listener);  
105.         btn_place.setOnClickListener(listener);  
106.     }  
107.     void setOnclik(boolean isSet) {  
108.         btn_camera.setClickable(isSet);  
109.         btn_music.setClickable(isSet);  
110.         btn_place.setClickable(isSet);  
111.         btn_with.setClickable(isSet);  
112.         btn_thought.setClickable(isSet);  
113.         btn_sleep.setClickable(isSet);  
114.     }  
115.     void openButton() {  
116.         isPress = true;  
117.         btn_main.startAnimation(getRotateAnimation(0f,-180-45f));  
118.           
119.         btn_camera.startAnimation(getTranslateAnimation(composeX[0]+15, -composeY[0]-15,btn_camera,composeX[0],composeY[0],180));  
120.         btn_with.startAnimation(getTranslateAnimation(composeX[1]+15, -composeY[1]-15,btn_with,composeX[1],composeY[1],160));  
121.         btn_music.startAnimation(getTranslateAnimation(composeX[2]+15, -composeY[2]-15, btn_music, composeX[2],composeY[2],120));  
122.         btn_place.startAnimation(getTranslateAnimation(composeX[3]+15, -composeY[3]-15, btn_place, composeX[3],composeY[3],120));  
123.         btn_sleep.startAnimation(getTranslateAnimation(composeX[4]+15, -composeY[4]-15, btn_sleep, composeX[4],composeY[4],160));  
124.         btn_thought.startAnimation(getTranslateAnimation(composeX[5]+15, -composeY[5]-15, btn_thought, composeX[5],composeY[5],180));  
125.           
126.         setOnclik(true);  
127.     }  
128.     void closeButton() {  
129.         isPress = false;  
130.         btn_main.startAnimation(getRotateAnimation(-180-45f,0f));  
131.         btn_camera.startAnimation(getTranslateAnimation(-composeX[0], composeY[0],btn_camera,-composeX[0],-composeY[0],180));  
132.         btn_with.startAnimation(getTranslateAnimation(-composeX[1], composeY[1],btn_with,-composeX[1],-composeY[1],160));  
133.         btn_music.startAnimation(getTranslateAnimation(-composeX[2], composeY[2], btn_music, -composeX[2],-composeY[2],120));  
134.         btn_place.startAnimation(getTranslateAnimation(-composeX[3], composeY[3], btn_place, -composeX[3],-composeY[3],120));  
135.         btn_sleep.startAnimation(getTranslateAnimation(-composeX[4], composeY[4], btn_sleep, -composeX[4],-composeY[4],160));  
136.         btn_thought.startAnimation(getTranslateAnimation(-composeX[5], composeY[5], btn_thought, -composeX[5],-composeY[5],180));  
137.         setOnclik(false);  
138.     }  
139.     class BtnOnclick implements OnClickListener {  
140.   
141.         @Override  
142.         public void onClick(View v) {  
143.             // TODO Auto-generated method stub  
144.             switch (v.getId()) {  
145.             case R.id.btn_composer:  
146.                 if (isPress) {  
147.                     closeButton();  
148.                     /* 
149.                     isPress = false; 
150.                     btn_main.startAnimation(getRotateAnimation(-180-45f,0f)); 
151.                      
152.                     btn_camera.startAnimation(getTranslateAnimation(0f, 150f, btn_camera, 0,-150,180)); 
153.                     btn_with.startAnimation(getTranslateAnimation(-30f, 120f, btn_with, -30, -120,160)); 
154.                     btn_music.startAnimation(getTranslateAnimation(-60f, 90f, btn_music, -60, -90,120)); 
155.                     btn_place.startAnimation(getTranslateAnimation(-90f, 60f, btn_place, -90, -60,120)); 
156.                     btn_sleep.startAnimation(getTranslateAnimation(-120f, 30f, btn_sleep, -120, -30,160)); 
157.                     btn_thought.startAnimation(getTranslateAnimation(-150f, 0f, btn_thought, -150,0,180)); 
158.                     */  
159.                     btn_camera.startAnimation(getTranslateAnimation(-composeX[0], composeY[0],btn_camera,-composeX[0],-composeY[0],180));  
160.                     btn_with.startAnimation(getTranslateAnimation(-composeX[1], composeY[1],btn_with,-composeX[1],-composeY[1],160));  
161.                     btn_music.startAnimation(getTranslateAnimation(-composeX[2], composeY[2], btn_music, -composeX[2],-composeY[2],120));  
162.                     btn_place.startAnimation(getTranslateAnimation(-composeX[3], composeY[3], btn_place, -composeX[3],-composeY[3],120));  
163.                     btn_sleep.startAnimation(getTranslateAnimation(-composeX[4], composeY[4], btn_sleep, -composeX[4],-composeY[4],160));  
164.                     btn_thought.startAnimation(getTranslateAnimation(-composeX[5], composeY[5], btn_thought, -composeX[5],-composeY[5],180));  
165.                     setOnclik(false);  
166.                 } else {  
167.                     //弹出效果  
168.                     openButton();  
169.                     /* 
170.                     isPress = true; 
171.                     btn_main.startAnimation(getRotateAnimation(0f,-180-45f)); 
172.                      
173.                     btn_camera.startAnimation(getTranslateAnimation(composeX[0]+15, -composeY[0]-15,btn_camera,composeX[0],composeY[0],180)); 
174.                     btn_with.startAnimation(getTranslateAnimation(composeX[1]+15, -composeY[1]-15,btn_with,composeX[1],composeY[1],160)); 
175.                     btn_music.startAnimation(getTranslateAnimation(composeX[2]+15, -composeY[2]-15, btn_music, composeX[2],composeY[2],120)); 
176.                     btn_place.startAnimation(getTranslateAnimation(composeX[3]+15, -composeY[3]-15, btn_place, composeX[3],composeY[3],120)); 
177.                     btn_sleep.startAnimation(getTranslateAnimation(composeX[4]+15, -composeY[4]-15, btn_sleep, composeX[4],composeY[4],160)); 
178.                     btn_thought.startAnimation(getTranslateAnimation(composeX[5]+15, -composeY[5]-15, btn_thought, composeX[5],composeY[5],180)); 
179.                      
180.                     setOnclik(true); 
181.                      
182.                      
183.                     btn_camera.startAnimation(getTranslateAnimation(0f, -180f,btn_camera,getX(90, 150),getY(90,150),180)); 
184.                     btn_with.startAnimation(getTranslateAnimation(30f, -150f,btn_with,getX(72, 150),getY(72,150),160)); 
185.                     btn_music.startAnimation(getTranslateAnimation(60f, -120f, btn_music, getX(54, 150),getY(54,150),120)); 
186.                     btn_place.startAnimation(getTranslateAnimation(90f, -90f, btn_place, getX(36, 150),getY(36,150),120)); 
187.                     btn_sleep.startAnimation(getTranslateAnimation(120f, -60f, btn_sleep, getX(18, 150),getY(18,150),160)); 
188.                     btn_thought.startAnimation(getTranslateAnimation(150f, -30f, btn_thought, getX(0, 150),getY(0,150),180)); 
189.                     /* 
190.                     btn_camera.startAnimation(getTranslateAnimation(0f, -180f,btn_camera,0,150,180)); 
191.                     btn_with.startAnimation(getTranslateAnimation(30f, -150f,btn_with,30,120,160)); 
192.                     btn_music.startAnimation(getTranslateAnimation(60f, -120f, btn_music, 60, 90,120)); 
193.                     btn_place.startAnimation(getTranslateAnimation(90f, -90f, btn_place, 90, 60,120)); 
194.                     btn_sleep.startAnimation(getTranslateAnimation(120f, -60f, btn_sleep, 120, 30,160)); 
195.                     btn_thought.startAnimation(getTranslateAnimation(150f, -30f, btn_thought, 150, 0,180)); 
196.                     */  
197.                 }  
198.                   
199.                 break;  
200.             case R.id.btn_composer_camera:   
201.                     btn_camera.startAnimation(setAnimation);  
202.                 break;  
203.             case R.id.btn_composer_music:   
204.                 btn_music.startAnimation(setAnimation);  
205.             break;  
206.             case R.id.btn_composer_place:   
207.                 btn_place.startAnimation(setAnimation);  
208.             break;  
209.             case R.id.btn_composer_sleep:   
210.                 btn_sleep.startAnimation(setAnimation);  
211.             break;  
212.             case R.id.btn_composer_thought:   
213.                 btn_thought.startAnimation(setAnimation);  
214.             break;  
215.             case R.id.btn_composer_with:   
216.                 btn_with.startAnimation(setAnimation);  
217.             break;  
218.             default:  
219.                 break;  
220.             }  
221.         }  
222.           
223.     }  
224.       
225.     public Animation getRotateAnimation(float fromDegrees, float toDegrees) {  
226.         rotateAnimation = new RotateAnimation(fromDegrees, toDegrees, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);  
227.         rotateAnimation.setDuration(300);  
228.         rotateAnimation.setFillAfter(true);  
229.         return rotateAnimation;  
230.     }  
231.       
232.     public Animation getTranslateAnimation(float toXDelta, float toYDelta,final View view, final int marginLeft, final int marginBottom, long time) {  
233.         /* 
234.         translateAnimation = new TranslateAnimation(0, toXDelta, 0, toYDelta); 
235.         rotateAnimation.setDuration(time); 
236.         MarginLayoutParams params = (MarginLayoutParams)view.getLayoutParams(); 
237.         System.out.println(params.bottomMargin + " " + params.leftMargin); 
238.         params.setMargins(params.leftMargin + marginLeft, 0, 0, params.bottomMargin + marginBottom); 
239.         view.setLayoutParams(params); 
240.         translateAnimation.setInterpolator(new OvershootInterpolator(2F)); 
241.         return translateAnimation; 
242.         */  
243.         translateAnimation = new TranslateAnimation(0, toXDelta, 0, toYDelta);  
244.         translateAnimation.setDuration(time);  
245.         translateAnimation.setAnimationListener(new AnimationListener() {  
246.               
247.             @Override  
248.             public void onAnimationStart(Animation animation) {  
249.                 // TODO Auto-generated method stub  
250.                   
251.             }  
252.               
253.             @Override  
254.             public void onAnimationRepeat(Animation animation) {  
255.                 // TODO Auto-generated method stub  
256.                   
257.             }  
258.               
259.             @Override  
260.             public void onAnimationEnd(Animation animation) {  
261.                 // TODO Auto-generated method stub  
262.             //  LayoutParams params = new android.widget.RelativeLayout.LayoutParams(0,0);   //引包不同出现不同结果  
263.                 MarginLayoutParams params = (MarginLayoutParams) view.getLayoutParams();  
264.                 params.width = 40;  
265.                 params.height = 40;  
266.                 System.out.println(params.leftMargin + " " + params.bottomMargin);  
267.                 params.setMargins(params.leftMargin + marginLeft, 0, 0,params.bottomMargin + marginBottom);  
268.                 view.setLayoutParams(params);  
269.                 view.clearAnimation();  
270.             }  
271.         });  
272.       
273.         return translateAnimation;  
274.     }  
275.       
276.     public Animation getScaleAnimation() {  
277.         scaleAnimation = new ScaleAnimation(1f, 2f, 1f, 2f);  
278.         scaleAnimation.setDuration(500);  
279.         return scaleAnimation;  
280.     }  
281.     public Animation getAlphaAnimation() {  
282.         alphaAnimation = new AlphaAnimation(1f, 0.3f);  
283.         alphaAnimation.setDuration(500);  
284.         return alphaAnimation;  
285.     }  
286. }