Android应用主界面底部菜单实现

介绍

现在绝大多数主流的应用主界面,都会包含一个底部菜单,就拿腾讯的QQ与微信来说,看起来是这样的

Android应用主界面底部菜单实现_第1张图片 Android应用主界面底部菜单实现_第2张图片《---我是底部菜单

原理

在很久以前,可以通过TabActivity实现相关功能,自从Fragment出来后,就被抛弃了。

原理也很简单

1、底部菜单通过自定义RadioGroup实现,通过setOnCheckedChangeListener监听切换内容。

2、内容切换,可以使用ViewPager(可以实现直接滑动切换),TabHost,FragmentManager来实现。、

 

PS:类似的,这样也可以通过HorizontalScrollView+ViewPager+RadioGroup实现类似网易新闻的顶部栏目效果(或者ViewPageIndicator),通过ScrollView.scrollTo((int)RadioButton.getLeft())来自动滑动到当前选择项,有空再写篇文章。

实现

在几种组合搭配来看,我比较喜欢使用Fragment+Tabhost+RadioGroup搭配实现。

首先上首页布局代码activity_main.xml,注意加粗id

复制代码


    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    

        

            android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="fill_parent" >

                

                

                
            
        

        android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.0"
            android:visibility="gone" />

     
        
        

        

            

            

            

            
        
    

复制代码

其中RadioButton的样式按照需要自己定义

复制代码

    

复制代码

MainActivity代码

复制代码

package com.example.tabmenu;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.Window;
import android.view.animation.AnimationUtils;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
import android.widget.TabHost;

public class MainActivity extends ActionBarActivity {
    // tab用参数
    private TabHost tabHost;
    private RadioGroup radiogroup;
    private int menuid;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        radiogroup = (RadioGroup) findViewById(R.id.radiogroup);
        tabHost = (TabHost) findViewById(android.R.id.tabhost);
        tabHost.setup();
        tabHost.addTab(tabHost.newTabSpec("main").setIndicator("main")
                .setContent(R.id.fragment_main));
        tabHost.addTab(tabHost.newTabSpec("mycenter").setIndicator("mycenter")
                .setContent(R.id.fragment_mycenter));
        tabHost.addTab(tabHost.newTabSpec("search").setIndicator("search")
                .setContent(R.id.fragment_search));
        radiogroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                menuid = checkedId;
                int currentTab = tabHost.getCurrentTab();
                switch (checkedId) {
                case R.id.radio_main:
                    tabHost.setCurrentTabByTag("main");
                    //如果需要动画效果就使用
                    //setCurrentTabWithAnim(currentTab, 0, "main");
                    getSupportActionBar().setTitle("首页");
                    break;
                case R.id.radio_mycenter:
                    //tabHost.setCurrentTabByTag("mycenter");
                    setCurrentTabWithAnim(currentTab, 1, "mycenter");
                    getSupportActionBar().setTitle("个人中心");

                    break;
                case R.id.radio_search:
                    tabHost.setCurrentTabByTag("search");
                    getSupportActionBar().setTitle("搜索");
                }
                // 刷新actionbar的menu
                getWindow().invalidatePanelMenu(Window.FEATURE_OPTIONS_PANEL);
            }
        });

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.

        switch (menuid) {
        case R.id.radio_main:
            getMenuInflater().inflate(R.menu.main, menu);
            break;
        case R.id.radio_mycenter:
            menu.clear();
            break;
        case R.id.radio_search:
            menu.clear();
            break;
        }
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
    
    // 这个方法是关键,用来判断动画滑动的方向
    private void setCurrentTabWithAnim(int now, int next, String tag) {
        if (now > next) {
            tabHost.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_out));
            tabHost.setCurrentTabByTag(tag);
            tabHost.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_in));
        } else {
            tabHost.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_out));
            tabHost.setCurrentTabByTag(tag);
            tabHost.getCurrentView().startAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_in));
        }
    }
}

复制代码

最后demo截图,其他文件件demo

Android应用主界面底部菜单实现_第3张图片

 

demo下载地址:

 链接:http://pan.baidu.com/s/1dbuKA 密码:84iw

 

 

 

https://www.cnblogs.com/leestar54/p/4222565.html

你可能感兴趣的:(安卓)