先上效果图
主界面布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/default_homebg"> <RelativeLayout android:id="@+id/composer_buttons_wrapper" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:clipChildren="false" android:clipToPadding="false" > <ImageButton android:id="@+id/composer_button_photo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginBottom="142dp" android:layout_marginRight="10.667dp" android:background="@drawable/composer_camera" android:visibility="gone" /> <ImageButton android:id="@+id/composer_button_people" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginBottom="135.333dp" android:layout_marginRight="52dp" android:background="@drawable/composer_with" android:visibility="gone" /> <ImageButton android:id="@+id/composer_button_place" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginBottom="116.666dp" android:layout_marginRight="89.33333333333333dp" android:background="@drawable/composer_place" android:visibility="gone" /> <ImageButton android:id="@+id/composer_button_music" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginBottom="87.33333333333333dp" android:layout_marginRight="118.6666666666667dp" android:background="@drawable/composer_music" android:visibility="gone" /> <ImageButton android:id="@+id/composer_button_thought" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginBottom="50dp" android:layout_marginRight="137.3333333333333dp" android:background="@drawable/composer_thought" android:visibility="gone" /> <ImageButton android:id="@+id/composer_button_sleep" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginBottom="8.666666666666667dp" android:layout_marginRight="144dp" android:background="@drawable/composer_sleep" android:visibility="gone" /> </RelativeLayout> <RelativeLayout android:id="@+id/composer_buttons_show_hide_button" android:layout_width="60dp" android:layout_height="57.33333333333333dp" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:background="@drawable/composer_button" > <ImageView android:id="@+id/composer_buttons_show_hide_button_icon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:src="@drawable/composer_icn_plus" /> </RelativeLayout> </RelativeLayout>
两个动画文件(in和out)
<?xml version="1.0" encoding="UTF-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/linear_interpolator" android:duration="150" android:fromDegrees="0.0" android:toDegrees="-225.0" android:pivotX="50.0%" android:pivotY="50.0%" android:fillAfter="true" android:fillEnabled="true" />
<?xml version="1.0" encoding="UTF-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/linear_interpolator" android:duration="150" android:fromDegrees="-225.0" android:toDegrees="0.0" android:pivotX="50.0%" android:pivotY="50.0%" android:fillAfter="true" android:fillEnabled="true" />
动画类文件
import android.content.Context; import android.view.ViewGroup; import android.view.ViewGroup.MarginLayoutParams; import android.view.animation.Animation; import android.view.animation.AnticipateInterpolator; import android.view.animation.OvershootInterpolator; import android.view.animation.RotateAnimation; import android.view.animation.TranslateAnimation; import android.widget.ImageButton; public class MyAnimations{ private static int xOffset = 15; private static int yOffset = -13; public static void initOffset(Context context){//鐢卞竷灞�枃浠� xOffset = (int) (10.667 *context.getResources().getDisplayMetrics().density); yOffset = -(int) (8.667 *context.getResources().getDisplayMetrics().density); } public static Animation getRotateAnimation(float fromDegrees ,float toDegrees,int durationMillis){ RotateAnimation rotate = new RotateAnimation(fromDegrees, toDegrees, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); rotate.setDuration(durationMillis); rotate.setFillAfter(true); return rotate; } public static void startAnimationsIn(ViewGroup viewgroup,int durationMillis) { for (int i = 0; i < viewgroup.getChildCount(); i++) { ImageButton inoutimagebutton = (ImageButton) viewgroup .getChildAt(i); inoutimagebutton.setVisibility(0); MarginLayoutParams mlp = (MarginLayoutParams) inoutimagebutton.getLayoutParams(); Animation animation = new TranslateAnimation(mlp.rightMargin-xOffset,0F,yOffset + mlp.bottomMargin, 0F); animation.setFillAfter(true);animation.setDuration(durationMillis); animation.setStartOffset((i * 100) / (-1 + viewgroup.getChildCount())); animation.setInterpolator(new OvershootInterpolator(2F)); inoutimagebutton.startAnimation(animation); } } public static void startAnimationsOut(ViewGroup viewgroup,int durationMillis) { for (int i = 0; i < viewgroup.getChildCount(); i++) { final ImageButton inoutimagebutton = (ImageButton) viewgroup .getChildAt(i); MarginLayoutParams mlp = (MarginLayoutParams) inoutimagebutton.getLayoutParams(); Animation animation = new TranslateAnimation(0F,mlp.rightMargin-xOffset, 0F,yOffset + mlp.bottomMargin); animation.setFillAfter(true);animation.setDuration(durationMillis); animation.setStartOffset(((viewgroup.getChildCount()-i) * 100) / (-1 + viewgroup.getChildCount()));//椤哄簭鍊掍竴涓嬫瘮杈冭垝鏈� animation.setInterpolator(new AnticipateInterpolator(2F)); animation.setAnimationListener(new Animation.AnimationListener() { @Override public void onAnimationStart(Animation arg0) {} @Override public void onAnimationRepeat(Animation arg0) {} @Override public void onAnimationEnd(Animation arg0) { // TODO Auto-generated method stub inoutimagebutton.setVisibility(8); } }); inoutimagebutton.startAnimation(animation); } } }
最后是主界面activity文件
import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.widget.ImageView; import android.widget.RelativeLayout; public class PathMenuActivity extends Activity { /** Called when the activity is first created. */ private boolean areButtonsShowing; private RelativeLayout composerButtonsWrapper; private ImageView composerButtonsShowHideButtonIcon; private RelativeLayout composerButtonsShowHideButton; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); MyAnimations.initOffset(PathMenuActivity.this); composerButtonsWrapper = (RelativeLayout) findViewById(R.id.composer_buttons_wrapper); composerButtonsShowHideButton = (RelativeLayout) findViewById(R.id.composer_buttons_show_hide_button); composerButtonsShowHideButtonIcon = (ImageView) findViewById(R.id.composer_buttons_show_hide_button_icon); composerButtonsShowHideButton.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { if (!areButtonsShowing) { MyAnimations.startAnimationsIn(composerButtonsWrapper, 300); composerButtonsShowHideButtonIcon .startAnimation(MyAnimations.getRotateAnimation(0, -270, 300)); } else { MyAnimations .startAnimationsOut(composerButtonsWrapper, 300); composerButtonsShowHideButtonIcon .startAnimation(MyAnimations.getRotateAnimation( -270, 0, 300)); } areButtonsShowing = !areButtonsShowing; } }); for (int i = 0; i < composerButtonsWrapper.getChildCount(); i++) { composerButtonsWrapper.getChildAt(i).setOnClickListener( new View.OnClickListener() { @Override public void onClick(View arg0) { } }); } composerButtonsShowHideButton.startAnimation(MyAnimations .getRotateAnimation(0, 360, 200)); } }