Android自定义控件:老版优酷的三级菜单(效果图 + Demo)

时间:2022-03-30 20:35:15

效果图:

Android自定义控件:老版优酷的三级菜单(效果图 + Demo)


制作思路:

1、先分析这个效果,其实可以理解为把三级菜单分成level1,level2,level3,level1是始终显示的。点击level1后,level2会出现;点击level2后,level3会出现;level2,level3出现后,点击level1,level2和level3都会消失。然后消失和出现我们用到了一个动画效果。

2、动画效果用到的是RotateAnimation,由于我们都是用同一个效果,那么我们只要写一个类,把效果实现了就可以了。要是使用RotateAnimation的话,我们会不断的复用一些代码,这样开发的效率会比较低。

3、RotateAnimation的旋转进入和旋转出去是个坑——因为他是在X轴顺时针方向旋转的。大家可以看看图:

Android自定义控件:老版优酷的三级菜单(效果图 + Demo)

整体思路就是这样,接下来就是一些操作了:

代码:

1、MyAnimation类:

public class MyAnimation{
public static void animationIn(View view){
animationIn(view,0);
}

public static void animationOut(View view){
animationOut(view,0);
}

public static void animationIn(View view,long delay){
RotateAnimation animation = new RotateAnimation(180, 360, view.getWidth()/2, view.getHeight());
animation.setDuration(500);
animation.setFillAfter(true);
animation.setStartOffset(delay);

view.startAnimation(animation);
}

public static void animationOut(View view,long delay){
RotateAnimation animation = new RotateAnimation(0, 180, view.getWidth()/2, view.getHeight());
animation.setDuration(500);
animation.setFillAfter(true);
animation.setStartOffset(delay);

view.startAnimation(animation);
}
}

2、MainActivity类:

public class MainActivity extends Activity implements OnClickListener{
private boolean isLevel2showed,isLevel3showed;

private RelativeLayout level1,level2,level3;
private ImageButton home,menu;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

isLevel2showed = false;
isLevel3showed = false;
initLayout();
initImageButton();
}

public void initLayout() {
level1 = (RelativeLayout)findViewById(R.id.relate_level1);
level2 = (RelativeLayout)findViewById(R.id.relate_level2);
level3 = (RelativeLayout)findViewById(R.id.relate_level3);

level2.setVisibility(View.INVISIBLE);
level3.setVisibility(View.INVISIBLE);
}

public void initImageButton() {
home = (ImageButton)level1.findViewById(R.id.home);
menu = (ImageButton)level2.findViewById(R.id.menu);

home.setOnClickListener(this);
menu.setOnClickListener(this);
}

@Override
public void onClick(View v) {
switch(v.getId()){
case R.id.home:
if(!isLevel2showed){
isLevel2showed = true;
MyAnimation.animationIn(level2);
}else if(!isLevel3showed){
isLevel2showed = false;
MyAnimation.animationOut(level2);
}else{
isLevel2showed = false;
isLevel3showed = false;
MyAnimation.animationOut(level3);
MyAnimation.animationOut(level2,500);
}

break;
case R.id.menu:
if(!isLevel3showed){
isLevel3showed = true;
MyAnimation.animationIn(level3);
}else{
isLevel3showed = false;
MyAnimation.animationOut(level3);
}
break;
}
}
}


源码下载