16.FragmentTabHost用法

FragmentTabHost组成

  1. Tabhost,TabWidget,切换的内容容器FrameLayout
  2. 层级关系 ----FragmentTabHost |-----TabWidget |-----FrameLayout

布局实现

  1. 实现tabhost采用android.support.v4.app.FragmentTabHost 注意 id:@android:id/tabhost
  2. 实现tabWidget 注意 id:@android:id/tabs
  3. 实现FrameLayout 注意 1. id: @android:id/tabcontent 2. 此容器已经被废除,但在布局中必须有
  4. 实现自定义的内容容器区域(FrameLayout) 注意 : 1. 整体需采用线性布局 2. 将自定义展示的区域放到TabHost之上 3. 自定义的内容需要给权重

代码实现

  1. 初始化TabHost 调用setup(Context,FragmentManager,int); 最后一个参数 指的是 Fragment的容器id 用来切换fragment的
  2. 新建TabSpec 调用setIndicator(View view)//实现自定义的tab
  3. 添加TabSpec 调用addTab(TabSpec,Class,Bundle)的方法添加TabSpec Class 指的是 tab对应的 Fragment Bundle 指的是 Fragment 初始化的参数

组合式控件的实现(下面的Tab一般都自定义)

  1. 新建布局
  2. 将布局和代码进行关联 新建的View 必须继承 和 布局容器一样的容器类 通过View.inflate(context,LayoutId, this)将View和xml进行绑定
  3. 功能进行封装 根据当前View需要的功能进行封装

布局:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <FrameLayout
        android:id="@+id/activity_home_container"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >
    </FrameLayout>
    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:background="#FFF1F1F1" >
        </TabWidget>
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp" >
        </FrameLayout>
    </android.support.v4.app.FragmentTabHost>
</LinearLayout>

  代码:

public class HomeActivity extends BaseActivity implements OnTabChangeListener {
	private static final String TAB_CHAT = "chat";
	private static final String TAB_CONTACT = "contact";
	private static final String TAB_DISCOVER = "discover";
	private static final String TAB_ME = "me";
	private FragmentTabHost tabhost;
	private TabIndicatorView chatIndicator;
	private TabIndicatorView contactIndicator;
	private TabIndicatorView discoverIndicator;
	private TabIndicatorView meIndicator;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.act_home);
		// 1. 初始化TabHost
		tabhost = (FragmentTabHost) findViewById(android.R.id.tabhost);
		tabhost.setup(this, getSupportFragmentManager(),
				R.id.activity_home_container);//上面的fargment
		// 2. 新建TabSpec
		TabSpec spec = tabhost.newTabSpec(TAB_CHAT);//需要自定义常量
		chatIndicator = new TabIndicatorView(this);
		chatIndicator.setTabTitle("消息");
		chatIndicator.setTabIcon(R.drawable.tab_icon_chat_normal,
				R.drawable.tab_icon_chat_focus);//选中和默认的图标
		spec.setIndicator(chatIndicator);
		// 3. 添加TabSpec
		tabhost.addTab(spec, ChatFra.class, null);//添加上面的fargment
		// 2. 新建TabSpec
		spec = tabhost.newTabSpec(TAB_CONTACT);
		contactIndicator = new TabIndicatorView(this);
		contactIndicator.setTabIcon(R.drawable.tab_icon_contact_normal,
				R.drawable.tab_icon_contact_focus);
		contactIndicator.setTabTitle("通讯录");
		contactIndicator.setTabUnreadCount(10);
		spec.setIndicator(contactIndicator);
		// 3. 添加TabSpec
		tabhost.addTab(spec, ContactFra.class, null);
		// 2. 新建TabSpec
		spec = tabhost.newTabSpec(TAB_DISCOVER);
		discoverIndicator = new TabIndicatorView(this);
		discoverIndicator.setTabIcon(R.drawable.tab_icon_discover_normal,
				R.drawable.tab_icon_discover_focus);
		discoverIndicator.setTabTitle("发现");
		discoverIndicator.setTabUnreadCount(10);
		spec.setIndicator(discoverIndicator);
		// 3. 添加TabSpec
		tabhost.addTab(spec, DiscoverFra.class, null);
		// 2. 新建TabSpec
		spec = tabhost.newTabSpec(TAB_ME);
		meIndicator = new TabIndicatorView(this);
		meIndicator.setTabIcon(R.drawable.tab_icon_me_normal,
				R.drawable.tab_icon_me_focus);
		meIndicator.setTabTitle("我");
		meIndicator.setTabUnreadCount(10);
		spec.setIndicator(meIndicator);
		// 3. 添加TabSpec
		tabhost.addTab(spec, MeFra.class, null);
		// 去掉分割线
		tabhost.getTabWidget().setDividerDrawable(android.R.color.white);
		// 初始化 tab选中
		tabhost.setCurrentTabByTag(TAB_CHAT);
		chatIndicator.setTabSelected(true);
		// 设置tab切换的监听
		tabhost.setOnTabChangedListener(this);
	}
	@Override
	public void onTabChanged(String tag) {
		chatIndicator.setTabSelected(false);
		contactIndicator.setTabSelected(false);
		discoverIndicator.setTabSelected(false);
		meIndicator.setTabSelected(false);
		if (TAB_CHAT.equals(tag)) {
			chatIndicator.setTabSelected(true);
		} else if (TAB_CONTACT.equals(tag)) {
			contactIndicator.setTabSelected(true);
		} else if (TAB_DISCOVER.equals(tag)) {
			discoverIndicator.setTabSelected(true);
		} else if (TAB_ME.equals(tag)) {
			meIndicator.setTabSelected(true);
		}
	}
}

