Develop Reference

Remove BottomNavigationView Icons and center title

I have a bottom navigation view with 3 items. I want to only have centered text for each tab, and would therefore like to fully remove icons (not only make them transparent).
How can I remove Icons and center the titles?
This is what I have:
This is what I want:
My code: (Prefer solution in XML)
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="55dp"
android:layout_alignParentBottom="true">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/navigationBar"
android:background="#color/navigation"
app:theme="#style/BottomNavigationTheme"
app:menu="#menu/bottom_navigation_menu"
android:minHeight="#dimen/abc_action_bar_default_height_material">
</com.google.android.material.bottomnavigation.BottomNavigationView>
</RelativeLayout>
</merge>
bottom_navigation_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/ic_home"
android:title="#string/home">
</item>
<item
android:id="#+id/ic_today"
android:title="#string/today">
</item>
<item
android:id="#+id/ic_you"
android:title="#string/you">
</item>
</menu>

The easiest way is to just use
android:paddingBottom="16dp" //(any dp you want)
android:clipToPadding="false"

This works, for me
private int baselineHeight = 0;
private void removeIcons(BottomNavigationView view) {
BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
for (int i = 0; i < menuView.getChildCount(); i++) {
BottomNavigationItemView itemView = (BottomNavigationItemView) (menuView.getChildAt(i));
BaselineLayout baseline = (BaselineLayout) itemView.getChildAt(1);
FrameLayout.LayoutParams layoutParams = (FrameLayout.LayoutParams) baseline.getLayoutParams();
baselineHeight = baselineHeight > 0 ? baselineHeight : (menuView.getHeight() + baseline.getHeight()) / 2;
layoutParams.height = baselineHeight;
baseline.setLayoutParams(layoutParams);
}
}
just call it in onCreate() in your Activity and pass your BottomNavigationView as parameter.
If you don't want to clutter your Activities or Fragments with excess code and you want this present in your layout XML you can create a custom View that extends BottomNavigationView and call this function in onLayout() override.

Add fix height to your bottom sheet and set bottom padding. Works for me.
android:layout_height="35dp"
android:paddingBottom="20dp"
android:clipToPadding="false"

you can use this property of bottom navigationview to hide the text and it will automatically centered your icons and i think ou do not use the minHeight property sir.
app:labelVisibilityMode="unlabeled"

Transparent background for custom AlertDialog

Strangely, this was working fine, this is how it looks on my app released on Google Play:
And this is how it looks now:
All I did was migrate to AndroidX.
Here is my dialog layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/dialogLinear"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="10dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:background="#drawable/rounded_corners">
<Button
android:id="#+id/btnAdd2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:text="#string/import_video"
android:textColor="#color/dark_text" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rounded_corners">
<Button
android:id="#+id/btnAdd1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:text="#string/add_student"
android:textColor="#color/dark_text" />
</FrameLayout>
</LinearLayout>
and here is how I inflate it:
View dialogView = View.inflate(getApplicationContext(), R.layout.dialog_main, null);
LinearLayout dialogLinear = dialogView.findViewById(R.id.dialogLinear);
//Here is where is set the background to transparent
dialogLinear.setBackgroundColor(0x00000000);
final AlertDialog alertD = new AlertDialog.Builder(this).create();
Button btnAdd1 = dialogView.findViewById(R.id.btnAdd1);
Button btnAdd2 = dialogView.findViewById(R.id.btnAdd2);
btnAdd1.setTypeface(mCustom_font_Bold);
btnAdd2.setTypeface(mCustom_font_Bold);
btnAdd1.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//Do stuff
}
});
btnAdd2.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//Do stuff
}
});
alertD.setView(dialogView);
if (alertD.getWindow() != null) {
alertD.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
}
alertD.show();
I searched and couldn't find why this would be happening. Can someone please give me some advise?
I have tried setting it in in the layout itself.
Edit 1:
After trying the answer below, it now looks like this, instead of above:
I resolved it by adding the following styles:
<style name="NewDialog">
<item name="android:windowIsFloating">true</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:background">#android:color/transparent</item>
</style>
Setting the style like this:
final AlertDialog alertD = new AlertDialog.Builder(this, R.style.NewDialog).create();
And to fix what happened in Edit 1, i changed my LinearLayout to a RelativeLayout

