Android Menu扇形菜单功能实现
程序员文章站
2024-03-24 10:33:04
...
公司新需求有个点击右下角一个按钮展开一个跟扇形菜单类似的功能，折腾了一会参照别人的教程自己稍微修改了下，符合自己项目的需求，在此记录下以免下次实现类似功能又忘记了，好记性不如烂笔头嘛。
先来张图需求是这样的：
借鉴了大神们的源码，那我们来看一下扇形菜单是怎么实现的代码就不怎么详细讲了，都有注释，看不懂的可以提问：
首先主界面note_layout.xml：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--扇形图标-->
<RelativeLayout
android:id="@+id/buttons_wrapper_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:clipChildren="false"
android:clipToPadding="false">
<ImageButton
android:id="@+id/button_photo"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="120dp"
android:layout_marginRight="55dp"
android:background="@drawable/casus"
android:visibility="gone" />
<ImageButton
android:id="@+id/button_people"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="60dp"
android:layout_marginRight="100dp"
android:background="@drawable/experience"
android:visibility="gone" />
<ImageButton
android:id="@+id/button_place"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="55dp"
android:background="@drawable/informal"
android:visibility="gone" />
</RelativeLayout>
<!--新建按钮-->Activity：
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.Toast;
/**
* 扇形菜单
* Created by admin on 2018/3/7.
*/
public class Module_NoteActivity extends AppCompatActivity implements View.OnClickListener {
private boolean isShowing;
private RelativeLayout buttons_wrapper_layout;
private RelativeLayout buttons_show_hide_button_layout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.note_layout);
initview();
MyAnimations.initOffset(Module_NoteActivity.this);
}
private void initview() {
buttons_wrapper_layout = (RelativeLayout) findViewById(R.id.buttons_wrapper_layout);//整个扇形布局
buttons_show_hide_button_layout = (RelativeLayout) findViewById(R.id.buttons_show_hide_button_layout);//新建按钮
buttons_show_hide_button_layout.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (!isShowing) {
MyAnimations.startAnimationsIn(buttons_wrapper_layout, 300);//按钮动画
} else {
MyAnimations.startAnimationsOut(buttons_wrapper_layout, 300);//按钮动画
}
isShowing = !isShowing;
}
});
//子菜单监听
for (int i = 0; i < buttons_wrapper_layout.getChildCount(); i++) {
buttons_wrapper_layout.getChildAt(i).setOnClickListener(new OnClickImageButton());
}
}
/**
* 按钮监听
*/
class OnClickImageButton implements View.OnClickListener {
@Override
public void onClick(View arg0) {
switch (arg0.getId()) {
case R.id.button_photo:
Toast.makeText(Module_NoteActivity.this, "案例", Toast.LENGTH_SHORT).show();
MyAnimations.startAnimationsOut(buttons_wrapper_layout, 300);//隐藏按钮
isShowing = !isShowing;
break;
case R.id.button_people:
Toast.makeText(Module_NoteActivity.this, "经验", Toast.LENGTH_SHORT).show();
MyAnimations.startAnimationsOut(buttons_wrapper_layout, 300);//隐藏按钮
isShowing = !isShowing;
break;
case R.id.button_place:
Toast.makeText(Module_NoteActivity.this, "随笔", Toast.LENGTH_SHORT).show();
MyAnimations.startAnimationsOut(buttons_wrapper_layout, 300);//隐藏按钮
isShowing = !isShowing;
break;
}
}
}
}动画实现：
import android.content.Context;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
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;
/**
* 动画控件
* Created by admin on 2018/3/8.
*/
public class MenuAnimations {
private static int xOffset = 15;
private static int yOffset = -13;
//获取屏幕的密度 context.getResources().getDisplayMetrics().density 设置移动的距离
public static void initOffset(Context context) {
xOffset = (int) (10 * context.getResources().getDisplayMetrics().density);//起点距离右边的距离
yOffset = -(int) (60 * 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(View.VISIBLE);
ViewGroup.MarginLayoutParams mlp = (ViewGroup.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);
ViewGroup.MarginLayoutParams mlp = (ViewGroup.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) {
}
//动画结束后，隐藏imageButton
@Override
public void onAnimationEnd(Animation arg0) {
inoutimagebutton.setVisibility(View.GONE);
}
});
inoutimagebutton.startAnimation(animation);
}
}
}