Search code examples
android-tabhostandroidandroid-tabs

TabWidget background color on Samsung devices


My TabWidget's background color is light grey on HTC and Nexus devices...however it's blue-ish/dark grey on Samsung devices. Why is that? I'm even using a custom theme for the tabwidget, as created by android-holo-colors.com


Solution

  • Here's the style and the layout for the tab:

    <style name="AppBaseTheme" parent="android:Theme.Light">
    </style>
    
    <style name="TabMyTheme">
      <item name="android:gravity">center_horizontal</item>
      <item name="android:paddingLeft">16dip</item>
      <item name="android:paddingRight">16dip</item>
      <item name="android:background">@drawable/mytheme_tab_indicator_holo</item>
      <item name="android:layout_width">0dip</item>
      <item name="android:layout_weight">1</item>
      <item name="android:minWidth">80dip</item>
    </style>
    
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_height="@dimen/tab_host_default_height"
        android:orientation="horizontal"
        style="@style/TabMyTheme"
        android:gravity="center">
    
        <ImageView
            android:id="@android:id/icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical|center_horizontal"
            android:visibility="gone"
            android:adjustViewBounds="true"
            android:scaleType="fitCenter"
            android:contentDescription="@null" />
    
        <TextView
            android:id="@android:id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            style="@style/TabTextMyTheme" />
    </LinearLayout>
    

    I believe the problem is the fact that the default look of tabs is different for Samsung, and given that the background images generated by android-color-colors are transparent on top, and have the color just for the bottom part (ie: the thin or thick colored line at the bottom of each tab), on the top they just use the system default color.

    I changed each and every image generated by the website, replacing the transparent color with my grey, and now it looks fine everywhere.