下面的自定义,动态的去添加信息

public class TabIndicatorView extends RelativeLayout {
	private ImageView ivTabIcon;
	private TextView tvTabHint;
	private TextView tvTabUnRead;
	private int normalIconId;
	private int focusIconId;
	public TabIndicatorView(Context context) {
		this(context, null);//这个实现这个构造函数就可以了
	}
	public TabIndicatorView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// 将布局文件和 代码进行绑定
		View.inflate(context, R.layout.tab_indicator, this);
		ivTabIcon = (ImageView) findViewById(R.id.tab_indicator_icon);
		tvTabHint = (TextView) findViewById(R.id.tab_indicator_hint);
		tvTabUnRead = (TextView) findViewById(R.id.tab_indicator_unread);
		
		setTabUnreadCount(0);
	}
	// 设置tab的title
	public void setTabTitle(String title) {
		tvTabHint.setText(title);
	}
	public void setTabTitle(int titleId) {
		tvTabHint.setText(titleId);
	}
	// 初始化图标
	public void setTabIcon(int normalIconId, int focusIconId) {
		this.normalIconId = normalIconId;
		this.focusIconId = focusIconId;
		ivTabIcon.setImageResource(normalIconId);
	}
	// 设置未读数
	public void setTabUnreadCount(int unreadCount) {
		if (unreadCount <= 0) {
			tvTabUnRead.setVisibility(View.GONE);
		} else {
			if (unreadCount <= 99) {
				tvTabUnRead.setText(unreadCount + "");
			} else {
				tvTabUnRead.setText("99+");
			}
			tvTabUnRead.setVisibility(View.VISIBLE);
		}
	}
	// 设置选中
	public void setTabSelected(boolean selected) {
		if (selected) {
			ivTabIcon.setImageResource(focusIconId);
		} else {
			ivTabIcon.setImageResource(normalIconId);
		}
	}
}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Android源码框架分析

三句代码创建全屏Dialog或者DialogFragment:带你从源码角度实现全屏Dialog

Dialog是APP开发中常用的控件,同Activity类似,拥有独立的Window窗口,但是Dialog跟Activity还是有一定区别的,最明显的就是:默认...

44340
来自专栏Android干货

Android项目实战(五):TextView自适应大小

383120
来自专栏7号代码

Android应用界面开发——ListView,GridView,ScrollView

ListView的意思是列表视图,是应用最广泛的一种视图,例如联系人,功能列表,菜单等等都会用到ListView。

11530
来自专栏Android干货

安卓开发_九宫格布局

30630
来自专栏小巫技术博客

A020-列表容器之ListView

前面介绍了Android UI中的五大布局容器,本节课介绍实际项目当中经常会用到的组件-ListView,它也是一个布局容器,它的每一项就是我们的列表项,每一个...

11130
来自专栏Android开发与分享

【Android】造轮子:轮播图

44250
来自专栏三好码农的三亩自留地

教你搞定Android自定义ViewGroup

我们知道ViewGroup就是View的容器类,我们经常用的LinearLayout,RelativeLayout等都是ViewGroup的子类,因为ViewG...

8510
来自专栏Android干货园

高仿微信朋友圈评论popwindow

版权声明:本文为博主原创文章,转载请标明出处。 https://blog.csdn.net/lyhhj/article/details/47...

24610
来自专栏Android干货园

Android自定义View之TitleBar,通用标题栏

版权声明:本文为博主原创文章,转载请标明出处。 https://blog.csdn.net/lyhhj/article/details/49...

24720
来自专栏Android干货

Android项目实战(四十七):轮播图效果Viewpager

34590

扫码关注云+社区

领取腾讯云代金券