You Can Create a theme and assign that theme to your AlertDialog
Define theme in your styles.xml
<style name="CustomDialog" parent="android:Theme.Dialog">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
</style>
And Assign that theme to your AlertDialog
final AlertDialog alertD = new AlertDialog.Builder(this,R.style.CustomDialog).create();
Or
2.You should try and use Dialog instead of AlertDialog
As Explained in this Answer.

How to change the text color of SlidingTabLayout?

I made an application which use the ActionBarCompat
I created the tabs using the SlidingTabLayout class.
the class is this:
SlidingTabLayout.java
but I can not change the color of the tabs...
my viewpager fragment is this:
<swmovil.fyb.SlidingTabLayout
android:id="#+id/mTabs"
android:layout_width="match_parent"
android:layout_height="48dip" />
<android.support.v4.view.ViewPager
android:id="#+id/mPager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="#color/white" />
the application works great, but i can´t change the color text of the tabs...
I made the application after seeing the following example:
rudsonlive/Navigation-Drawer-ViewPager-ActionBarCompat
How can i change the text color of the tabs text ?
thanks !!!

1) First of all create color folder under res (/res/color)
2) create xml file selector.xml under /res/color folder
<?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/white" />
<item android:state_focused="true" android:color="#android:color/white" />
<item android:state_pressed="true" android:color="#android:color/white" />
<item android:color="#504f4f" />
</selector>
3) Then in the populateTabStrip() method in SlidingTabLayout put this
tabTitleView.setTextColor(getResources().getColorStateList(R.color.selector));
now you have a selector and you can change the color of the text on any event you want
if that is not working add the following lines of code.
a) in populateTabStrip() method at the end add this
if (i == mViewPager.getCurrentItem()) {
tabView.setSelected(true);
}
and b) change the onPageSelected() method to this
#Override
public void onPageSelected(int position) {
if (mScrollState == ViewPager.SCROLL_STATE_IDLE) {
mTabStrip.onViewPagerPageChanged(position, 0f);
scrollToTab(position, 0);
}
for (int i = 0; i < mTabStrip.getChildCount(); i++) {
mTabStrip.getChildAt(i).setSelected(position == i);
}
if (mViewPagerPageChangeListener != null) {
mViewPagerPageChangeListener.onPageSelected(position);
}
}

Open your file SlidingTabLayout.java (the default one from Google IO) and find the function populateTabStrip() , then after this code
mTabStrip.addView(tabView);
if (i == mViewPager.getCurrentItem()) {
tabView.setSelected(true);
}
add the following line:
int color = ContextCompat.getColor(tabView.getContext(), R.color.grey);
tabTitleView.setTextColor(color);
Replace R.color.grey with your preferred color.

You should be able to see the TextView the class is using.
tabTitleView.setTextColor(getResources().getColor(R.color.white));
In my class, the TextView was tabTitleView. If you are using the default example provided by Google, you will find it under populateTabStrip function.

