模仿Path菜单按钮的效果

来源:互联网 发布:晨枫网络是真的吗 编辑:程序博客网 时间:2024/05/19 02:44

利用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文件如下

<?xml version="1.0" encoding="utf-8"?><RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"  android:orientation="vertical"  android:layout_width="match_parent"  android:layout_height="match_parent"  android:background="@drawable/startup">      <Button   android:id="@+id/btn_composer_camera"  android:layout_width="30dip"  android:layout_height="30dip"  android:layout_marginLeft="40dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="40dip"  android:background="@drawable/composer_camera"  />    <Button   android:id="@+id/btn_composer_music"  android:layout_width="30dip"  android:layout_height="30dip"  android:layout_marginLeft="40dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="40dip"  android:background="@drawable/composer_music"  />    <Button   android:id="@+id/btn_composer_place"  android:layout_width="30dip"  android:layout_height="30dip"  android:layout_marginLeft="40dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="40dip"  android:background="@drawable/composer_place"  />    <Button   android:id="@+id/btn_composer_sleep"  android:layout_width="30dip"  android:layout_height="30dip"  android:layout_marginLeft="40dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="40dip"  android:background="@drawable/composer_sleep"  />    <Button   android:id="@+id/btn_composer_thought"  android:layout_width="30dip"  android:layout_height="30dip"  android:layout_marginLeft="40dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="40dip"  android:background="@drawable/composer_thought"  />    <Button   android:id="@+id/btn_composer_with"  android:layout_width="30dip"  android:layout_height="30dip"  android:layout_marginLeft="40dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="40dip"  android:background="@drawable/composer_with"  />    <RelativeLayout   android:layout_width="70dp"  android:layout_height="70dp"  android:layout_marginLeft="30dip"  android:layout_alignParentBottom="true"  android:layout_marginBottom="30dip"  android:background="@drawable/composer_button"  >  <Button   android:id="@+id/btn_composer"  android:layout_width="30dp"  android:layout_height="30dp"  android:background="@drawable/composer_icn_plus"  android:layout_centerInParent="true"  />  </RelativeLayout></RelativeLayout>


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

