android 创建菜单的心得

  最近做的音乐播放器中涉及到创建菜单。

  本来找到了类似于天天动听样子的菜单，但不适合我的，最后还用AlertDialog定义了一个菜单，不过还是把几种都写出来

  先来个天天动听式的菜单模式

package my.com.tabMenu;
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(context.getResources().getDrawable(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;
        }
    }
}

在你需要的创建菜单栏的Activity中编程如下代码

private TabMenu.MenuBodyAdapter []bodyAdapter=new TabMenu.MenuBodyAdapter[3];
    private TabMenu.MenuTitleAdapter titleAdapter;
    private TabMenu tabMenu;
    private int selTitle=0;

private void InitMenu()
    {
        //设置分页栏的标题
                titleAdapter = new TabMenu.MenuTitleAdapter(this, new String[] { "常用",
                        "设置", "工具" }, 16, 0xFF222222,Color.YELLOW,Color.WHITE);
                //定义每项分页栏的内容
                bodyAdapter[0]=new TabMenu.MenuBodyAdapter(this,new String[] { "添加歌曲", "清空列表","退出" }, 
                         new int[] { R.drawable.menu_refresh,R.drawable.next1,
                        R.drawable.menu_quit},13, 0xFFFFFFFF);
                 
                bodyAdapter[1]=new TabMenu.MenuBodyAdapter(this,new String[] { "设置1", "设置2",
                            "设置3"}, new int[] { R.drawable.menu_quit,
                            R.drawable.menu_downmanager, R.drawable.menu_help},13, 0xFFFFFFFF);
                 
                bodyAdapter[2]=new TabMenu.MenuBodyAdapter(this,new String[] { "工具1", "工具2",
                            "工具3", "工具4" }, new int[] { R.drawable.menu_quit,
                            R.drawable.menu_help, R.drawable.lastone,
                            R.drawable.menu_quit },13, 0xFFFFFFFF);
                 
                 
                tabMenu=new TabMenu(this,
                         new TitleClickEvent(),
                         new BodyClickEvent(),
                         titleAdapter,
                         R.color.darkblue,//TabMenu的背景颜色0x55123456
                         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.YELLOW);
            
            if(String.valueOf(selTitle).equals("0")&&String.valueOf(arg2).equals("2"))
                sysexit();
            if(String.valueOf(selTitle).equals("0")&&String.valueOf(arg2).equals("1"))
                {
                     clearlist();
                     tabMenu.dismiss();
                }
            if(String.valueOf(selTitle).equals("0")&&String.valueOf(arg2).equals("0"))
                {
                       Intent intent=new Intent();
                       intent.setClass(localActivity.this, refreshActivity.class);
                       startActivity(intent);
                }
            
        }
        
    }

    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {        
            sysexit();
        }
        else if(keyCode ==KeyEvent.KEYCODE_MENU)
        {
            if (tabMenu != null) {
                if (tabMenu.isShowing())
                    tabMenu.dismiss();
                else {
                    tabMenu.showAtLocation(findViewById(R.id.linr),
                            Gravity.BOTTOM, 0, 0);
                }
            }
        }
        return true;
    }

  便可创建一个类似天天动听的菜单效果

 第二个 用AlertDialog 定义菜单

package com.wjq.menu;


import java.util.ArrayList;
import java.util.HashMap;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.DialogInterface.OnKeyListener;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.AdapterView.OnItemClickListener;

public class CustomizeMenu extends Activity {
    
    private boolean isMore = false;// menu菜单翻页控制
    AlertDialog menuDialog;// menu菜单Dialog
    GridView menuGrid;
    View menuView;
    
    private final int ITEM_SEARCH = 0;// 搜索
    private final int ITEM_FILE_MANAGER = 1;// 文件管理
    private final int ITEM_DOWN_MANAGER = 2;// 下载管理
    private final int ITEM_FULLSCREEN = 3;// 全屏
    private final int ITEM_MORE = 11;// 菜单

    
    /** 菜单图片 **/
    int[] menu_image_array = { R.drawable.menu_search,
            R.drawable.menu_filemanager, R.drawable.menu_downmanager,
            R.drawable.menu_fullscreen, R.drawable.menu_inputurl,
            R.drawable.menu_bookmark, R.drawable.menu_bookmark_sync_import,
            R.drawable.menu_sharepage, R.drawable.menu_quit,
            R.drawable.menu_nightmode, R.drawable.menu_refresh,
            R.drawable.menu_more };
    /** 菜单文字 **/
    String[] menu_name_array = { "搜索", "文件管理", "下载管理", "全屏", "网址", "书签",
            "加入书签", "分享页面", "退出", "夜间模式", "刷新", "更多" };
    /** 菜单图片2 **/
    int[] menu_image_array2 = { R.drawable.menu_auto_landscape,
            R.drawable.menu_penselectmodel, R.drawable.menu_page_attr,
            R.drawable.menu_novel_mode, R.drawable.menu_page_updown,
            R.drawable.menu_checkupdate, R.drawable.menu_checknet,
            R.drawable.menu_refreshtimer, R.drawable.menu_syssettings,
            R.drawable.menu_help, R.drawable.menu_about, R.drawable.menu_return };
    /** 菜单文字2 **/
    String[] menu_name_array2 = { "自动横屏", "笔选模式", "阅读模式", "浏览模式", "快捷翻页",
            "检查更新", "检查网络", "定时刷新", "设置", "帮助", "关于", "返回" };
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        
        setContentView(R.layout.main);
        