copy code of slidingtablayout and slidingtabstrip and put it in a java file.then make a customtab_title.xml in your layout folder and a selector.xml file in your drawable folder.
`
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="10dp"
>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:textColor="#drawable/slidingtab_title_color"/>
</LinearLayout>
selector.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="#color/unpressed" />
<item android:state_focused="true" android:color="#color/unpressed" />
<item android:state_pressed="true" android:color="#color/unpressed" />
<item android:color="#android:color/black" />
</selector>
And in your mainactivity or where u r showing your tabs add one line of code - tabs.setCustomTabView(R.layout.customtab_title, R.id.textView2);
here tabs is slidingtablayout tabs;
to change indicator color add -
tabs.setSelectedIndicatorColors(getResources().getColor(R.color.unpressed));

#Override
public void onPageSelected(int position) {
for (int i = 0; i < mTabStrip.getChildCount(); i++) {
TextView tv = (TextView) mTabStrip.getChildAt(i);
if (i==position)
tv.setTextColor(getResources().getColorStateList(R.color.white));
else
tv.setTextColor(getResources().getColorStateList(R.color.tab_text_color));
}
this may be help you

Unfortunately this class doesn't support customizing the tab text color without editing the code and always uses the default text color of the theme. You'll have to patch the class to allow setting the tabs text color by code or by style attribute.
One alternative is to use the PagerSlidingTabStrip library.

Looking at the code for the SlidingTabLayout...You can set a custom tab view, which allows you to control the content of the tab and set a custom tab text color. Have a look at slidingTabLayout.setCustomTabView(int layoutResId, int textViewId).

I use Panayiotis Irakleous solution but I think it is better to avoid looping part in onPageSelected procedure.
The steps are the same, you need to add an int class member (example: mCurrentTabIndex) to save current tab index.
In steps 3.a, you need to add
mCurrentTabIndex = i;
So it will be like this:
if (i == mViewPager.getCurrentItem()) {
tabView.setSelected(true);
mCurrentTabIndex = i;
}
Last, in steps 3.b, replace the looping part to this:
mTabStrip.getChildAt(mCurrentTabIndex).setSelected(false);
mTabStrip.getChildAt(position).setSelected(true);
mCurrentTabIndex = position;
So the code will be like this:
#Override
public void onPageSelected(int position) {
if (mScrollState == ViewPager.SCROLL_STATE_IDLE) {
mTabStrip.onViewPagerPageChanged(position, 0f);
scrollToTab(position, 0);
}
mTabStrip.getChildAt(mCurrentTabIndex).setSelected(false);
mTabStrip.getChildAt(position).setSelected(true);
mCurrentTabIndex = position;
if (mViewPagerPageChangeListener != null) {
mViewPagerPageChangeListener.onPageSelected(position);
}
}

Android: customizing the look of Tabs using TabHost & TabWidget

I opend a post about this before but I feel that I can now (after reading some other posts) better explain what I want and rephrase it so it will be better understand.
I followed the tutorial about Tab Layout on the dev guide and I managed to create tabs with it, but I want to do some customization to it (and I did look on other posts, but either the code had many mistakes to it or it didn't answer what I'm looking for).
The first problem I have is that the test is in most part over the icon instead of below it (I used an icon with dimensions 48x48 as recommended on the dev guide). I want the tab with to act like wrap_content does.
I also want to change the text size (I think it's called the label).
I want to use hex triplets to change the background color of the tabs, to change it between to situations : when this tab is the one selected and when it's not.
I want to be able to change the color of the line that is below the tabs, I could not find any information on how to do this.
The code I'm currently using to create a new tab is (from the dev guide):
intent = new Intent().setClass(this, GroupsActivity.class);
spec = tabHost.newTabSpec("groups").setIndicator("groups",
res.getDrawable(R.drawable.ic_tab_groups))
.setContent(intent);
tabHost.addTab(spec);
(groups is the tab name).
Help is very much appreciated!

Rather than trying to customize the widget tabs themselves, here is an alternate approach that I've used successfully on a project that may save you some headaches:
The idea is to use a hidden TabWidget in your layout and control it with a customized LinearLayout containing Buttons. This way, you can more easily customize the buttons to look however you'd like. You'll control the actual TabWidget in your Activity within each button's OnClick.
Create your layout with both the TabWidget and the Buttons:
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:gravity="bottom">
<TabWidget android:id="#android:id/tabs"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:visibility="gone" />
<LinearLayout android:id="#+id/tabbar"
android:orientation="horizontal" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/firstButton"
android:layout_alignParentTop="true" android:background="#drawable/btn_first_on"
android:layout_width="100dp" android:layout_height="43dp"
android:clickable="true"></Button>
<Button android:id="#+id/secondButton"
android:layout_alignParentTop="true" android:background="#drawable/btn_second_off"
android:layout_height="43dp" android:layout_width="100dp"
android:clickable="true"></Button>
<Button android:id="#+id/thirdButton"
android:layout_alignParentTop="true" android:background="#drawable/btn_third_off"
android:layout_height="43dp" android:layout_width="100dp"
android:clickable="true"></Button>
<Button android:id="#+id/forthButton"
android:layout_alignParentTop="true" android:background="#drawable/btn_forth_off"
android:layout_height="43dp" android:layout_width="100dp"
android:clickable="true"></Button>
</LinearLayout>
<FrameLayout android:id="#android:id/tabcontent"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:layout_below="#+id/tabbar" />
</RelativeLayout>
</TabHost>
Set up the onCreate of your activity to handle using the buttons for adjusting the tab views:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// tabs
firstButton = (Button) findViewById(R.id.firstButton);
secondButton = (Button) findViewById(R.id.secondButton);
thirdButton = (Button) findViewById(R.id.thirdButton);
forthButton = (Button) findViewById(R.id.forthButton);
Resources res = getResources(); // Resource object to get Drawables
final TabHost tabHost = getTabHost(); // The activity TabHost
TabHost.TabSpec spec; // Resusable TabSpec for each tab
Intent intent; // Reusable Intent for each tab
intent = new Intent().setClass(this, FirstGroupActivity.class);
spec = tabHost.newTabSpec("first").setIndicator("First").setContent(intent);
tabHost.addTab(spec);
intent = new Intent().setClass(this, SecondGroupActivity.class);
spec = tabHost.newTabSpec("second").setIndicator("Second").setContent(intent);
tabHost.addTab(spec);
intent = new Intent().setClass(this, ThirdGroupActivity.class);
spec = tabHost.newTabSpec("third").setIndicator("Third").setContent(intent);
tabHost.addTab(spec);
intent = new Intent().setClass(this, ForthActivity.class);
spec = tabHost.newTabSpec("forth").setIndicator("Forth").setContent(intent);
tabHost.addTab(spec);
tabHost.setCurrentTab(0);
firstButton.setOnClickListener(new OnClickListener() {
public void onClick(View v)
{
tabHost.setCurrentTab(0);
firstButton.setBackgroundResource(R.drawable.btn_first_on);
secondButton.setBackgroundResource(R.drawable.btn_second_off);
thirdButton.setBackgroundResource(R.drawable.btn_third_off);
forthButton.setBackgroundResource(R.drawable.btn_forth_off);
}
});
secondButton.setOnClickListener(new OnClickListener() {
public void onClick(View v)
{
tabHost.setCurrentTab(1);
firstButton.setBackgroundResource(R.drawable.btn_first_off);
secondButton.setBackgroundResource(R.drawable.btn_second_on);
thirdButton.setBackgroundResource(R.drawable.btn_third_off);
forthButton.setBackgroundResource(R.drawable.btn_forth_off);
}
});
thirdButton.setOnClickListener(new OnClickListener() {
public void onClick(View v)
{
tabHost.setCurrentTab(3);
firstButton.setBackgroundResource(R.drawable.btn_first_off);
secondButton.setBackgroundResource(R.drawable.btn_second_off);
thirdButton.setBackgroundResource(R.drawable.btn_third_on);
forthButton.setBackgroundResource(R.drawable.btn_forth_off);
}
});
forthButton.setOnClickListener(new OnClickListener() {
public void onClick(View v)
{
tabHost.setCurrentTab(4);
firstButton.setBackgroundResource(R.drawable.btn_first_off);
secondButton.setBackgroundResource(R.drawable.btn_second_off);
thirdButton.setBackgroundResource(R.drawable.btn_third_off);
forthButton.setBackgroundResource(R.drawable.btn_forth_on);
}
});
}
As you can see, I'm using drawables for the images of the buttons on and off. Using this technique, you're not limited to the options available when simply just trying to customize the look of the TabWidget's tabs and you can create a completely custom look to your tabs.

1- Use a custom view:
spec = tabHost.newTabSpec("groups");
View view = LayoutInflater.from(this).inflate(R.layout.tabwidget_tabs, tabHost.getTabWidget(), false);
spec.setIndicator(view);
spec.setContent(intent);
instead of:
spec = tabHost.newTabSpec("groups").setIndicator("groups", res.getDrawable(R.drawable.ic_tab_groups)).setContent(intent);
tabHost.addTab(spec);
And then define the view for the tabs in the file tabwidget_tabs.xml (you can define an ImageView before the textView and the textsize):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tabsLayout"
android:layout_width="wrap_content"
android:layout_height="34dp"
android:background="#drawable/tabs_bkgrd"
android:padding="5dp"
android:orientation="vertical">
<TextView android:id="#+id/tabsText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:textStyle="bold"
android:gravity="center_horizontal"
android:textSize="14dp" />
</LinearLayout>
2- It's not possible to use hex triplets to change the background color of the tabs because are drawables not colors. However you can use a selector that changes the drawables. and you can combine this solution with setColorFilter() and android:tint and then you can select the background using hex triplets: How to tint a bitmap
tabs_bkgrd.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_shape" />
<item android:state_focused="false" android:state_selected="true"
android:state_pressed="false" android:drawable="#drawable/tab_selected_shape" />
<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false"
android:state_pressed="false" android:drawable="#drawable/tab_focused_shape" />
<item android:state_focused="true" android:state_selected="true"
android:state_pressed="false" android:drawable="#drawable/tab_focused_shape" />
<!-- Pressed -->
<item android:state_pressed="true" android:drawable="#drawable/tab_pressed_shape" />
</selector>
You can define a color or a shape, tab_selected_shape.xml:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#color/gold1"
android:centerColor="#color/gold2"
android:endColor="#color/gold2"
android:angle="#integer/vertical_shape" />
</shape>
3- The line is a drawable too. you can find the files in the sdk and copy them into your project after modify them to change the color using gimp. You can combine this solution with setColorFilter() and android:tint and then you can select the background using hex triplets too. Read:
further explanation
android-sdk-linux_x86/platforms/android-7/data/res/drawable
tab_bottom_left.xml,
tab_bottom_right.xml,
tab_indicator.xml (define state changes)
android-sdk-linux_x86/platforms/android-7/data/res/drawable-mdpi
tab_focus.9.png (change color)
tab_focus_bar_left.9.png
tab_focus_bar_right.9.png
tab_press.9.png (change color)
tab_press_bar_left.9.png
tab_press_bar_right.9.png
tab_selected.9.png (change color)
tab_selected_bar_left.9.png tab_selected_bar_right.9.png
tab_unselected.9.png

What about the solution I proposed on this question?
You can customize the drawable of each button using the same used by native Android Tab bar(looking for resources in Android.jar to find the right drawables), plus you can customize additional behavious as you desire.
At the end, you will obtain something that is graphically similar to a tabbar, from an user perspective, but acts differently from a developer perspective.

Android - Styling Spinner within TabView

I've got an app that uses tabs for navigation, and on one of those tabs there is a spinner. However, when the spinner is selected and the actual select window comes up, all the text is white on a white background.
I've tried styling the layout but nothing I do changes the color of the font.
the main class
public class RealmsOfWickedry extends TabActivity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tab);
TabHost tabHost = (TabHost)findViewById(android.R.id.tabhost);
TabSpec firstTabSpec = tabHost.newTabSpec("tid1");
TabSpec secondTabSpec = tabHost.newTabSpec("tid1");
firstTabSpec.setIndicator("Home").setContent(new Intent(this,FirstTab.class));
secondTabSpec.setIndicator("Catalog").setContent(new Intent(this,SecondTab.class));
tabHost.addTab(firstTabSpec);
tabHost.addTab(secondTabSpec);
}
public static View makeSpinner(Context context) {
View v = LayoutInflater.from(context).inflate(R.layout.spinner, null);
Spinner spinner = (Spinner) v.findViewById(R.id.spinner);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(context, android.R.layout.simple_spinner_dropdown_item);
adapter.add("Item 1");
adapter.add("Item 2");
adapter.add("Item 3");
adapter.add("Item 4");
spinner.setAdapter(adapter);
return v;
}
}
the class with the spinner
public class SecondTab extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
/* Second Tab Content */
TextView textView = new TextView(this);
textView.setText("Choose a Category");
setContentView(textView);
setContentView(RealmsOfWickedry.makeSpinner(getParent()));
}
}
tab.xml
<?xml version="1.0" encoding="utf-8"?>
<TabHost android:layout_width="fill_parent"
android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost">
<LinearLayout android:id="#+id/LinearLayout01"
android:orientation="vertical" android:layout_height="fill_parent"
android:layout_width="fill_parent">
<TabWidget android:id="#android:id/tabs"
android:layout_height="wrap_content" android:layout_width="fill_parent"></TabWidget>
<FrameLayout android:id="#android:id/tabcontent"
android:layout_height="fill_parent" android:layout_width="fill_parent"></FrameLayout>
</LinearLayout>
</TabHost>
spinner.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Spinner
android:id="#+id/spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:prompt="#string/cat_prompt"
android:theme="#style/DropdownStyle"
/>
</LinearLayout>
themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="OverallStyle" parent="#android:Theme.Light">
<item name="android:windowBackground">#drawable/bg</item>
<item name="android:textColor">#color/white</item>
</style>
<style name="WelcomeStyle" parent="#android:Theme.Light">
<item name="android:typeface">monospace</item>
<item name="android:gravity">center</item>
</style>
<style name="CustomStyle" parent="#android:Theme.Light">
<item name="android:typeface">monospace</item>
<item name="android:gravity">top</item>
</style>
<style name="DropdownStyle" parent="#android:Theme.Light">
<item name="android:textColor">#color/red</item>
</style>
</resources>
Can anyone help me out with this?

It looks like you're trying to override the system theme to show a different color which is the right path to be on. Your spinner xml contains a reference to android:theme I haven't see that one before and it doesn't appear to be part of the API for this widget. To get your DropdownStyle to work, first, add it as part of your OverallStyle style with an item name of #android:attr/spinnerDropDownItemStyle. Second, change DropdownStyle's parent to #android:Widget.DropDownItem.Spinner. I'm assuming that OverallStyle is applied to the Activity or Application in the Manifest already. This will change the style for all Spinner drop down Items.
To apply only to this view's drop down items do only step two above then add style="#style/OverallStyle" to the spinner in its layout.
Additional Information:
<style name="DropdownStyle" parent="#android:Widget.DropDownItem.Spinner">
<item name="android:textColor">#color/red</item>
</style>
<style name="OverallStyle" parent="#android:Theme.Light">
<item name="android:windowBackground">#drawable/bg</item>
<item name="#android:attr/spinnerDropDownItemStyle">#style/DropdownStyle</item>
<item name="android:textColor">#color/white</item>
</style>
-OR-
themes.xml
<style name="DropdownStyle" parent="#android:Widget.DropDownItem.Spinner">
<item name="android:textColor">#color/red</item>
</style>
spinner.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Spinner
android:id="#+id/spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:prompt="#string/cat_prompt"
style="#style/DropdownStyle"
/>
</LinearLayout>