Android学习笔记（2）——底部导航栏、菜单的使用

前言：现在大多数App都会用到底部导航栏，比如常见的聊天工具QQ、微信，购物App等等，有了底部导航栏，用户可以随时切换界面，查看不同的内容。它的实现方式也很多，我采用的是tabhost来构造底部导航栏，和菜单。

工程目录：首先来看一下工程目录。

主要文件：

1.activity_main.xml

ps：本人小白一枚，习惯工程起源于主界面的搭建。>_<

<?xml version="1.0" encoding="utf-8"?><TabHost xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:id="@android:id/tabhost"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    tools:context="com.zhangpei.docotoroffamily.MainActivity">    <LinearLayout        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:background="#FFFFFFFF"        android:orientation="vertical">        <FrameLayout            android:layout_width="fill_parent"            android:layout_height="fill_parent"            android:layout_weight="1">            <FrameLayout                android:id="@android:id/tabcontent"                android:layout_width="match_parent"                android:layout_height="fill_parent">                <fragment                    android:layout_width="fill_parent"                    android:layout_height="fill_parent"                    android:id="@+id/fragment_main"                    android:name="com.zhangpei.docotoroffamily.MainFragment"                    />                <fragment                    android:layout_width="fill_parent"                    android:layout_height="fill_parent"                    android:id="@+id/fragment_mycenter"                    android:name="com.zhangpei.docotoroffamily.MyCenterFragment"                    />                <fragment                    android:layout_width="fill_parent"                    android:layout_height="fill_parent"                    android:id="@+id/fragment_search"                    android:name="com.zhangpei.docotoroffamily.SearchFragment"                    />            </FrameLayout>        </FrameLayout>        <TabWidget            android:id="@android:id/tabs"            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:layout_weight="0.0"            android:visibility="gone"            ></TabWidget>        <LinearLayout            android:layout_width="fill_parent"            android:layout_height="3dp"            android:background="@drawable/fbutton_color_emerald">        </LinearLayout>        <RadioGroup            android:id="@+id/radiogroup"            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:layout_gravity="bottom"            android:background="@drawable/fbutton_color_turquoise"            android:gravity="center_vertical"            android:orientation="horizontal">            <RadioButton                android:id="@+id/radio_main"                style="@style/main_tab_bottom"                android:layout_weight="1"                android:background="@drawable/footer_itembg_selector"                android:button="@null"                android:checked="true"                android:drawableTop="@drawable/footer_main_selector"                android:text="首 页" />            <RadioButton                android:id="@+id/radio_search"                style="@style/main_tab_bottom"                android:layout_weight="1"                android:background="@drawable/footer_itembg_selector"                android:drawableTop="@drawable/footer_search_selector"                android:text="查 询"                />            <RadioButton                android:id="@+id/radio_mycenter"                style="@style/main_tab_bottom"                android:layout_weight="1"                android:background="@drawable/footer_itembg_selector"                android:drawableTop="@drawable/footer_mycenter_selector"                android:text="个人中心" />        </RadioGroup>    </LinearLayout></TabHost>

主界面文件相应的布局一目了然，三个fragmen，三个底部按钮，通过TabHost实现转换。注意红色部分，不要太相信编译器呦!!!

2.MainActivity.java

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 RadioGroup.OnCheckedChangeListener() {            @Override            public void onCheckedChanged(RadioGroup radioGroup, @IdRes 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:                        //setCurrentTabWithAnim(currentTab, 1, "search");                        tabHost.setCurrentTabByTag("search");                        //getSupportActionBar().setTitle("搜索");                }                // 刷新actionbar的menu                getWindow().invalidatePanelMenu(Window.FEATURE_OPTIONS_PANEL);             }        });    }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        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) {        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));        }    }}

3.fragment_main.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="123"/></LinearLayout>

4.MainFragment.java

public class MainFragment extends Fragment {    @Override    public void onCreate(Bundle savedInstanceState) {        // TODO Auto-generated method stub        super.onCreate(savedInstanceState);    }    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view= inflater.inflate(R.layout.fragment_main, null);        return view;    }}

    为节约资源，仅选其一Fragment进行展示，读者如需其他详细资源可以在文章末尾连接下载。

文末：附一张运行截图。                                                                                                                                                                                                                                   

Android学习笔记————2017.9.15   点我点我