        menuView = View.inflate(this, R.layout.gridview_menu, null);
        // 创建AlertDialog
        menuDialog = new AlertDialog.Builder(this).create();
        menuDialog.setView(menuView);
        menuDialog.setOnKeyListener(new OnKeyListener() {
            public boolean onKey(DialogInterface dialog, int keyCode,
                    KeyEvent event) {
                if (keyCode == KeyEvent.KEYCODE_MENU)// 监听按键
                    dialog.dismiss();
                return false;
            }
        });
        
        menuGrid = (GridView) menuView.findViewById(R.id.gridview);
        menuGrid.setAdapter(getMenuAdapter(menu_name_array, menu_image_array));
        /** 监听menu选项 **/
        menuGrid.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                    long arg3) {
                switch (arg2) {
                case ITEM_SEARCH:// 搜索

                    break;
                case ITEM_FILE_MANAGER:// 文件管理

                    break;
                case ITEM_DOWN_MANAGER:// 下载管理

                    break;
                case ITEM_FULLSCREEN:// 全屏

                    break;
                case ITEM_MORE:// 翻页
                    if (isMore) {
                        menuGrid.setAdapter(getMenuAdapter(menu_name_array2,
                                menu_image_array2));
                        isMore = false;
                    } else {// 首页
                        menuGrid.setAdapter(getMenuAdapter(menu_name_array,
                                menu_image_array));
                        isMore = true;
                    }
                    menuGrid.invalidate();// 更新menu
                    menuGrid.setSelection(ITEM_MORE);
                    break;
                }
                
                
            }
        });
    }
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        menu.add("menu");// 必须创建一项
        return super.onCreateOptionsMenu(menu);
    }
    
    private SimpleAdapter getMenuAdapter(String[] menuNameArray,
            int[] imageResourceArray) {
        ArrayList<HashMap<String, Object>> data = new ArrayList<HashMap<String, Object>>();
        for (int i = 0; i < menuNameArray.length; i++) {
            HashMap<String, Object> map = new HashMap<String, Object>();
            map.put("itemImage", imageResourceArray[i]);
            map.put("itemText", menuNameArray[i]);
            data.add(map);
        }
        SimpleAdapter simperAdapter = new SimpleAdapter(this, data,
                R.layout.item_menu, new String[] { "itemImage", "itemText" },
                new int[] { R.id.item_image, R.id.item_text });
        return simperAdapter;
    }
    @Override
    public boolean onMenuOpened(int featureId, Menu menu) {
        // TODO Auto-generated method stub
        if (menuDialog == null) {
            menuDialog = new AlertDialog.Builder(this).setView(menuView).show();
        } else {
            menuDialog.show();
        }
        return false;// 返回为true 则显示系统menu
    }
}

利用PopupWindow  其中涉及到菜单的动画效果

package my.com.test;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.Gravity;
import android.view.KeyEvent;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.view.ViewGroup.LayoutParams;
import android.widget.PopupWindow;

public class MenuBottmActivity extends Activity {
    /** Called when the activity is first created. */
        Animation showAction, hideAction; 
        LinearLayout menu; 
        Button button; 
        boolean menuShowed; 
        private GridView gv;
        
        private int[] icon={
                R.drawable.alarm,R.drawable.android,R.drawable.barcode_reader,
                R.drawable.bluetooth,R.drawable.browser,R.drawable.bump,
                R.drawable.calculator,R.drawable.camcorder,R.drawable.calendar};
        
        private String[] items={"浏览器","图片","相机","时钟","音乐","市场","拨号","信息","地图"};
        private PopupWindow popw;
        private View layout;
                
