Android提高篇之自定义Menu(TabMenu)

用过ucweb-android版的人都应该对其特殊的menu有印象,把menu做成tab-menu(支持分页的menu),可以容纳比android传统的menu更丰富的内容(android的menu超过6项则缩略在[更多]里),本文参考网上的例子(作者:coffeecole,email:longkefan@foxmail.com),对例子进行简化以及封装,使其作为一个复合控件融入自己的framework。
先来看看本文程序运行的效果:
tabmenu本身就是一个popupwindow,popupwindow上面放了两个gridview,第一个gridview就是分页标签,位于popupwindow的顶部,第二个gridview是菜单,位于popupwindow的主体。为了实现popupwindow的弹出/退出的动画效果,本文使用了以下代码:
在工程的res文件夹里添加anim子目录,再新建文件popup_enter.xml:
[xhtml] view plaincopyprint?
《?xml version=“1.0” encoding=“utf-8”?》
《set xmlns:android=“http://schemas.android.com/apk/res/android”》
《translate android:fromydelta=“100%p” android:toydelta=“0” android:duration=“1000” /》
《alpha android:fromalpha=“0.0” android:toalpha=“1.0” android:duration=“1000” /》
《/set》
《?xml version=“1.0” encoding=“utf-8”?》
《set xmlns:android=“http://schemas.android.com/apk/res/android”》
《translate android:fromydelta=“100%p” android:toydelta=“0” android:duration=“1000” /》
《alpha android:fromalpha=“0.0” android:toalpha=“1.0” android:duration=“1000” /》
《/set》
新建文件popup_exit.xml:
[xhtml] view plaincopyprint?
《?xml version=“1.0” encoding=“utf-8”?》
《set xmlns:android=“http://schemas.android.com/apk/res/android”》
《translate android:fromydelta=“0” android:toydelta=“100%p” android:duration=“1000” /》
《alpha android:fromalpha=“1.0” android:toalpha=“0.0” android:duration=“1000” /》
《/set》
《?xml version=“1.0” encoding=“utf-8”?》
《set xmlns:android=“http://schemas.android.com/apk/res/android”》
《translate android:fromydelta=“0” android:toydelta=“100%p” android:duration=“1000” /》
《alpha android:fromalpha=“1.0” android:toalpha=“0.0” android:duration=“1000” /》
《/set》
在工程的values文件夹里新建文件popup_animation.xml:
《?xml version=“1.0” encoding=“utf-8”?》
《resources》
《style name=“popupanimation” parent=“android:animation”》
《item name=“android:windowenteranimation”》@anim/popup_enter《/item》
《item name=“android:windowexitanimation”》@anim/popup_exit《/item》
《/style》
《/resources》
main.xml的源码如下:
[xhtml] view plaincopyprint?
《?xml version=“1.0” encoding=“utf-8”?》
《linearlayout android:id=“@+id/linearlayout01”
android:layout_width=“fill_parent” android:layout_height=“fill_parent”
xmlns:android=“http://schemas.android.com/apk/res/android”》
《textview android:id=“@+id/textview01” android:layout_height=“wrap_content”
android:layout_width=“fill_parent” android:text=“扩展menu----hellogv”》《/textview》
《/linearlayout》
《?xml version=“1.0” encoding=“utf-8”?》
《linearlayout android:id=“@+id/linearlayout01”
android:layout_width=“fill_parent” android:layout_height=“fill_parent”
xmlns:android=“http://schemas.android.com/apk/res/android”》
《textview android:id=“@+id/textview01” android:layout_height=“wrap_content”
android:layout_width=“fill_parent” android:text=“扩展menu----hellogv”》《/textview》
《/linearlayout》
tabmenu的封装类tabmenu.java的源码如下:
[java] view plaincopyprint?
package com.testtabmenu;
import android.content.context;
import android.graphics.color;
import android.graphics.drawable.colordrawable;
import android.view.gravity;
import android.view.view;
import android.view.viewgroup;
import android.widget.baseadapter;
import android.widget.gridview;
import android.widget.imageview;
import android.widget.linearlayout;
import android.widget.popupwindow;
import android.widget.textview;
import android.widget.adapterview.onitemclicklistener;
import android.widget.linearlayout.layoutparams;
public class tabmenu extends popupwindow{
private gridview gvbody, gvtitle;
private linearlayout mlayout;
private menutitleadapter titleadapter;
public tabmenu(context context,onitemclicklistener titleclick,onitemclicklistener bodyclick,
menutitleadapter titleadapter,int colorbgtabmenu,int anitabmenu){
super(context);
mlayout = new linearlayout(context);
mlayout.setorientation(linearlayout.vertical);
//标题选项栏
gvtitle = new gridview(context);
gvtitle.setlayoutparams(new layoutparams(layoutparams.fill_parent, layoutparams.wrap_content));
gvtitle.setnumcolumns(titleadapter.getcount());
gvtitle.setstretchmode(gridview.stretch_column_width);
gvtitle.setverticalspacing(1);
gvtitle.sethorizontalspacing(1);
gvtitle.setgravity(gravity.center);
gvtitle.setonitemclicklistener(titleclick);
gvtitle.setadapter(titleadapter);
gvtitle.setselector(new colordrawable(color.transparent));//选中的时候为透明色
this.titleadapter=titleadapter;
//子选项栏
gvbody = new gridview(context);
gvbody.setlayoutparams(new layoutparams(layoutparams.fill_parent,layoutparams.wrap_content));
gvbody.setselector(new colordrawable(color.transparent));//选中的时候为透明色
gvbody.setnumcolumns(4);
gvbody.setstretchmode(gridview.stretch_column_width);
gvbody.setverticalspacing(10);
gvbody.sethorizontalspacing(10);
gvbody.setpadding(10, 10, 10, 10);
gvbody.setgravity(gravity.center);
gvbody.setonitemclicklistener(bodyclick);
mlayout.addview(gvtitle);
mlayout.addview(gvbody);
//设置默认项
this.setcontentview(mlayout);
this.setwidth(layoutparams.fill_parent);
this.setheight(layoutparams.wrap_content);
this.setbackgrounddrawable(new colordrawable(colorbgtabmenu));// 设置tabmenu菜单背景
this.setanimationstyle(anitabmenu);
this.setfocusable(true);// menu菜单获得焦点 如果没有获得焦点menu菜单中的控件事件无法响应
}
public void settitleselect(int index)
{
gvtitle.setselection(index);
this.titleadapter.setfocus(index);
}
public void setbodyselect(int index,int colorselbody)
{
int count=gvbody.getchildcount();
for(int i=0;i《count;i++)
{
if(i!=index)
((linearlayout)gvbody.getchildat(i)).setbackgroundcolor(color.transparent);
}
((linearlayout)gvbody.getchildat(index)).setbackgroundcolor(colorselbody);
}
public void setbodyadapter(menubodyadapter bodyadapter)
{
gvbody.setadapter(bodyadapter);
}
/**
* 自定义adapter,tabmenu的每个分页的主体
*
*/
static public class menubodyadapter extends baseadapter {
private context mcontext;
private int fontcolor,fontsize;
private string[] texts;
private int[] resid;
/**
* 设置tabmenu的分页主体
* @param context 调用方的上下文
* @param texts 按钮集合的字符串数组
* @param resid 按钮集合的图标资源数组
* @param fontsize 按钮字体大小
* @param color 按钮字体颜色
*/
public menubodyadapter(context context, string[] texts,int[] resid, int fontsize,int fontcolor)
{
this.mcontext = context;
this.fontcolor = fontcolor;
this.texts = texts;
this.fontsize=fontsize;
this.resid=resid;
}
public int getcount() {
return texts.length;
}
public object getitem(int position) {
return makemenybody(position);
}
public long getitemid(int position) {
return position;
}
private linearlayout makemenybody(int position)
{
linearlayout result=new linearlayout(this.mcontext);
result.setorientation(linearlayout.vertical);
result.setgravity(gravity.center_horizontal|gravity.center_vertical);
result.setpadding(10, 10, 10, 10);
textview text = new textview(this.mcontext);
text.settext(texts[position]);
text.settextsize(fontsize);
text.settextcolor(fontcolor);
text.setgravity(gravity.center);
text.setpadding(5, 5, 5, 5);
imageview img=new imageview(this.mcontext);
img.setbackgroundresource(resid[position]);
result.addview(img,new linearlayout.layoutparams(new layoutparams(layoutparams.wrap_content,layoutparams.wrap_content)));
result.addview(text);
return result;
}
public view getview(int position, view convertview, viewgroup parent) {
return makemenybody(position);
}
}
/**
* 自定义adapter,tabmenu的分页标签部分
*
*/
static public class menutitleadapter extends baseadapter {
private context mcontext;
private int fontcolor,unselcolor,selcolor;
private textview[] title;
/**
* 设置tabmenu的title
* @param context 调用方的上下文
* @param titles 分页标签的字符串数组
* @param fontsize 字体大小
* @param fontcolor 字体颜色
* @param unselcolor 未选中项的背景色
* @param selcolor 选中项的背景色
*/
public menutitleadapter(context context, string[] titles, int fontsize,
int fontcolor,int unselcolor,int selcolor) {
this.mcontext = context;
this.fontcolor = fontcolor;
this.unselcolor = unselcolor;
this.selcolor=selcolor;
this.title = new textview[titles.length];
for (int i = 0; i 《 titles.length; i++) {
title[i] = new textview(mcontext);
title[i].settext(titles[i]);
title[i].settextsize(fontsize);
title[i].settextcolor(fontcolor);
title[i].setgravity(gravity.center);
title[i].setpadding(10, 10, 10, 10);
}
}
public int getcount() {
return title.length;
}
public object getitem(int position) {
return title[position];
}
public long getitemid(int position) {
return title[position].getid();
}
/**
* 设置选中的效果
*/
private void setfocus(int index)
{
for(int i=0;i《title.length;i++)
{
if(i!=index)
{
title[i].setbackgrounddrawable(new colordrawable(unselcolor));//设置没选中的颜色
title[i].settextcolor(fontcolor);//设置没选中项的字体颜色
}
}
title[index].setbackgroundcolor(0x00);//设置选中项的颜色
title[index].settextcolor(selcolor);//设置选中项的字体颜色
}
public view getview(int position, view convertview, viewgroup parent) {
view v;
if (convertview == null) {
v = title[position];
} else {
v = convertview;
}
return v;
}
}
}
package com.testtabmenu;
import android.content.context;
import android.graphics.color;
import android.graphics.drawable.colordrawable;
import android.view.gravity;
import android.view.view;
import android.view.viewgroup;
import android.widget.baseadapter;
import android.widget.gridview;
import android.widget.imageview;
import android.widget.linearlayout;
import android.widget.popupwindow;
import android.widget.textview;
import android.widget.adapterview.onitemclicklistener;
import android.widget.linearlayout.layoutparams;
public class tabmenu extends popupwindow{
private gridview gvbody, gvtitle;
private linearlayout mlayout;
private menutitleadapter titleadapter;
public tabmenu(context context,onitemclicklistener titleclick,onitemclicklistener bodyclick,
menutitleadapter titleadapter,int colorbgtabmenu,int anitabmenu){
super(context);
mlayout = new linearlayout(context);
mlayout.setorientation(linearlayout.vertical);
//标题选项栏
gvtitle = new gridview(context);
gvtitle.setlayoutparams(new layoutparams(layoutparams.fill_parent, layoutparams.wrap_content));
gvtitle.setnumcolumns(titleadapter.getcount());
gvtitle.setstretchmode(gridview.stretch_column_width);
gvtitle.setverticalspacing(1);
gvtitle.sethorizontalspacing(1);
gvtitle.setgravity(gravity.center);
gvtitle.setonitemclicklistener(titleclick);
gvtitle.setadapter(titleadapter);
gvtitle.setselector(new colordrawable(color.transparent));//选中的时候为透明色
this.titleadapter=titleadapter;
//子选项栏
gvbody = new gridview(context);
gvbody.setlayoutparams(new layoutparams(layoutparams.fill_parent,layoutparams.wrap_content));
gvbody.setselector(new colordrawable(color.transparent));//选中的时候为透明色
gvbody.setnumcolumns(4);
gvbody.setstretchmode(gridview.stretch_column_width);
gvbody.setverticalspacing(10);
gvbody.sethorizontalspacing(10);
gvbody.setpadding(10, 10, 10, 10);
gvbody.setgravity(gravity.center);
gvbody.setonitemclicklistener(bodyclick);
mlayout.addview(gvtitle);
mlayout.addview(gvbody);
//设置默认项
this.setcontentview(mlayout);
this.setwidth(layoutparams.fill_parent);
this.setheight(layoutparams.wrap_content);
this.setbackgrounddrawable(new colordrawable(colorbgtabmenu));// 设置tabmenu菜单背景
this.setanimationstyle(anitabmenu);
this.setfocusable(true);// menu菜单获得焦点 如果没有获得焦点menu菜单中的控件事件无法响应
}
public void settitleselect(int index)
{
gvtitle.setselection(index);
this.titleadapter.setfocus(index);
}
public void setbodyselect(int index,int colorselbody)
{
int count=gvbody.getchildcount();
for(int i=0;i《count;i++)
{
if(i!=index)
((linearlayout)gvbody.getchildat(i)).setbackgroundcolor(color.transparent);
}
((linearlayout)gvbody.getchildat(index)).setbackgroundcolor(colorselbody);
}
public void setbodyadapter(menubodyadapter bodyadapter)
{
gvbody.setadapter(bodyadapter);
}
/**
* 自定义adapter,tabmenu的每个分页的主体
*
*/
static public class menubodyadapter extends baseadapter {
private context mcontext;
private int fontcolor,fontsize;
private string[] texts;
private int[] resid;
/**
* 设置tabmenu的分页主体
* @param context 调用方的上下文
* @param texts 按钮集合的字符串数组
* @param resid 按钮集合的图标资源数组
* @param fontsize 按钮字体大小
* @param color 按钮字体颜色
*/
public menubodyadapter(context context, string[] texts,int[] resid, int fontsize,int fontcolor)
{
this.mcontext = context;
this.fontcolor = fontcolor;
this.texts = texts;
this.fontsize=fontsize;
this.resid=resid;
}
public int getcount() {
return texts.length;
}
public object getitem(int position) {
return makemenybody(position);
}
public long getitemid(int position) {
return position;
}
private linearlayout makemenybody(int position)
{
linearlayout result=new linearlayout(this.mcontext);
result.setorientation(linearlayout.vertical);
result.setgravity(gravity.center_horizontal|gravity.center_vertical);
result.setpadding(10, 10, 10, 10);
textview text = new textview(this.mcontext);
text.settext(texts[position]);
text.settextsize(fontsize);
text.settextcolor(fontcolor);
text.setgravity(gravity.center);
text.setpadding(5, 5, 5, 5);
imageview img=new imageview(this.mcontext);
img.setbackgroundresource(resid[position]);
result.addview(img,new linearlayout.layoutparams(new layoutparams(layoutparams.wrap_content,layoutparams.wrap_content)));
result.addview(text);
return result;
}
public view getview(int position, view convertview, viewgroup parent) {
return makemenybody(position);
}
}
/**
* 自定义adapter,tabmenu的分页标签部分
*
*/
static public class menutitleadapter extends baseadapter {
private context mcontext;
private int fontcolor,unselcolor,selcolor;
private textview[] title;
/**
* 设置tabmenu的title
* @param context 调用方的上下文
* @param titles 分页标签的字符串数组
* @param fontsize 字体大小
* @param fontcolor 字体颜色
* @param unselcolor 未选中项的背景色
* @param selcolor 选中项的背景色
*/
public menutitleadapter(context context, string[] titles, int fontsize,
int fontcolor,int unselcolor,int selcolor) {
this.mcontext = context;
this.fontcolor = fontcolor;
this.unselcolor = unselcolor;
this.selcolor=selcolor;
this.title = new textview[titles.length];
for (int i = 0; i 《 titles.length; i++) {
title[i] = new textview(mcontext);
title[i].settext(titles[i]);
title[i].settextsize(fontsize);
title[i].settextcolor(fontcolor);
title[i].setgravity(gravity.center);
title[i].setpadding(10, 10, 10, 10);
}
}
public int getcount() {
return title.length;
}
public object getitem(int position) {
return title[position];
}
public long getitemid(int position) {
return title[position].getid();
}
/**
* 设置选中的效果
*/
private void setfocus(int index)
{
for(int i=0;i《title.length;i++)
{
if(i!=index)
{
title[i].setbackgrounddrawable(new colordrawable(unselcolor));//设置没选中的颜色
title[i].settextcolor(fontcolor);//设置没选中项的字体颜色
}
}
title[index].setbackgroundcolor(0x00);//设置选中项的颜色
title[index].settextcolor(selcolor);//设置选中项的字体颜色
}
public view getview(int position, view convertview, viewgroup parent) {
view v;
if (convertview == null) {
v = title[position];
} else {
v = convertview;
}
return v;
}
}
}
testtabmenu介绍了数据的定义以及tabmenu的使用,源码如下:
[java] view plaincopyprint?
package com.testtabmenu;
import android.app.activity;
import android.graphics.color;
import android.os.bundle;
import android.view.gravity;
import android.view.menu;
import android.view.view;
import android.widget.adapterview;
import android.widget.adapterview.onitemclicklistener;
import android.widget.toast;
public class testtabmenu extends activity {
tabmenu.menubodyadapter []bodyadapter=new tabmenu.menubodyadapter[3];
tabmenu.menutitleadapter titleadapter;
tabmenu tabmenu;
int seltitle=0;
@override
public void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
setcontentview(r.layout.main);
//设置分页栏的标题
titleadapter = new tabmenu.menutitleadapter(this, new string[] { “常用”,
“设置”, “工具” }, 16, 0xff222222,color.ltgray,color.white);
//定义每项分页栏的内容
bodyadapter[0]=new tabmenu.menubodyadapter(this,new string[] { “常用1”, “常用2”, },
new int[] { r.drawable.menu_test,
r.drawable.menu_bookmark},13, 0xffffffff);
bodyadapter[1]=new tabmenu.menubodyadapter(this,new string[] { “设置1”, “设置2”,
“设置3”}, new int[] { r.drawable.menu_edit,
r.drawable.menu_delete, r.drawable.menu_fullscreen},13, 0xffffffff);
bodyadapter[2]=new tabmenu.menubodyadapter(this,new string[] { “工具1”, “工具2”,
“工具3”, “工具4” }, new int[] { r.drawable.menu_copy,
r.drawable.menu_cut, r.drawable.menu_normalmode,
r.drawable.menu_quit },13, 0xffffffff);
tabmenu=new tabmenu(this,
new titleclickevent(),
new bodyclickevent(),
titleadapter,
0x55123456,//tabmenu的背景颜色
r.style.popupanimation);//出现与消失的动画
tabmenu.update();
tabmenu.settitleselect(0);
tabmenu.setbodyadapter(bodyadapter[0]);
}
class titleclickevent implements onitemclicklistener{
@override
public void onitemclick(adapterview《?》 arg0, view arg1, int arg2,
long arg3) {
seltitle=arg2;
tabmenu.settitleselect(arg2);
tabmenu.setbodyadapter(bodyadapter[arg2]);
}
}
class bodyclickevent implements onitemclicklistener{
@override
public void onitemclick(adapterview《?》 arg0, view arg1, int arg2,
long arg3) {
tabmenu.setbodyselect(arg2,color.gray);
string str=“第”+string.valueof(seltitle)+“栏/n/r”
+“第”+string.valueof(arg2)+“项”;
toast.maketext(testtabmenu.this, str, 500).show();
}
}
@override
/**
* 创建menu
*/
public boolean oncreateoptionsmenu(menu menu) {
menu.add(“menu”);// 必须创建一项
return super.oncreateoptionsmenu(menu);
}
@override
/**
* 拦截menu
*/
public boolean onmenuopened(int featureid, menu menu) {
if (tabmenu != null) {
if (tabmenu.isshowing())
tabmenu.dismiss();
else {
tabmenu.showatlocation(findviewbyid(r.id.linearlayout01),
gravity.bottom, 0, 0);
}
}
return false;// 返回为true 则显示系统menu
}
}
package com.testtabmenu;
import android.app.activity;
import android.graphics.color;
import android.os.bundle;
import android.view.gravity;
import android.view.menu;
import android.view.view;
import android.widget.adapterview;
import android.widget.adapterview.onitemclicklistener;
import android.widget.toast;
public class testtabmenu extends activity {
tabmenu.menubodyadapter []bodyadapter=new tabmenu.menubodyadapter[3];
tabmenu.menutitleadapter titleadapter;
tabmenu tabmenu;
int seltitle=0;
@override
public void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
setcontentview(r.layout.main);
//设置分页栏的标题
titleadapter = new tabmenu.menutitleadapter(this, new string[] { “常用”,
“设置”, “工具” }, 16, 0xff222222,color.ltgray,color.white);
//定义每项分页栏的内容
bodyadapter[0]=new tabmenu.menubodyadapter(this,new string[] { “常用1”, “常用2”, },
new int[] { r.drawable.menu_test,
r.drawable.menu_bookmark},13, 0xffffffff);
bodyadapter[1]=new tabmenu.menubodyadapter(this,new string[] { “设置1”, “设置2”,
“设置3”}, new int[] { r.drawable.menu_edit,
r.drawable.menu_delete, r.drawable.menu_fullscreen},13, 0xffffffff);
bodyadapter[2]=new tabmenu.menubodyadapter(this,new string[] { “工具1”, “工具2”,
“工具3”, “工具4” }, new int[] { r.drawable.menu_copy,
r.drawable.menu_cut, r.drawable.menu_normalmode,
r.drawable.menu_quit },13, 0xffffffff);
tabmenu=new tabmenu(this,
new titleclickevent(),
new bodyclickevent(),
titleadapter,
0x55123456,//tabmenu的背景颜色
r.style.popupanimation);//出现与消失的动画
tabmenu.update();
tabmenu.settitleselect(0);
tabmenu.setbodyadapter(bodyadapter[0]);
}
class titleclickevent implements onitemclicklistener{
@override
public void onitemclick(adapterview《?》 arg0, view arg1, int arg2,
long arg3) {
seltitle=arg2;
tabmenu.settitleselect(arg2);
tabmenu.setbodyadapter(bodyadapter[arg2]);
}
}
class bodyclickevent implements onitemclicklistener{
@override
public void onitemclick(adapterview《?》 arg0, view arg1, int arg2,
long arg3) {
tabmenu.setbodyselect(arg2,color.gray);
string str=“第”+string.valueof(seltitle)+“栏/n/r”
+“第”+string.valueof(arg2)+“项”;
toast.maketext(testtabmenu.this, str, 500).show();
}
}
@override
/**
* 创建menu
*/
public boolean oncreateoptionsmenu(menu menu) {
menu.add(“menu”);// 必须创建一项
return super.oncreateoptionsmenu(menu);
}
@override
/**
* 拦截menu
*/
public boolean onmenuopened(int featureid, menu menu) {
if (tabmenu != null) {
if (tabmenu.isshowing())
tabmenu.dismiss();
else {
tabmenu.showatlocation(findviewbyid(r.id.linearlayout01),
gravity.bottom, 0, 0);
}
}
return false;// 返回为true 则显示系统menu
}
}

单片TTL触摸式开关电路图
车辆网络安全架构设计实践方案解析
什么是API?API接口表现形式分类理论
数字化转型怎么才能做成功?
如何定义智能家居 目前还没有人能给出明确的答案
Android提高篇之自定义Menu(TabMenu)
南京南站LoRa+蓝牙应用
大功率MOS管开关电路实例应用电路分析
2020年传感器领域值得关注的重要事件汇总
倒计时5天!电动工具大会议程出炉
对于复式结构的建筑,路由器放楼上好还是楼下好
温度的变化对蓄电池的性能有何影响
智能穿戴巨头Fitbit收购智能手表制造商Vector,智能加智能 会怎样?
万向区块链实验室与Web3.0基金会等联合推出Web3.0 Bootcamp
与人一样行为动作的协作机器人
使用热转印纸快速自制线路板
基板封装的风光互补LED照明控制器设计
SK海力士拓荒海外市场重要举措 无锡8寸晶圆代工新厂投产
德州仪器“业界最小”封装面积车载摄像头
如何通过PWM的方式实现数字到模拟变换的功能