博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Android--简单的三级菜单
阅读量:6878 次
发布时间:2019-06-26

本文共 2705 字,大约阅读时间需要 9 分钟。

 

关于这个菜单应该在很多播放器应用里面可以看见,直接先上两张效果图吧,一张是该Demo的效果图,一张是优酷手机客户端的效果图。

                                                       

       DEMO的效果图                                                                   优酷手机客户端界面

因为没有时间去自己制作图标,所以Demo里面采用的就是优酷手机客户端里的图标了。

一、布局

首先从效果图中可以看出来,该菜单界面分成了三层,所以,我们采用RelativeLayout布局方式来排列这三层菜单背景。

其次,在每一层菜单中,每一个图标也是相对于自己菜单级有固定位置的,所以每一个菜单级也采用RelativeLayout布局方式。

既然布局方式都分析清楚了,那么就可以直接开始写布局文件了。需要注意的就是,每一个图标之间相对位置的摆放,这样才能使整体效果更好。

 

二、MainActivity加载布局文件

在MainActivity.java中,通过onCreate()方法,来加载出布局文件。

三、实现动画效果和点击事件

首先分析可以得出,每一级菜单消失和出现的动画都是相似的,所以可以在此建立一个工具类,来统一编写动画效果的代码,在此建立MyUtils.java

整体的动画效果就分为,消失和出现,所以只用实现这两个方法就好了。

/**	 * 出现的动画效果
* @param view   需要动画效果的view
* @startOffset  需要延时执行的时间	 */	public static void startAnimIn(RelativeLayout view, int startOffset) {		RotateAnimation animation = new RotateAnimation(180, 360, view.getWidth()/2, view.getHeight());		animation.setDuration(500);		      // 设置运行的时间		animation.setFillAfter(true);	              // 动画执行完以后保持最后的状态		animation.setStartOffset(startOffset);        // 设置延时执行的时间		view.startAnimation(animation);	}
在代码中,采用了RotateAnimation这个类,来控制view的动画效果。
我们需要的是一个旋转的动画效果,所以我们需要知道默认圆心为 view的左上角,在此需要设置为 view的中心,即(view.getWidth()/2, view.getHeight())
根据同样的道理,只需要修改一样动画效果的旋转角度,就可以写出消失动画的效果
/**	 * 让指定view 延时执行旋转离开的动画	 * @param view	 * @param i	延时时间	 */	public static void startAnimOut(RelativeLayout view, int startOffset) {				RotateAnimation animation = new RotateAnimation(0, 180, view.getWidth()/2, view.getHeight());		animation.setDuration(500);		        // 设置运行的时间		animation.setFillAfter(true);	                // 动画执行完以后保持最后的状态		animation.setStartOffset(startOffset);		// 设置延时执行的时间		view.startAnimation(animation);	}
动画效果的类完成之后,就可以返回MainActivity中去监听按键的点击事件了。
@Override	public void onClick(View v) {		switch (v.getId()) {		case R.id.icon_menu:		// 处理menu图标的点击事件			// 如果第三级菜单是显示状态,则将其隐藏			if(isLevel3Show) {				// 隐藏				MyUtils.startAnimOut(level3,0);			} else {				// 显示				MyUtils.startAnimIn(level3,0);			}						isLevel3Show = !isLevel3Show;						break;					case R.id.icon_home:		// 处理home图标的点击事件			// 如果二级菜单是显示状态,那么就隐藏2,3级菜单			if(isLevel2Show ) {				MyUtils.startAnimOut(level2,0);				isLevel2Show = false;				if(isLevel3Show) {					MyUtils.startAnimOut(level3,200);					isLevel3Show = false;				} 			} else {				// 如果二级菜单是隐藏状态,那么就显示2级菜单				MyUtils.startAnimIn(level2,0);				isLevel2Show = true;			}			break;					default:			break;		}	}
最后就是修改Menu按键的事件,使按下Menu可以隐藏或显示全部菜单的效果。

四、Demo下载

转载于:https://www.cnblogs.com/whyalwaysme/p/4391143.html

你可能感兴趣的文章
ural(Timus) 1037. Memory Management
查看>>
jquery实现菜单的折叠并且变换图片
查看>>
微信公众平台消息接口开发(27)彩票查询
查看>>
hdu 1829+hdu 1856(并查集)
查看>>
WIN32 DLL动态链接库
查看>>
用vmware运行简单的引导代码
查看>>
WPF中资源文件的使用
查看>>
Request 分别获取具有相同 name 属性表单元素值
查看>>
错误码:2003 不能连接到 MySQL 服务器在 (10061)
查看>>
js判断文件格式及大小
查看>>
如何确定当前的PowerShell的版本?
查看>>
浅谈json以及一些常用的解析
查看>>
关于编程的一些思考
查看>>
iphone之NSArray比较大小
查看>>
字母列拉丁方块填数字
查看>>
专业卡与游戏卡的区别
查看>>
javaSocket与C通信
查看>>
artdialog的图片,标题,以及关闭按钮不显示的问题
查看>>
UVA 10066 The Twin Towers(LCS)
查看>>
延长Toast显示时间
查看>>