        @Override 
        public void onCreate(Bundle savedInstanceState) { 
            super.onCreate(savedInstanceState); 
            setContentView(R.layout.main); 
            
            menu = (LinearLayout) findViewById(R.id.menu); 
            button = (Button) findViewById(R.id.button); 
            
            
            
             // 这里是TranslateAnimation动画 
            showAction = new TranslateAnimation( 
                    Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f,
                     Animation.RELATIVE_TO_SELF, -1.0f, Animation.RELATIVE_TO_SELF, 0.0f);
              // 这里是ScaleAnimation动画 
            //showAction = new ScaleAnimation( 
            //    1.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f);
             showAction.setDuration(500); 

             // 这里是TranslateAnimation动画        
            hideAction = new TranslateAnimation( 
                    Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f,
                     Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, -1.0f);
              // 这里是ScaleAnimation动画 
            //hideAction = new ScaleAnimation( 
            //        1.0f, 1.0f, 1.0f, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f);
             hideAction.setDuration(500); 
            
            menuShowed = false; 
            menu.setVisibility(View.GONE); 
            
            button.setOnClickListener(new OnClickListener() { 

                @Override 
                public void onClick(View v) { 
                    // TODO Auto-generated method stub 
                    if (menuShowed) { 
                        menuShowed = false; 
                        menu.startAnimation(hideAction); 
                        menu.setVisibility(View.GONE); 
                    } 
                    else { 
                        menuShowed = true; 
                        menu.startAnimation(showAction); 
                        menu.setVisibility(View.VISIBLE); 
                    } 
                } 
                
            }); 
            
            //自定义菜单
            layout=LayoutInflater.from(MenuBottmActivity.this).inflate(R.layout.window, null);
            gv=(GridView)layout.findViewById(R.id.gv);
            
            gv.setAdapter(new Myadapter(MenuBottmActivity.this, icon, items));
            
            
        } 
        
        public boolean onKeyDown(int keyCode, KeyEvent event){
          //截获按键事件         
            if(keyCode == KeyEvent.KEYCODE_MENU){     
                
                InitPopupWindow(); 
                popw.showAtLocation(this.findViewById(R.id.button),                         
                        Gravity.CENTER, 0, 0);
                //在屏幕底部         
                }
            else if(keyCode == KeyEvent.KEYCODE_BACK){             
                if(popw.isShowing()){                 
                    popw.dismiss();             
                    }
                else{               
                    System.exit(0);
                    }         
                }         
            return false;         
        }
        
        public void InitPopupWindow()
        {
            if(popw==null)
            {
                popw=new PopupWindow(layout, 
                        LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
                
            }
            if(popw.isShowing())
                popw.dismiss();
        }
        
        public class Myadapter extends BaseAdapter{
            private Context context;
            private int[] icon;
            private String[] items;
            public Myadapter(Context context,int[] icon,String[] items)
            {
                this.context=context;
                this.icon=icon;
                this.items=items;
            }

            @Override
            public int getCount() {
                // TODO Auto-generated method stub
                return items.length;
            }

            @Override
            public Object getItem(int position) {
                // TODO Auto-generated method stub
                return position;
            }

            @Override
            public long getItemId(int position) {
                // TODO Auto-generated method stub
                return position;
            }

            @Override
            public View getView(int position, View convertView, ViewGroup parent) {
                // TODO Auto-generated method stub
                convertView=LayoutInflater.from(context).inflate(R.layout.item_menu, null);
                TextView tv=(TextView)convertView.findViewById(R.id.item_text);
                ImageView image=(ImageView)convertView.findViewById(R.id.item_image);
                
                tv.setText(items[position]);
                image.setBackgroundResource(icon[position]);
                
                return convertView;
            }
            
        }
}

window.xml

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:numColumns="3" >
</GridView>

menu_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/RelativeLayout_Item"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="5dip" >

    <ImageView
        android:id="@+id/item_image"
        android:layout_width="80dip"
        android:layout_height="80dip"
        android:layout_centerHorizontal="true" >
    </ImageView>

    <TextView
        android:id="@+id/item_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/item_image"
        android:layout_centerHorizontal="true"
        android:text="选项" >
    </TextView>

</RelativeLayout>

man.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />

    <LinearLayout
        android:id="@+id/menu"
        android:layout_width="fill_parent"
        android:layout_height="100px"
        android:layout_alignParentTop="true"
        android:background="#ffffff" >

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center"
            android:text="I am a menu" />
    </LinearLayout>

    <Button
        android:id="@+id/button"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:text="Click to show/hide menu" />

</RelativeLayout>