package com.ze.app.ImitatePath;import android.app.Activity;import android.os.Bundle;import android.view.Display;import android.view.View;import android.view.View.OnClickListener;import android.view.ViewGroup.MarginLayoutParams;import android.view.animation.AlphaAnimation;import android.view.animation.Animation;import android.view.animation.AnimationSet;import android.view.animation.RotateAnimation;import android.view.animation.ScaleAnimation;import android.view.animation.TranslateAnimation;import android.view.animation.Animation.AnimationListener;import android.widget.Button;import android.widget.RelativeLayout.LayoutParams;public class ImitatePathActivity extends Activity {Button btn_main, btn_camera, btn_music, btn_with, btn_thought, btn_sleep, btn_place;static int screen_width, screen_height;Animation rotateAnimation, translateAnimation, scaleAnimation, alphaAnimation;AnimationSet setAnimation;static boolean isPress = false;LayoutParams params = new LayoutParams(0,0);int x,y;    /** Called when the activity is first created. */    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.path_view);                        setXY();        initWiget();    }    int composeX[],composeY[];    void setXY() {    composeX = new int[6];    composeY = new int[6];    for (int i = 0; i < 6; i++) {composeX[i] = getX(90-i*18, 150);composeY[i] = getY(90 - i*18, 150);}    }    int getY(int degress, float r) {    return (int)(r * Math.sin(Math.PI*(degress/180f)));    }    int getX(int degress, float r) {    return (int)(r * Math.cos(Math.PI*(degress/180f)));    }    void initWiget() {    Display display = getWindowManager().getDefaultDisplay();    screen_height = display.getHeight();    screen_width = display.getWidth();    //用来根据比例缩放?    btn_main = (Button)findViewById(R.id.btn_composer);    btn_camera = (Button)findViewById(R.id.btn_composer_camera);    btn_music = (Button)findViewById(R.id.btn_composer_music);    btn_place = (Button)findViewById(R.id.btn_composer_place);    btn_with = (Button)findViewById(R.id.btn_composer_with);    btn_sleep = (Button)findViewById(R.id.btn_composer_sleep);    btn_thought = (Button)findViewById(R.id.btn_composer_thought);                btn_main.setOnClickListener(listener);    setOnclik(false);    bindListener();    initAnimation();        }    void initAnimation() {    setAnimation = new AnimationSet(true);    setAnimation.addAnimation(getAlphaAnimation());    setAnimation.addAnimation(getScaleAnimation());    setAnimation.setAnimationListener(new AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {// TODO Auto-generated method stub}@Overridepublic void onAnimationRepeat(Animation animation) {// TODO Auto-generated method stub}@Overridepublic void onAnimationEnd(Animation animation) {// TODO Auto-generated method stubcloseButton();}});    }    BtnOnclick listener = new BtnOnclick();    void bindListener() {    btn_camera.setOnClickListener(listener);    btn_thought.setOnClickListener(listener);    btn_music.setOnClickListener(listener);    btn_sleep.setOnClickListener(listener);    btn_with.setOnClickListener(listener);    btn_place.setOnClickListener(listener);    }    void setOnclik(boolean isSet) {    btn_camera.setClickable(isSet);    btn_music.setClickable(isSet);    btn_place.setClickable(isSet);    btn_with.setClickable(isSet);    btn_thought.setClickable(isSet);    btn_sleep.setClickable(isSet);    }    void openButton() {    isPress = true;btn_main.startAnimation(getRotateAnimation(0f,-180-45f));btn_camera.startAnimation(getTranslateAnimation(composeX[0]+15, -composeY[0]-15,btn_camera,composeX[0],composeY[0],180));btn_with.startAnimation(getTranslateAnimation(composeX[1]+15, -composeY[1]-15,btn_with,composeX[1],composeY[1],160));btn_music.startAnimation(getTranslateAnimation(composeX[2]+15, -composeY[2]-15, btn_music, composeX[2],composeY[2],120));btn_place.startAnimation(getTranslateAnimation(composeX[3]+15, -composeY[3]-15, btn_place, composeX[3],composeY[3],120));btn_sleep.startAnimation(getTranslateAnimation(composeX[4]+15, -composeY[4]-15, btn_sleep, composeX[4],composeY[4],160));btn_thought.startAnimation(getTranslateAnimation(composeX[5]+15, -composeY[5]-15, btn_thought, composeX[5],composeY[5],180));setOnclik(true);    }    void closeButton() {    isPress = false;btn_main.startAnimation(getRotateAnimation(-180-45f,0f));btn_camera.startAnimation(getTranslateAnimation(-composeX[0], composeY[0],btn_camera,-composeX[0],-composeY[0],180));btn_with.startAnimation(getTranslateAnimation(-composeX[1], composeY[1],btn_with,-composeX[1],-composeY[1],160));btn_music.startAnimation(getTranslateAnimation(-composeX[2], composeY[2], btn_music, -composeX[2],-composeY[2],120));btn_place.startAnimation(getTranslateAnimation(-composeX[3], composeY[3], btn_place, -composeX[3],-composeY[3],120));btn_sleep.startAnimation(getTranslateAnimation(-composeX[4], composeY[4], btn_sleep, -composeX[4],-composeY[4],160));btn_thought.startAnimation(getTranslateAnimation(-composeX[5], composeY[5], btn_thought, -composeX[5],-composeY[5],180));setOnclik(false);    }    class BtnOnclick implements OnClickListener {@Overridepublic void onClick(View v) {// TODO Auto-generated method stubswitch (v.getId()) {case R.id.btn_composer:if (isPress) {closeButton();/*isPress = false;btn_main.startAnimation(getRotateAnimation(-180-45f,0f));btn_camera.startAnimation(getTranslateAnimation(0f, 150f, btn_camera, 0,-150,180));btn_with.startAnimation(getTranslateAnimation(-30f, 120f, btn_with, -30, -120,160));btn_music.startAnimation(getTranslateAnimation(-60f, 90f, btn_music, -60, -90,120));btn_place.startAnimation(getTranslateAnimation(-90f, 60f, btn_place, -90, -60,120));btn_sleep.startAnimation(getTranslateAnimation(-120f, 30f, btn_sleep, -120, -30,160));btn_thought.startAnimation(getTranslateAnimation(-150f, 0f, btn_thought, -150,0,180));*/btn_camera.startAnimation(getTranslateAnimation(-composeX[0], composeY[0],btn_camera,-composeX[0],-composeY[0],180));btn_with.startAnimation(getTranslateAnimation(-composeX[1], composeY[1],btn_with,-composeX[1],-composeY[1],160));btn_music.startAnimation(getTranslateAnimation(-composeX[2], composeY[2], btn_music, -composeX[2],-composeY[2],120));btn_place.startAnimation(getTranslateAnimation(-composeX[3], composeY[3], btn_place, -composeX[3],-composeY[3],120));btn_sleep.startAnimation(getTranslateAnimation(-composeX[4], composeY[4], btn_sleep, -composeX[4],-composeY[4],160));btn_thought.startAnimation(getTranslateAnimation(-composeX[5], composeY[5], btn_thought, -composeX[5],-composeY[5],180));setOnclik(false);} else {//弹出效果openButton();/*isPress = true;btn_main.startAnimation(getRotateAnimation(0f,-180-45f));btn_camera.startAnimation(getTranslateAnimation(composeX[0]+15, -composeY[0]-15,btn_camera,composeX[0],composeY[0],180));btn_with.startAnimation(getTranslateAnimation(composeX[1]+15, -composeY[1]-15,btn_with,composeX[1],composeY[1],160));btn_music.startAnimation(getTranslateAnimation(composeX[2]+15, -composeY[2]-15, btn_music, composeX[2],composeY[2],120));btn_place.startAnimation(getTranslateAnimation(composeX[3]+15, -composeY[3]-15, btn_place, composeX[3],composeY[3],120));btn_sleep.startAnimation(getTranslateAnimation(composeX[4]+15, -composeY[4]-15, btn_sleep, composeX[4],composeY[4],160));btn_thought.startAnimation(getTranslateAnimation(composeX[5]+15, -composeY[5]-15, btn_thought, composeX[5],composeY[5],180));setOnclik(true);btn_camera.startAnimation(getTranslateAnimation(0f, -180f,btn_camera,getX(90, 150),getY(90,150),180));btn_with.startAnimation(getTranslateAnimation(30f, -150f,btn_with,getX(72, 150),getY(72,150),160));btn_music.startAnimation(getTranslateAnimation(60f, -120f, btn_music, getX(54, 150),getY(54,150),120));btn_place.startAnimation(getTranslateAnimation(90f, -90f, btn_place, getX(36, 150),getY(36,150),120));btn_sleep.startAnimation(getTranslateAnimation(120f, -60f, btn_sleep, getX(18, 150),getY(18,150),160));btn_thought.startAnimation(getTranslateAnimation(150f, -30f, btn_thought, getX(0, 150),getY(0,150),180));/*btn_camera.startAnimation(getTranslateAnimation(0f, -180f,btn_camera,0,150,180));btn_with.startAnimation(getTranslateAnimation(30f, -150f,btn_with,30,120,160));btn_music.startAnimation(getTranslateAnimation(60f, -120f, btn_music, 60, 90,120));btn_place.startAnimation(getTranslateAnimation(90f, -90f, btn_place, 90, 60,120));btn_sleep.startAnimation(getTranslateAnimation(120f, -60f, btn_sleep, 120, 30,160));btn_thought.startAnimation(getTranslateAnimation(150f, -30f, btn_thought, 150, 0,180));*/}break;case R.id.btn_composer_camera: btn_camera.startAnimation(setAnimation);break;case R.id.btn_composer_music: btn_music.startAnimation(setAnimation);break;case R.id.btn_composer_place: btn_place.startAnimation(setAnimation);break;case R.id.btn_composer_sleep: btn_sleep.startAnimation(setAnimation);break;case R.id.btn_composer_thought: btn_thought.startAnimation(setAnimation);break;case R.id.btn_composer_with: btn_with.startAnimation(setAnimation);break;default:break;}}        }        public Animation getRotateAnimation(float fromDegrees, float toDegrees) {    rotateAnimation = new RotateAnimation(fromDegrees, toDegrees, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);    rotateAnimation.setDuration(300);    rotateAnimation.setFillAfter(true);    return rotateAnimation;    }        public Animation getTranslateAnimation(float toXDelta, float toYDelta,final View view, final int marginLeft, final int marginBottom, long time) {    /*    translateAnimation = new TranslateAnimation(0, toXDelta, 0, toYDelta);    rotateAnimation.setDuration(time);    MarginLayoutParams params = (MarginLayoutParams)view.getLayoutParams();    System.out.println(params.bottomMargin + " " + params.leftMargin);    params.setMargins(params.leftMargin + marginLeft, 0, 0, params.bottomMargin + marginBottom);    view.setLayoutParams(params);    translateAnimation.setInterpolator(new OvershootInterpolator(2F));    return translateAnimation;    */    translateAnimation = new TranslateAnimation(0, toXDelta, 0, toYDelta);    translateAnimation.setDuration(time);    translateAnimation.setAnimationListener(new AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {// TODO Auto-generated method stub}@Overridepublic void onAnimationRepeat(Animation animation) {// TODO Auto-generated method stub}@Overridepublic void onAnimationEnd(Animation animation) {// TODO Auto-generated method stub//LayoutParams params = new android.widget.RelativeLayout.LayoutParams(0,0);   //引包不同出现不同结果MarginLayoutParams params = (MarginLayoutParams) view.getLayoutParams();    params.width = 40;    params.height = 40;    System.out.println(params.leftMargin + " " + params.bottomMargin);    params.setMargins(params.leftMargin + marginLeft, 0, 0,params.bottomMargin + marginBottom);    view.setLayoutParams(params);    view.clearAnimation();}});        return translateAnimation;    }        public Animation getScaleAnimation() {    scaleAnimation = new ScaleAnimation(1f, 2f, 1f, 2f);    scaleAnimation.setDuration(500);    return scaleAnimation;    }    public Animation getAlphaAnimation() {    alphaAnimation = new AlphaAnimation(1f, 0.3f);    alphaAnimation.setDuration(500);    return alphaAnimation;    }}