NI你现在顶部,底部导航栏太多了,我们几乎很少用到原生的Fragment了,是不是顶部与底部导航栏就可以满足所有需求呐？很显然不是,
我们知道平板比手机的尺寸要大得多,如果我们主页面利用底部导航栏设计出来空白太多,而且整体看起来不是很美观，于是乎我就想利用Fragment做一个侧面菜单。我在网上,Github，找了很多资料都没有合适的一个框架来支撑这个需求.最后我还是狠下心来用原生Fragment了。
1.首先我贴一张效果图，图片跟背景都是在随便找的资源.
我们再来看看上图对应的布局
?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@mipmap/back"
>
<include
android:id="@+id/menu_layout"
layout="@layout/main_menu"
></include>
<TextView
android:id="@+id/title_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/menu_layout"
android:padding="10dp"
android:text="亲睦家健康管理,欢迎您!"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
android:textColor="@color/normaltextcolor"/>
<FrameLayout
android:id="@+id/main_framelayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/title_text"
android:layout_toRightOf="@id/menu_layout"
android:background="@color/normaltextcolor"
></FrameLayout>
</RelativeLayout>
main_menu布局：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="@dimen/x250"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/loginlogo"/>
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/main_menu_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:padding="@dimen/x5"
android:src="@mipmap/error"/>
<TextView
android:id="@+id/menu_tologin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_toRightOf="@id/main_menu_image"
android:background="@null"
android:layout_marginTop="@dimen/y10"
android:text="登录/注册"
android:textColor="@color/colorAccent"
android:visibility="visible"/>
<TextView
android:id="@+id/menu_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/y10"
android:gravity="center_horizontal"
android:text="昵称"
android:textColor="@color/morencolor"/>
<TextView
android:id="@+id/menu_one"
android:layout_width="@dimen/x250"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/y40"
android:drawablePadding="@dimen/x8"
android:drawableTop="@mipmap/old_gaoweitwo"
android:gravity="center"
android:paddingBottom="@dimen/y5"
android:paddingTop="@dimen/y5"
android:text="我的设备"
android:textColor="@color/morencolor"/>
<TextView
android:id="@+id/menu_two"
android:layout_width="@dimen/x250"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/y30"
android:drawablePadding="@dimen/x8"
android:drawableTop="@mipmap/old_goodsone"
android:gravity="center"
android:paddingBottom="@dimen/y5"
android:paddingTop="@dimen/y5"
android:text="设备列表"
android:textColor="@color/morencolor"/>
<TextView
android:id="@+id/menu_three"
android:layout_width="@dimen/x250"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/y30"
android:drawablePadding="@dimen/x8"
android:drawableTop="@mipmap/old_leaveone"
android:gravity="center"
android:paddingBottom="@dimen/y5"
android:paddingTop="@dimen/y5"
android:text="其他"
android:textColor="@color/morencolor"/>
<TextView
android:id="@+id/menu_four"
android:layout_width="@dimen/x250"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/y30"
android:drawablePadding="@dimen/x8"
android:drawableTop="@mipmap/old_messageone"
android:gravity="center"
android:paddingBottom="@dimen/y5"
android:paddingTop="@dimen/y5"
android:text="设置"
android:textColor="@color/morencolor"/>
<TextView
android:id="@+id/menu_five"
android:layout_width="@dimen/x250"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/y30"
android:drawablePadding="@dimen/x8"
android:drawableTop="@mipmap/old_messageone"
android:gravity="center"
android:paddingBottom="@dimen/y5"
android:paddingTop="@dimen/y5"
android:text="退出"
android:textColor="@color/morencolor"/>
</LinearLayout>
可以看到这个布局很简单左边一个menu布局右边就是一个FrameLayout.接着我们来看下怎么实现切换Fragment的,下面我就贴几个重要方法:
1.监听menu按钮事件
@Override
public void onClick(View v) {
FragmentManager fragmentManager = getSupportFragmentManager();
FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
switch (v.getId()) {
case R.id.menu_one:
SetFragment(fragmentList, fragmentTransaction, 0);
SetTextViewColor(ids[0]);
break;
case R.id.menu_two:
SetFragment(fragmentList, fragmentTransaction, 1);
SetTextViewColor(ids[1]);
break;
case R.id.menu_three:
SetFragment(fragmentList, fragmentTransaction, 2);
SetTextViewColor(ids[2]);
break;
case R.id.menu_four:
SetFragment(fragmentList, fragmentTransaction, 3);
SetTextViewColor(ids[3]);
break;
}
}//切换fragment
public void SetFragment(List<Fragment> fragmentList, FragmentTransaction fragmentTransaction, int index) {
for (int i = 0; i < fragmentList.size(); i++) {
if (i == index) {
if (fragmentList.get(i).isVisible() && fragmentList.get(i).isAdded()) {
return;
} else {
fragmentTransaction.add(R.id.main_framelayout, fragmentList.get(i));
}
} else {
if (fragmentList.get(i).isAdded()) {
fragmentTransaction.remove(fragmentList.get(i));
}
}
}
fragmentTransaction.commit();
}
//--设置字体颜色:这里的ids是menu菜单中几个控件的id数组
public void SetTextViewColor(int id) {
for (int i = 0; i < ids.length; i++) {
TextView view = (TextView) findViewById(ids[i]);
if (id == ids[i]) {
view.setTextColor(Color.parseColor("#FF4081"));
view.setTextSize(16);
view.setBackgroundColor(Color.parseColor("#eeeeee"));
Drawable drawable = getResources().getDrawable(imagestwo[i]);
drawable.setBounds(0, 0, drawable.getMinimumWidth(), drawable.getMinimumHeight());
view.setCompoundDrawables(null, drawable, null, null);
} else {
view.setTextColor(Color.parseColor("#333333"));
view.setTextSize(15);
view.setBackground(null);
Drawable drawable = getResources().getDrawable(images[i]);
drawable.setBounds(0, 0, drawable.getMinimumWidth(), drawable.getMinimumHeight());
view.setCompoundDrawables(null, drawable, null, null);
}
}
温馨提示: 这里的Fragment管理栈不建议使用show(),hide()方法,因为这种主页面几乎没Activity什么事了,几乎所有的界面都由Fragment支撑,很显然用Show(),Hide()方法主页面Fragment栈管理会有很多的Fragment，这样会影响程序的性能问题.很可能导致程序崩溃.