2015-12-21 32 views
1

我想在选中和取消选择时更改选项卡的背景颜色。另外,我希望为边框添加一些功能到TabHost。 我已经有了创建的标签和当前的内容。Android自定义使用XML的标签主题

更具体地说,我会上传一张我想要的图片。它显示三个选项卡,其中第二个选项。

TabHost Layout

回答

1

首先使用tabhost创建tabwidget。

<TabHost 
     android:id="@android:id/tabhost" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" > 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:orientation="vertical" > 

      <HorizontalScrollView 
       android:id="@+id/tabsHorizontalScrollView" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:fillViewport="true" 
       android:scrollbars="none" > 

       <TabWidget 
        android:id="@android:id/tabs" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginLeft="0dip" 
        android:layout_marginRight="0dip" 
        android:fadingEdge="none" 
        android:showDividers="none" /> 
      </HorizontalScrollView> 

      <!-- <View 
       android:layout_width="fill_parent" 
       android:layout_height="1dip" 
       android:background="#EFEFEF" /> --> 

      <FrameLayout 
       android:id="@android:id/tabcontent" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" > 

       <android.support.v4.view.ViewPager 
        android:id="@+id/viewPager" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent" /> 
      </FrameLayout> 
     </LinearLayout> 
    </TabHost> 

这里n我的情况,我把我的tabwidget里面horizo​​ntalscroll。

现在为选项卡背景创建布局(我已创建为tab_bg.xml)并粘贴此xml文件。

tab_bg.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/tabsLayout" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:background="@drawable/tab_bg_selector" 
    android:gravity="center" 
    android:orientation="vertical" 
    android:paddingBottom="@dimen/horizontal_scroll_padding_topbottom" 
    android:paddingLeft="@dimen/horizontal_scroll_padding_leftright" 
    android:paddingRight="@dimen/horizontal_scroll_padding_leftright" 
    android:paddingTop="@dimen/horizontal_scroll_padding_topbottom" > 

    <TextView 
     android:id="@+id/tabsText" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textColor="@drawable/tab_text_selector" 
     android:textSize="@dimen/tab_txt_view_txt_size" /> 

</LinearLayout> 

你可以改变颜色按你的。

再次创建4个xml文件并将其放入可绘制文件夹中。

在我的情况下,我用< 1> tab_bg_selecter.xml

<?xml version="1.0" encoding="utf-8"?> 

    <selector xmlns:android="http://schemas.android.com/apk/res/android"> 

     <!-- Active tab --> 
     <item android:state_selected="true" android:state_focused="false" 
      android:state_pressed="false" android:drawable="@drawable/tab_bg_selected" /> 
     <!-- Inactive tab --> 
     <item android:state_selected="false" android:state_focused="false" 
      android:state_pressed="false" android:drawable="@drawable/tab_bg_unselected" /> 
     <!-- Pressed tab --> 
     <item android:state_pressed="true" android:drawable="@color/transparent" /> 
     <!-- Selected tab (using d-pad) --> 
     <item android:state_focused="true" android:state_selected="true" 
      android:state_pressed="false" android:drawable="@color/transparent" /> 
    </selector> 

< 2> tab_bg_selected.xml

<?xml version="1.0" encoding="UTF-8"?> 

    <shape xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle" > 

     <gradient 
      android:angle="-90" 
      android:centerColor="#6EBD52" 
      android:endColor="#6EBD52" 
      android:startColor="#6EBD52" /> 

    </shape> 

< 3> tab_bg_unselected.xml

<?xml version="1.0" encoding="utf-8"?> 

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle" > 

    <gradient 
     android:angle="-90" 
     android:centerColor="#ffffff" 
     android:endColor="#ffffff" 
     android:startColor="#ffffff" /> 

</shape> 

< 4 > tab_text_selecter.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_selected="true" android:color="@android:color/black" /> 
    <item android:state_focused="true" android:color="@android:color/black" /> 
    <item android:state_pressed="true" android:color="@android:color/black" /> 
    <item android:color="#C7C7CC" /> 
</selector> 
如果你想在标签中选择的时间来改变你的标签文本改变

这个答案很长,但完全自定义,希望它对你有用。

+0

好的,我找到了你!我已经使用TabHosts创建了它。不过,我有一些问题需要使用tab_bg.xml。 – Tarcisiofl

+0

请解释你使用tab_bg.xml的问题 –

+0

我发现如何添加它。谢谢 – Tarcisiofl

0

调用此方法在onCreate()方法

setupTabHost(); 

并且比使用该设置的选项卡名称,在我的情况下,它是A2Z字符

for (ch = 'A'; ch <= 'Z'; ch++) { 
      charToString = String.valueOf(ch); 
      setupTab(new TextView(this), charToString); 
     } 

终于OnCreate中使用此的外部;

// TODO Auto-generated method stub 
private void setupTabHost() { 
     // TODO Auto-generated method stub 
     mTabHost = (TabHost) findViewById(android.R.id.tabhost); 
     mTabHost.setup(); 
    }    



       private void setupTab(final View view, final String tag) { 
// TODO Auto-generated method stub 
View tabview = createTabView(mTabHost.getContext(), tag); 

TabSpec setContent = mTabHost.newTabSpec(tag).setIndicator(tabview) 
     .setContent(new TabContentFactory() { 
      public View createTabContent(String tag) { 
       return view; 
      } 
     }); 
mTabHost.addTab(setContent); 

}

private View createTabView(final Context context, final String text) { 
     // TODO Auto-generated method stub 
     View view = getLayoutInflater().inflate(R.layout.tabs_bg, null); 
     tabTextView = (TextView) view.findViewById(R.id.tabsText); 
     tabTextView.setText(text); 
     return view; 
    } 

它可能对你有所帮助。

+0

我用两个答案来实现它。它是一个迷人的工作。只有,现在需要围绕制表符放置边框。谢谢 – Tarcisiofl

+0

你可以放置边框的视图(请参阅我在tabhost中的评论字段),或者在drawable部分中,可以为tab_bg_unselected.xml放置边框,使其与选定的ta颜色具有相同颜色的正方形形状。 –

+1

我把它放在xml中,它正在工作。谢谢! – Tarcisiofl