2012-10-08 55 views
2

我需要的tabbar背景设置为白色。另外我需要将选定的选项卡背景颜色设置为粉色,其余选项卡(未选中选项卡)背景颜色设置为蓝色。我现有的代码如下所示。我需要改变什么?android上的tablayout设计

main.xml中:

<?xml version="1.0" encoding="utf-8"?> 
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@android:id/tabhost" 
android:background="#ffffffff" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent"> 
<LinearLayout 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:background="#ffffffff" > 
    <TabWidget 
     android:id="@android:id/tabs" 
     android:background="@drawable/tabicon" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" /> 
    <FrameLayout 
     android:id="@android:id/tabcontent" 
     android:layout_width="fill_parent" 
     android:background="#ffffffff" 
     android:layout_height="fill_parent"/> 
</LinearLayout> 
</TabHost> 

tab_indicator.xml:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
<!-- Non focused states --> 
<item android:state_focused="false" android:state_selected="false" 
    android:state_pressed="false" 
    android:drawable="@drawable/tab_unselected_v4" /> 
<item android:state_focused="false" android:state_selected="true" 
    android:state_pressed="false" 
    android:drawable="@drawable/tab_selected_v4" /> 

<!-- Focused states --> 
<item android:state_focused="true" android:state_selected="false" 
    android:state_pressed="false" 
    android:drawable="@drawable/tab_focus" /> 
<item android:state_focused="true" android:state_selected="true" 
    android:state_pressed="false" 
    android:drawable="@drawable/tab_focus" /> 

<!-- Pressed --> 
<item android:state_pressed="true" 
    android:drawable="@drawable/tab_press" /> 
</selector> 

tab_unselected_v4.xml:

<?xml version="1.0" encoding="utf-8"?> 
    <selector xmlns:android="http://schemas.android.com/apk/res/android" > 
<item android:state_pressed="true"> 
    <shape> 
     <gradient android:startColor="#FFFFFF" 
      android:endColor="#FFFFFF" 
      /> 

    </shape> 
</item> 
</selector> 

tab_focus.xml:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle"> 
<!-- Gradient BgColor for listrow Selected --> 
<gradient 
    android:startColor="#5e8fb7" 
    android:centerColor="#5e8fb7" 
    android:endColor="#5e8fb7" 
    /> 
</shape> 

tab_selected.xml:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle"> 
<!-- Gradient Bg for listrow --> 
<gradient 
    android:startColor="#5e8fb7" 
    android:centerColor="#5e8fb7" 
    android:endColor="#5e8fb7" 
    /> 
</shape> 

tab_press.xml:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle"> 
<!-- Gradient Bg for listrow --> 
<gradient 
    android:startColor="#FFFFFF" 
    android:centerColor="#FFFFFF" 
    android:endColor="#FFFFFF" 
    /> 
</shape> 

编辑: 我已经加入以下code.now我的背景颜色是改变white.but但我选择的项目和未选择的项目颜色没有设置所需的颜色。请帮助我给我一些很好的解决方案。

tabicon.xml:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android" > 
<item android:state_pressed="true"> 
    <shape> 
     <gradient android:startColor="#FFFFFF" 
      android:endColor="#FFFFFF" 
      android:angle="90" 
       /> 
       </shape> 
       </item> 
     <item android:state_focused="true"> 
    <shape> 
     <gradient android:startColor="#FFFFFF" 
      android:endColor="#FFFFFF" 
      android:angle="90" /> 

    </shape> 
</item> 
       </selector> 

还添加以下Java代码:

for(int i=0;i<tabHost.getTabWidget().getChildCount();i++) 
    { 

    tabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.tab_indicator); 
    } 
    tabHost.getTabWidget().setCurrentTab(0); 

    tabHost.getTabWidget().getChildAt(0).setBackgroundResource(R.drawable.tab_indicator); 

    } 

    public void onTabChanged(String tabId) { 

    // TODO Auto-generated method stub 
    for(int i=0;i<tabHost.getTabWidget().getChildCount();i++) 
     { 
    tabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.tab_indicator); 
    } 
    tabHost.getTabWidget().getChildAt(tabHost.getCurrentTab()).setBackgroundResource(R.drawable.tab_indicator); 
    } 
     } 

编辑:

在这里,我必须设置所选择的背景颜色和背景未选择的颜色成功。

现在我想在这里需要一个实现。

第一个选项卡宽度大于第二和第三标签宽度更大的I。如何可以做到这一点???? 请帮助我。

在这里,仪表板选项卡大于订单和客户tab.please帮助我。我可以设计和开发这个。 这是我的输出: current o/p

我想需要的O/P是像下图:

wish to need the o/p

编辑:

在这里,我必须在使用此代码我的style.xml

<style name="CustomTheme" parent="@android:style/Theme"> 
    <item name="android:tabWidgetStyle">@style/CustomTabWidget</item> 
    </style> 
    <style name="CustomTabWidget" parent="@android:style/Widget.TabWidget"> 
    <item name="android:textAppearance">@style/CustomTabWidgetText</item> 
    </style> 
    <style name="CustomTabWidgetText" 
    parent="@android:style/TextAppearance.Widget.TabWidget"> 
    <item name="android:textSize">20sp</item> 
    <item name="android:textStyle">bold</item> 
    </style> 

Afterthat下面一行添加在AndroidManifest.xml文件:

<activity android:name="MyTabActivity" android:theme="@style/CustomTheme"> 

现在,我已经成功地改变了我的字体大小和颜色和款式上tabhost。

回答

0

我认为这将是更好,如果你把TabWidget在具有类似如下的白色背景上的LinearLayout:

 <LinearLayout 
       android:id="@+id/ll_tab_widget" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:background="@android:color/white" > 

     <TabWidget 
     android:id="@android:id/tabs" 
     android:background="@drawable/tabicon" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" /> 

     </LinearLayout> 

而且,设置选定和未选定的颜色,你可以创建一个XML用的RelativeLayout其背景是一个选择器(具有不同的图像或颜色为选中和未选中状态),如下所示:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     android:id="@+id/tabsLayout" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:background="@drawable/selector_selected_unselected"> 


</RelativeLayout> 

然后可以膨胀由上述XML的TabHost.TabSpec指示器。

如果您发现任何困难,您可以发表相同的内容。 一切顺利!

+0

请解释清楚。我不明白。这里selector_selected_unselected表示你在这里指定的内容。 – user1676640

+0

我得到了我所选项目的解决方案,并且未选中的项目背景颜色已成功更改。 – user1676640

+0

现在我希望需要第一个标签宽度大于第二个和第三个标签width.hoe我可以开发这 – user1676640

0

如果您希望第一个制表符宽度大于第二个制表符宽度和第三个制表符宽度,则可以为它分别设置xml并相应地指定宽度。我讲的这个XML:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     android:id="@+id/tabsLayout" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:background="@drawable/selector_selected_unselected"> 


</RelativeLayout> 

虽然充气选项卡指示器,可以用充气不同个XML不同标签的指标。