实现类似UC浏览器的菜单

来源:互联网 发布:算法工程师需要哪些知识 编辑:程序博客网 时间:2024/05/17 04:00

本章的内容涉及到的了两个知识点:

PopupWindow:关于这方面的内容可以看看《使用PopupWindow创建一个简单的菜单》

使用TabHost创建标签:这个网上好多教程随便看看就好。

实现思路:

观察一下UC浏览器的菜单我们可以发现,UC的菜单就是一个个标签页显示在了PopupWindow上,所以可以想到使用PopupWindow+TabHost来实现类似的效果。这样做,在标签页中我们可以使用android提供布局对象随意设置布局。

下面来看代码:

想要实现这种效果的菜单,默认的PopupWindow明显需要重写:

public class MyMenu extends PopupWindow {    private TabHost tabHost;    //标签页窗口    private LayoutInflater inflater;     //用于加载tabhost    private View layout;    private Context context;    //构造函数    public MyMenu(Context context, int width, int height) {        super(context);        this.context = context;        inflater = LayoutInflater.from(this.context);        //创建标签页        initTab();        //设置默认选项        setWidth(width);          //宽        setHeight(height);        //高        setContentView(tabHost);  //把标签页设置到PopupWindow上    }    //实例化标签页    private void initTab(){        layout =  inflater.inflate(R.layout.menu,null);        tabHost = (TabHost)layout. findViewById(android.R.id.tabhost);       //获取tabhost        tabHost.setBackgroundColor(Color.argb(60,144,144,150));              //设置背景色        tabHost.setup();           //使用findViewById()加载tabhost时在调用addTab前必须调用        /**         * addTab()添加标签页         *      tabHost.newTabSpec("Fitst")  创建一个tab         *      setIndicator("A") 设置指针         *      setContent(R.id.tab1)设置内容         */        tabHost.addTab(tabHost.newTabSpec("Fitst").setIndicator("A").setContent(R.id.tab1));        tabHost.addTab(tabHost.newTabSpec("SECOND").setIndicator("B").setContent(R.id.tab2));        tabHost.addTab(tabHost.newTabSpec("THIRD").setIndicator("C").setContent(R.id.tab3));        tabHost.setCurrentTab(1);                                            //设置默认选种标签    }    //获取选项卡中的组件    public  View getOption(int id){        return layout.findViewById(id);    }}
菜单的布局文件res/layout/menu.xml

<?xml version="1.0" encoding="utf-8"?><TabHost xmlns:android="http://schemas.android.com/apk/res/android"         android:id="@android:id/tabhost"         android:layout_width="fill_parent"         android:layout_height="fill_parent"        >    <LinearLayout            android:orientation="vertical"            android:layout_height="fill_parent"            android:layout_width="fill_parent">        <TabWidget                android:id="@android:id/tabs"                android:layout_height="40dp"                android:layout_width="fill_parent"                />        <FrameLayout                android:id="@android:id/tabcontent"                android:layout_width="fill_parent"                android:layout_height="fill_parent">            <LinearLayout                    android:layout_width="fill_parent"                    android:layout_height="fill_parent"                    android:id="@+id/tab1">                <Button                        android:layout_height="wrap_content"                        android:layout_width="wrap_content"                        android:text="Tab   one"                        android:id="@+id/first_button"                        />            </LinearLayout>            <LinearLayout                    android:layout_width="fill_parent"                    android:layout_height="fill_parent"                    android:id="@+id/tab2">                <TextView                        android:layout_height="wrap_content"                        android:layout_width="wrap_content"                        android:text="Tab   two"                        />            </LinearLayout>            <LinearLayout                    android:layout_width="fill_parent"                    android:layout_height="fill_parent"                    android:id="@+id/tab3">                <TextView                        android:layout_height="wrap_content"                        android:layout_width="wrap_content"                        android:text="Tab   three"                        />            </LinearLayout>        </FrameLayout>    </LinearLayout></TabHost>
在Activity中使用:

public class MyActivity extends Activity{    private MyMenu menu;    private LinearLayout linear;    @Override    public void onCreate(Bundle savedInstanceState)    {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        init();    }    //组件初始化    private void init(){        linear = (LinearLayout) findViewById(R.id.popMenu);        int width = getWindowManager().getDefaultDisplay().getWidth()-15;      //菜单的宽度        int heigth = getWindowManager().getDefaultDisplay().getHeight()/3;     //菜单的高度        menu = new MyMenu(this, width,heigth);        Button button= (Button) menu.getOption(R.id.first_button); //获取菜单第一个标签页中的按钮        //添加点击事件        button.setOnClickListener(new Button.OnClickListener(){            public void onClick(View v) {                Toast.makeText(MyActivity.this,"tab one",Toast.LENGTH_SHORT).show();            }        });    }    //显示菜单    private void show(){        menu.showAtLocation(linear, Gravity.BOTTOM|Gravity.CENTER_HORIZONTAL,0,0);    }    @Override    public boolean onKeyDown(int keyCode, KeyEvent event) {        //按以下菜单按键展示菜单 按两下隐藏菜单        if(!menu.isShowing()&&keyCode == KeyEvent.KEYCODE_MENU){            show();        }        else{            menu.dismiss();        }        return true;    }}

目前菜单的样子还是比较丑陋了,美化大家自己发挥好了!