760 字
4 分钟
利用FragmentTabHost完成底部菜单
利用FragmentTabHost完成底部菜单
activity_main.xml
<?xml version="1.0" encoding="utf-8"?><!--注意id是系统内部的tabhost--><android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/tabhost" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/white">
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <!--注意id是系统内部的tabcontent--> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:background="@color/tabbar_content_bg" />
<View android:layout_width="match_parent" android:layout_height="@dimen/margin_1_dp" android:background="@color/tabbar_line_color" /> <!--注意id是系统内部的tabs--> <TabWidget android:id="@android:id/tabs" android:layout_width="match_parent" android:layout_height="@dimen/tabbar_height" android:layout_gravity="bottom" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>tab_indicator.xml（每个tab对应的布局视图）
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:gravity="center" android:background="@android:color/white">
<ImageView android:id="@+id/iv_tab" android:layout_width="24dp" android:layout_height="24dp" android:contentDescription="@null" android:src="@mipmap/apk_bottom_ic_first"/>
<TextView android:id="@+id/tv_tab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/tabbar_home_text" android:textColor="@color/tabbar_text_normal_color" android:layout_marginTop="@dimen/margin_2_dp" android:textSize="10sp"/>
</LinearLayout>4个fragment
fragment中大家可能会发现没onCreare()、onCreateView()这些方法，是因为我是基于自己定义的BaseFragment，省去了大部分的写法，大家可以不用太在意CartFragment.class
package com.tc.mobileshop.project.cart.view;
import android.view.View;
import com.tc.mobileshop.R;import com.tc.mobileshop.mvp.presenter.MvpPresenter;import com.tc.mobileshop.mvp.view.MvpView;import com.tc.mobileshop.project.base.view.BaseFrament;
/** * 购物车 * Created by 辉神 on 2016/8/8. */
public class CartFragment extends BaseFrament { @Override protected void initContentView(View contentView) {
}
@Override public int bindeLayoutId() { return R.layout.fragment_cart; }
}HomeFragment.class
package com.tc.mobileshop.project.home.view;
import android.view.View;
import com.tc.mobileshop.R;import com.tc.mobileshop.project.base.view.BaseFrament;
/** * 主页 * Created by 辉神 on 2016/8/8. */
public class HomeFragment extends BaseFrament { @Override protected void initContentView(View contentView) {
}
@Override public int bindeLayoutId() { return R.layout.fragment_home; }
}MineFragment.class
package com.tc.mobileshop.project.mine.view;
import android.view.View;
import com.tc.mobileshop.R;import com.tc.mobileshop.project.base.view.BaseFrament;
/** * 我的 * Created by 辉神 on 2016/8/8. */
public class MineFragment extends BaseFrament { @Override protected void initContentView(View contentView) {
}
@Override public int bindeLayoutId() { return R.layout.fragment_mine; }
}TataFragment.class
package com.tc.mobileshop.project.tata.view;
import android.view.View;
import com.tc.mobileshop.R;import com.tc.mobileshop.project.base.view.BaseFrament;
/** * 她她圈 * Created by 辉神 on 2016/8/8. */
public class TataFragment extends BaseFrament { @Override protected void initContentView(View contentView) {
}
@Override public int bindeLayoutId() { return R.layout.fragment_tata; }
}TabItem.class
/** * tab数据 */ private class TabItem { //正常的tab图片 private int tabImageNomalRes; //tab被点击时的图片 private int tabImagePressRes; //tab标题 private int tabtextRes; //当前tab所属的fragment private Class<? extends Fragment> fragmentClass; //当前tab的视图 private View view; //当前tab的文字标题 private TextView tabTitle; //当前tab的图标 private ImageView tabImage;
public TabItem( int tabImageNomalRes, int tabImagePressRes, int tabtext, Class<? extends Fragment> fragmentClass) { this.tabImageNomalRes = tabImageNomalRes; this.tabImagePressRes = tabImagePressRes; this.tabtextRes = tabtext; this.fragmentClass = fragmentClass; }
/*** * 返回tab标题 * * @return */ private String getTitleStr() { return (String) getResources().getText(tabtextRes); }
/** * 初始化tab中的View，并返回View * @return */ public View getIndicator() { if (view == null) { view = getLayoutInflater().inflate(R.layout.tab_indicator, null); tabTitle = (TextView) view.findViewById(R.id.tv_tab); tabImage = (ImageView) view.findViewById(R.id.iv_tab); tabImage.setImageResource(tabImageNomalRes);//默认正常图片 tabTitle.setText(getTitleStr()); } return view; }
/** * 通过判断是否选中，来变更图片 * * @param checked */ private void setChecked(boolean checked) { if (checked) { tabTitle.setTextColor(getResources().getColor(R.color.tabbar_text_press_color)); tabImage.setImageResource(tabImagePressRes); } else { tabTitle.setTextColor(getResources().getColor(R.color.tabbar_text_normal_color)); tabImage.setImageResource(tabImageNomalRes); } } }初始化tab数据
/** * 初始化tab数据 */ private void initTabItemData() { tabItems = new ArrayList<>(); tabItems.add( new TabItem(R.mipmap.apk_bottom_ic_first, R.mipmap.apk_bottom_ic_first_up, R.string.tabbar_home_text, HomeFragment.class)); tabItems.add( new TabItem(R.mipmap.apk_bottom_ic_tata, R.mipmap.apk_bottom_ic_tata_up, R.string.tabbar_tata_text, TataFragment.class)); tabItems.add( new TabItem(R.mipmap.apk_bottom_ic_buy, R.mipmap.apk_bottom_ic_buy_up, R.string.tabbar_cart_text, CartFragment.class)); tabItems.add( new TabItem(R.mipmap.apk_bottom_ic_mine, R.mipmap.apk_bottom_ic_mine_up, R.string.tabbar_mine_text, MineFragment.class)); }初始化tabHost
/** * 初始化tabHost */ private void initTabHost() { fragmentTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost); fragmentTabHost.setup(this, getSupportFragmentManager(), android.R.id.tabcontent); //去掉tab的分隔线 fragmentTabHost.getTabWidget().setDividerDrawable(null); for (int i = 0; i < tabItems.size(); i++) { TabItem tabitem = tabItems.get(i); //创建一个Tab TabHost.TabSpec tabSpec = fragmentTabHost.newTabSpec(tabitem.getTitleStr()).setIndicator(tabitem.getIndicator()); //将tab添加到tabHost中 fragmentTabHost.addTab(tabSpec, tabitem.fragmentClass, null); //指定Tab的北景 fragmentTabHost.getTabWidget().setBackgroundColor(Color.WHITE); //设置tab改变的监听 fragmentTabHost.setOnTabChangedListener(this); //首页是默认选中，所以应该设置首页为选中的图片 if (i == 0) { tabitem.setChecked(true); } }
} /** * 监听改变，用于点击时改变图标 * @param tabId */ @Override public void onTabChanged(String tabId) { for (int i = 0; i < tabItems.size(); i++) { TabItem tabItem = tabItems.get(i); if (tabId.equals(tabItem.getTitleStr())) { tabItem.setChecked(true); } else { tabItem.setChecked(false); } } } 利用FragmentTabHost完成底部菜单
https://iszengmh.pages.dev/posts/利用fragmenttabhost完成底部菜单/