Tabhost选项卡上图片和文字不能同时显示的解决方案

尽管当前谷歌已经不推荐使用tabhost了，但是作为初学者，掌握这个经典的控件还是非常有必要的，在上手这个控件以后我们会发现一个问题，添加选项卡时同时添加了文字和图片但是Tabhost却只显示出了文字，针对这个问题我们可以对tabhost的选项卡即tabSpec自定义来进行解决，布局文件比较简单就不多说了，直接看MainActivity.java中的实现吧。

自定义方法如下：

          public View composeLayout(String s, int i) {
		LinearLayout layout = new LinearLayout(this);
		layout.setOrientation(LinearLayout.VERTICAL);
		ImageView iv = new ImageView(this);
		iv.setImageResource(i);
		LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(
		LinearLayout.LayoutParams.WRAP_CONTENT,
		LinearLayout.LayoutParams.WRAP_CONTENT);
		lp.setMargins(60,10, 0, 0);
		layout.addView(iv, lp);
		TextView tv = new TextView(this);
		tv.setGravity(Gravity.LEFT);
		tv.setSingleLine(true);
		tv.setText(s);
		tv.setTextColor(Color.WHITE);
		tv.setTextSize(14);
		tv.setPadding(40, 5, 0, 0);;
		layout.addView(tv, new LinearLayout.LayoutParams(
		LinearLayout.LayoutParams.WRAP_CONTENT,
		LinearLayout.LayoutParams.WRAP_CONTENT));
		return layout;
	}

自定义的方法ok以后就可以在onCreate()上进行添加了：

                TabHost tab = (TabHost) findViewById(R.id.tabhost);
		tab.setup(this.getLocalActivityManager());

		TabHost.TabSpec specOne = tab.newTabSpec("选项卡一");
		specOne.setIndicator(composeLayout("精品推荐", R.drawable.pic1));
		specOne.setContent(R.id.tab1);
		tab.addTab(specOne);  

		TabHost.TabSpec specTwo = tab.newTabSpec("选项卡二");
		specTwo.setIndicator(composeLayout("专题分类", R.drawable.pic2));
		specTwo.setContent(R.id.tab2);
		tab.addTab(specTwo);

		TabHost.TabSpec specThree = tab.newTabSpec("选项卡三");
		specThree.setIndicator(composeLayout("  排行榜", R.drawable.pic3));
		specThree.setContent(R.id.tab3);
		tab.addTab(specThree);

		TabHost.TabSpec specFour = tab.newTabSpec("选项卡四");
		specFour.setIndicator(composeLayout("下载管理", R.drawable.pic4));
		specFour.setContent(R.id.tab4);
		tab.addTab(specFour);

这里添加了四个，可以根据自己的需求进行调整。

最终实现的效果如下，注意底部：

此处为实现底部点选的效果我将tabhost的选项卡设置到了底部，下一篇文章，将简述一下这项设置的具体操作。

版权声明：本文为博主原创文章，未经博主允许不得转载。