自定义TAB三种实现方式 Android开发

网站首页 > Android开发

自定义TAB三种实现方式

自定义TAB样式的实现
想必大家已看过很多资料的介绍
经在下总结，大致有以下三种实现方式：

1.自定义TabWidget
2.RadioGroup
3.ActivityGroup

下面本人就以上三种方式一一介绍,上图先:

主界面：

自定义TabWidget

RadioGroup

ActivityGroup

不难看出，以上三种方式实现的效果基本一致（如无特殊需求的话）
要实现自定义TAB
无非是要实现以下三点：
1.TAB的主背景
2.TAB的item视图
3.TAB的ITEM选择效果
且看自定义TABWIDGET
在配置文件里TAB背景图如此设置便可：

<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="2dip"
android:background="@drawable/tab_widget_background"
android:layout_weight="0.0"/>

ITEM视图则在代码里设置

for(int i = 0; i < count; i++)
{
TabSpec tabSpec = m_tabHost.newTabSpec(ConValue.mTextviewArray[i]).
setIndicator(getTabItemView(i)).
setContent(getTabItemIntent(i));
m_tabHost.addTab(tabSpec);
m_tabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.selector_tab_background);
}

private View getTabItemView(int index)
{
View view = mLayoutInflater.inflate(R.layout.tab_item_view, null);
ImageView imageView = (ImageView) view.findViewById(R.id.imageview);
if (imageView != null)
{
imageView.setImageResource(ConValue.mImageViewArray[index]);
}
TextView textView = (TextView) view.findViewById(R.id.textview);
textView.setText(ConValue.mTextviewArray[index]);
return view;
}

setIndicator(getTabItemView(i))是关键

.TAB的ITEM选择效果则依赖
m_tabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.selector_tab_background);

-------------------------------------------->

RadioGroup实现如下：
-------------------------------------------->

TAB背景图

<RadioGroup
android:id="@+id/main_radiogroup"
android:gravity="center_vertical"
android:layout_gravity="bottom"
android:orientation="horizontal"
android:padding="2dip"
android:background="@drawable/tab_widget_background"
android:layout_width="fill_parent"
android:layout_height="wrap_content">

ITEM视图的设置

<RadioButton
android:id="@+id/RadioButton0"
android:text="主页"
android:drawableTop="@drawable/tab_icon1"
style="@style/tab_item_background" />

复制代码

TAB的ITEM选择效果体现在
style="@style/tab_item_background"

<style name="tab_item_background">
<item name="android:textAppearance">@style/tab_item_text_style</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:background">@drawable/selector_tab_background2</item>
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:button">@null</item>
<item name="android:drawablePadding">3.0dip</item>
<item name="android:layout_weight">1.0</item>
</style>

ActivityGroup实现如下：
-------------------------------------------->
ActivityGroup方式无TabWidget,所以是假TAB的实现

TAB背景图

<GridView
android:id="@+id/bottom_tab"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:padding="2dp"
android:background="@drawable/tab_widget_background"
android:listSelector="@drawable/selector_tab_background"
android:numColumns="5">
</GridView>

ITEM视图的设置

mBottomGridView = (GridView) findViewById(R.id.bottom_tab);
mBottomGridViewAdapter = new GridViewAdapter(this, ConValue.mImageViewArray, ConValue.mTextviewArray);

复制代码

适配器GridViewAdapter里实现getView方式返回视图