2012-10-08 57 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不同標籤的指標。