how can I change the text color of the ActionBar? I've inherited the Holo Light Theme, I'm able to change the background of the ActionBar but I don't find out what is the attribute to tweak to change the text color.
Ok, I'm able to change the text color with the attribute android:textColorPrimary but it also changes the text color of the dropdown menu displayed when an overflow happen on the ActionBar buttons. Any idea how to change the color of those dropdown menu / List ?
Ok, I've found a better way. I'm now able to only change the color of the title. You can also tweak the subtitle.
Here is my styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MyTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyTheme.ActionBarStyle</item>
</style>
<style name="MyTheme.ActionBarStyle" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
</style>
<style name="MyTheme.ActionBar.TitleTextStyle" parent="#android:style/TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:textColor">#color/red</item>
</style>
</resources>
I found a way that works well with any flavor of ActionBar (Sherlock, Compat, and Native):
Just use html to set the title, and specify the text color. For example, to set the ActionBar text color to red, simply do this:
getActionBar()/* or getSupportActionBar() */.setTitle(Html.fromHtml("<font color=\"red\">" + getString(R.string.app_name) + "</font>"));
You can also use the red hex code #FF0000 instead of the word red. If you are having trouble with this, see Android Html.fromHtml(String) doesn't work for <font color='#'>text</font>.
Additionally, if you want to use a color resource, this code can be used to get the correct HEX String, and removing the alpha if needed (the font tag does not support alpha):
int orange = getResources().getColor(R.color.orange);
String htmlColor = String.format(Locale.US, "#%06X", (0xFFFFFF & Color.argb(0, Color.red(orange), Color.green(orange), Color.blue(orange))));
I was having the same problem as you, it's a Holo.Light theme but I wanted to style the ActionBar color, so I needed to change the text color as well and also both Title and Menus. So at the end I went to git hub and looked at source code until I find the damn correct style:
<?xml version="1.0" encoding="utf-8"?>
<!-- For honeycomb and up -->
<resources>
<style name="myTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/myTheme.ActionBar</item>
<item name="android:actionMenuTextColor">#color/actionBarText</item>
</style>
<style name="myTheme.ActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#drawable/actionbarbground</item>
<item name="android:titleTextStyle">#style/myTheme.ActionBar.Text</item>
</style>
<style name="myTheme.ActionBar.Text" parent="#android:style/TextAppearance">
<item name="android:textColor">#color/actionBarText</item>
</style>
</resources>
so now all you have to do is set whatever #color/actionBarText and#drawable/actionbarbground you want!
The ActionBar ID is not available directly, so you have to do little bit of hacking here.
int actionBarTitleId = Resources.getSystem().getIdentifier("action_bar_title", "id", "android");
if (actionBarTitleId > 0) {
TextView title = (TextView) findViewById(actionBarTitleId);
if (title != null) {
title.setTextColor(Color.RED);
}
}
It's an old topic but for future readers, using ToolBar makes everything very easy:
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
toolbar.setTitle(R.string.app_name);
toolbar.setTitleTextColor(getResources().getColor(R.color.someColor));
setSupportActionBar(toolbar);
The most straight-forward way is to do this in the styles.xml.
Google's template styles.xml currently generates the following:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
If you add one more line before the closing tag, as shown, that will change the text color to what it should be with a Dark ActionBar:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionBarTheme">#style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>
If you want to customize the color to something else, you can either specify your own color in colors.xml or even use a built-in color from Android using the android:textColorPrimary attribute:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionBarTheme">#style/AppTheme.AppBarOverlay</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#android:color/darker_gray</item>
</style>
Note: This changes the color of the title and also the titles of any MenuItems displayed in the ActionBar.
i have done with simple one line code
actionBar.setTitle(Html.fromHtml("<font color='#ff0000'>ActionBartitle </font>"));
Add it to the root of the action bar. I had this problem.
<style name="ActionBar" parent="#style/Theme.AppCompat.Light">
<item name="actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="actionMenuTextColor">#color/stdDarkBlueText</item>
</style>
<style name="Widget.Styled.ActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="titleTextStyle">#style/ActionBarTitleText</item>
<item name="subtitleTextStyle">#style/ActionBarSubTitleText</item>
</style>
<style name="ActionBarTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/stdDarkBlueText</item>
<item name="android:textSize">12sp</item>
</style>
<style name="ActionBarSubTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
<item name="android:textColor">#color/stdDarkBlueText</item>
<item name="android:textSize">12sp</item>
</style>
actionMenuTextColor - changes text color for the action bar text, it never worked when it was part of the Widget.Styled.ActionBar, so I had to add it to the root. Other 2 attributes change title and subtitle of an action bar.
Setting a HTML string on the action bar doesn't work on the Material theme in SDK v21+
If you want to change it you should set the primary text color in your style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Material.Light">
<!-- Customize your theme here. -->
<item name="android:textColorPrimary">#color/actionbar-text-color</item>
</style>
</resources>
If you want to style the subtitle also then simply add this in your custom style.
<item name="android:subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
People who are looking to get the same result for AppCompat library then this is what I used:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CustomActivityTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
<!-- other activity and action bar styles here -->
</style>
<!-- style for the action bar backgrounds -->
<style name="MyActionBar" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:background">#drawable/actionbar_background</item>
<item name="background">#drawable/actionbar_background</item>
<item name="android:titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="android:subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
</style>
<style name="MyTheme.ActionBar.TitleTextStyle" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/color_title</item>
</style>
</resources>
A lot of answers are deprecated so I'll update the thread and show how to change text color and backgroundcolor on ActionBar (Toolbar) and in ActionBar pop up menu.
The latest approach in Android (as of May 2018) in working with Action bar (Toolbar) is to use Theme with NoActionBar and use Toolbar instead.
so here is what you need:
In Activity (which extends AppCompatActivity) declare Toolbar:
Toolbar myToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(myToolbar);
Add Toolbar in the Activity's layout xml. Here we will set our custom (overwritten themes), note android:theme="#style/ThemeOverlay.AppTheme.ActionBar" and app:popupTheme="#style/ThemeOverlay.AppTheme.PopupMenu", they will do the trick.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppTheme.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppTheme.PopupMenu"
app:layout_constraintTop_toTopOf="parent" />
In your styles.xml you will have to overwrite those two styles to set custom colors:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionBarTheme">#style/ThemeOverlay.AppTheme.ActionBar</item>
<item name="actionBarPopupTheme">#style/ThemeOverlay.AppTheme.PopupMenu</item>
</style>
<style name="ThemeOverlay.AppTheme.ActionBar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#color/action_bar_text_color</item>
<item name="android:background">#color/action_bar_bg_color</item>
</style>
<style name="ThemeOverlay.AppTheme.PopupMenu" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:background">#color/popup_bg_color</item>
<item name="android:textColorPrimary">#color/popup_text_color</item>
</style>
That's it folks
p.s. if you ask me I would say: YES, this whole Theme thing is a hell of a mess.
Found the way to do it nicely without creating your own layout on API >= 21.
It will only colorize texts and control drawables inside the action bar.
Hope it will be useful for someone.
<!--Material design primary colors-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
<item name="android:navigationBarColor">#color/primary_dark</item>
<item name="actionBarTheme">#style/AppBaseTheme.Toolbar</item>
</style>
<!--Action bar-->
<style name="AppBaseTheme.Toolbar" parent="Widget.AppCompat.ActionBar.Solid">
<item name="android:textColorPrimary">#color/action_bar_text</item>
<item name="colorControlNormal">#color/action_bar_text</item>
</style>
These functions work well
In Java
private void setActionbarTextColor(ActionBar actBar, int color) {
String title = actBar.getTitle().toString();
Spannable spannablerTitle = new SpannableString(title);
spannablerTitle.setSpan(new ForegroundColorSpan(color), 0, spannablerTitle.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
actBar.setTitle(spannablerTitle);
}
then to use it just feed it your action bar and the new color i.e.
ActionBar actionBar = getActionBar(); // Or getSupportActionBar() if using appCompat
int red = Color.RED
setActionbarTextColor(actionBar, red);
In Kotlin
You can use an extension function like this:
private fun ActionBar.setTitleColor(color: Int) {
val text = SpannableString(title ?: "")
text.setSpan(ForegroundColorSpan(color),0,text.length, Spannable.SPAN_INCLUSIVE_INCLUSIVE)
title = text
}
And then apply to your ActionBar with
actionBar?.setTitleColor(Color.RED)
This is the solution I used after checking all answers
<!-- Base application theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorAccent">#color/Button_color</item>
<item name="android:editTextStyle">#style/EditTextStyle</item>
<item name="android:typeface">monospace</item>
<item name="android:windowActionBar">true</item>
<item name="colorPrimary">#color/Title_Bar_Color</item>
<item name="android:actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="actionBarStyle">#style/Widget.Styled.ActionBar</item>
</style>
<style name="EditTextStyle" parent="Widget.AppCompat.EditText"/>
<style name="Widget.Styled.ActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="titleTextStyle">#style/ActionBarTitleText</item>
<item name="android:background">#color/Title_Bar_Color</item>
<item name="background">#color/Title_Bar_Color</item>
<item name="subtitleTextStyle">#style/ActionBarSubTitleText</item>
</style>
<style name="ActionBarTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/solid_white</item>
<item name="android:textSize">12sp</item>
</style>
<style name="ActionBarSubTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
<item name="android:textColor">#color/solid_white</item>
<item name="android:textSize">12sp</item>
</style>
Change the required colors it will work
Try adding this in your Activity's onCreate. Works on almost every Android version.
actionBar.setTitle(Html.fromHtml("<font color='#ffff00'>Your Title</font>"));
or
getSupportActionBar().setTitle(Html.fromHtml("<font color='#ffff00'>Your Title</font>"));
just put this in your thme style.
<item name="android:textColorPrimary">#color/yourcolor</item>
Try a lot of methods, in the low version of the API,a feasible method is <item name="actionMenuTextColor">#color/your_color</item> and don't use the Android namespace,hope can help you
ps:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionMenuTextColor">#color/actionMenuTextColor</item>
</style>
The most simple way is :
Add these two lines to your styles.xml file
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
...
<item name="android:textColorSecondary">#color/white</item>
<item name="android:textColor">#color/white</item>
</style>
Replace the color with your color.
Here Style.xml is like
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionBarTheme">#style/MyTheme</item>
</style>
<style name="MyTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/AppTheme.ActionBarStyle</item>
</style>
<style name="AppTheme.ActionBarStyle" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:titleTextStyle">#style/AppTheme.ActionBar.TitleTextStyle</item>
</style>
<style name="AppTheme.ActionBar.TitleTextStyle" parent="#android:style/TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:textColor">#color/colorBlack</item>
</style>
You should add
<item name="actionBarTheme">#style/MyTheme</item>
in AppTheme
A nice solution is to user a SpannableStringBuilder and set the color that way. You can even use different colors on different parts of the string, add images etc.
Tested with the new support library.
See Android: Coloring part of a string using TextView.setText()?
This is not the recommended solution as I am going in android apis here but as my application requires to change the theme dynmically on conditions xml not possible here, So I need to do this. But This solution is working very nice.
Solution:--
/**
*
* #author Kailash Dabhi
* #email kailash09dabhi#gmail.com
*
*/
public static void setActionbarTextColor(Activity activity, int color) {
Field mActionViewField;
try {
mActionViewField = activity.getActionBar().getClass()
.getDeclaredField("mActionView");
mActionViewField.setAccessible(true);
Object mActionViewObj = mActionViewField.get(activity
.getActionBar());
Field mTitleViewField = mActionViewObj.getClass().getDeclaredField(
"mTitleView");
mTitleViewField.setAccessible(true);
Object mTitleViewObj = mTitleViewField.get(mActionViewObj);
TextView mActionBarTitle = (TextView) mTitleViewObj;
mActionBarTitle.setTextColor(color);
// Log.i("field", mActionViewObj.getClass().getName());
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (IllegalArgumentException e) {
e.printStackTrace();
}
}
For Android 5 (lollipop) you will have to use android:actionBarPopupTheme to set the textColor for the overflow menu.
you can change color of any text by use html <font> attribute directly in xml files.
for example in strings.xml :
<resources>
<string name = "app_name">
<html><font color="#001aff">Multi</font></html>
<html><font color="#ff0044">color</font></html>
<html><font color="#e9c309">Text </font></html>
</string>
</resources>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/color_primary"
android:theme="#style/GalaxyZooThemeToolbarDarkOverflow"
app:popupTheme="#style/Theme.AppCompat.NoActionBar" />
<style name="GalaxyZooThemeToolbarDarkOverflow" parent="Theme.AppCompat.NoActionBar">
<!-- android:textColorPrimary is the color of the title text
in the Toolbar, in the Theme.AppCompat theme: -->
<item name="android:textColorPrimary">#color/abc_primary_text_material_light</item>
<!-- android:textColorPrimaryInverse is the color of the title
text in the Toolbar, in the Theme.AppCompat.Light theme: -->
<!-- <item name="android:textColorPrimaryInverse">#color/abc_primary_text_material_light</item> -->
<!-- android:actionMenuTextColor is the color of the text of
action (menu) items in the Toolbar, at least in the
Theme.AppCompat theme.
For some reason, they already get the textColorPrimary
when running on API 21, but not on older versions of
Android, so this is only necessary to support older
Android versions.-->
<item name="actionMenuTextColor">#color/abc_primary_text_material_light</item>
<!-- android:textColorSecondary is the color of the menu
overflow icon (three vertical dots) -->
<item name="android:textColorSecondary">#color/abc_secondary_text_material_light</item>
<!-- This would set the toolbar's background color,
but setting this also changes the popup menu's background,
even if we define popupTheme for our <Toolbar> -->
<!-- <item name="android:background">#color/color_primary</item> -->
</style>
**Reference:**
[https://www.murrayc.com/permalink/2014/10/28/android-changing-the-toolbars-text-color-and-overflow-icon-color/][1]
If you need to set the color programmatically this is the way to do it:
static void setActionBarTextColor(Activity activity, int color)
{
ActionBar actionBar = activity instanceof AppCompatActivity
? ((AppCompatActivity) activity).getSupportActionBar()
: activity.getActionBar();
String title = activity.getTitle(); // or any title you want
SpannableString ss = new SpannableString(title);
ss.setSpan(new ForegroundColorSpan(color), 0, title.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
actionBar.setTitle(ss);
}
In my case, I switched to AndroidX Toolbar instead of using the native action bar. Also, I rely on view binding to access the toolbar from the activity, but you can use findViewById(...) for that.
(I removed the code which is irrelevant).
styles.xml:
...
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
...
</style>
...
activity_main.xml:
...
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbarMain"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:titleTextColor="#color/colorOnPrimary"
...
/>
...
MainActivity.kt:
class MainActivity : AppCompatActivity() {
private lateinit var binding: ActivityMainBinding
...
override fun onCreate(savedInstanceState: Bundle?) {
...
binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
setSupportActionBar(binding.toolbarMain)
...
}
...
}
We need to define the theme in our toolbar with app:theme attribute like the below code snippet.
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:theme="#style/AppTheme.ToolbarFont" />
Before that, we have to add the theme in our styles.xml file and we have to define font-family in that style like the below code snippet.
<style name="AppTheme.ToolbarFont" parent="AppTheme">
<!--This line changes the color of text in Toolbar-->
<item name="android:textColorPrimary">#color/black</item>
<!--This line changes the color of icons in toolbar (back, overflow menu icons)-->
<item name="android:textColorSecondary">#color/azul</item>
<item name="textAllCaps">false</item>
<item name="android:textSize">16sp</item>
<item name="android:fontFamily">#font/montserrat_semi_bold</item>
To add custom fonts we need to create a folder with the name “font” in the res directory like the below screenshot.
We have achieved a custom font in our toolbar.
If you are using a custom action bar you can use these properties:
app:titleTextColor="#color/...."
app:subtitleTextColor="#color/...."
or by a method like this:
setTitleTextColor()
for more properties check this link
Related
I'm trying to apply a custom style to the material theme action bar. Nothing fancy, just a simple change of title text colour, however I can't get the colour to change at all. I've set up a theme an app theme as follows in the themes xml:
<resources>
<style name="AppTheme" parent="Base.AppTheme">
<item name="android:navigationBarColor">?android:attr/colorPrimaryDark</item>
<item name="actionBarStyle">#style/AppBarLayout</item>
</style>
<style name="Base.AppTheme" parent="Theme.MaterialComponents.DayNight">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryVariant">#color/colorPrimaryDark</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorSecondary">#color/colorSecondary</item>
<item name="colorSecondaryVariant">#color/colorSecondaryDark</item>
<item name="colorOnPrimary">#color/colorTextLight</item>
<item name="colorOnSecondary">#color/colorTextDark</item>
<item name="colorError">#color/colorError</item>
</style>
</resources>
The action bar style which is referenced is defined in the styles xml as:
<style name="AppBarLayout" parent="Widget.AppCompat.ActionBar">
<item name="background">?attr/colorPrimaryDark</item>
<item name="titleTextStyle">#style/AppBarText</item>
</style>
The style which titleTextStyle references is also defined in styles xml as:
<style name="AppBarText" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColor">#color/colorError</item>
</style>
I've tried other attributes in the latter style, such as:
<item name="android:titleTextStyle">#color/colorError</item>
<item name="titleTextStyle">#color/colorError</item>
<item name="colorOnPrimary">#color/colorError</item>
<item name="android:textColorPrimary">#color/colorError</item>
I've also tried applying the AppBarText style with other attributes to titleTextStyle, such as android:textAppearance. Alas - no luck.
How can I get this to change? Perhaps I'm misunderstanding how Material components work?
I am not sure if this will work but try this code once:
int labelColor = getResources().getColor(R.color.label_color);
String сolorString = String.format("%X", labelColor).substring(2); // !!strip alpha value!!
Html.fromHtml(String.format("<font color=\"#%s\">text</font>", сolorString), TextView.BufferType.SPANNABLE);
getSupportActionBar().setTitle(colorString);
I use Lg Q6. Version 7.1.1. Navigation bar color not change with code below. I try to change dynamically and using theme but nothing is change. I dont understand Where Im do something wrong ?
First try programatically
if (android.os.Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
getWindow().setNavigationBarColor(getResources().getColor(R.color.your_awesome_color));
}
Then try style.xml
Manifest.xml
<application
android:theme="#style/AppTheme">
style.xml
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowNoTitle">true</item>
<item name="android:windowLightStatusBar">true</item>
<item name="android:navigationBarColor">#color/black</item>
</style>
Every time you want to change the color of a comment or item in the entire app, it's best to put a special style into it and introduce it to the original style of the program.
For Example : if you want change background of bottom Navigation Bar you can add under lines in style.xml v21 :
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:navigationBarColor">#color/colorAccent</item>
</style>
but if you want change background color of toolbar , you should define an style for it , for example :
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
.
.
.
<item name="toolbarStyle">#style/MyStyle</item>
</style>
<style name="MyStyle" parent="Theme.AppCompat.Light">
<item name="android:background">#024dfc</item>
</style>
you can use this way for define night and day theme for your app .
I hope you enjoyed .
How can I remove line or divider between action bar and main screen?
How can I change the color of this divider in android?
Thanks in advance.
Simply insert the attribute windowContentOverlay to your theme. It's way too simple this way.
<style name="AppTheme" parent="android:Theme.Holo.Light">
<!-- Customize your theme here. -->
<item name="android:windowContentOverlay">#null</item>
</style>
After more effort I can find my ideal Theme.
First of all i must say that Theme.Holo.Light has a shadow in bottom of action bar if you want to have not that shadow you must use Theme.Holo.
After you change the style you must change other settings for yourself like the code.
<resources>
<style name="AppTheme" parent="android:Theme.Holo">
<item name="android:actionBarStyle">#style/AppTheme.ActionBar</item>
<item name="android:background">#ff0000</item>
<item name="android:colorBackground">#ff0000</item>
</style>
<style name="AppTheme.ActionBar" parent="android:Widget.ActionBar">
<item name="android:background">#ff0000</item>
</style>
</resources>
This below code is for my last challange that I found how to resolve it.
<resources>
<style name="AppTheme" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">#style/AppTheme.ActionBar</item>
<item name="android:background">#ff0000</item>
<item name="android:colorBackground">#ff0000</item>
</style>
<style name="AppTheme.ActionBar" parent="android:Widget.ActionBar">
<item name="android:background">#ff0000</item>
</style>
</resources>
Below Image is for first Code, If you notice there isn't any divider.
And below Image is for second Code.
None of these solutions worked for me. I ended up adding this code to the onCreate() event of my MainActivity:
actionBar = getSupportActionBar();
actionBar.setElevation(0);
On Kotlin, you can use supportActionBar?.elevation = 0f to remove the shadow of the ActionBar.
Add this code to the onCreate() function of the desired activity. For example:
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// Hide ActionBar shadow
supportActionBar?.elevation = 0f
}
The ?. operator controls Null Pointer Exception if you have no ActionBar on this Activity.
Note: If you are not using AppCompat, call actionBar?.elevation = 0f instead.
If you use AppCompat you need set parent="Theme.AppCompat", not "Theme.AppCompat.Light" (the same stands for ActionBar) :)
For example:
#style/MyActionBar
true
#style/MyActionBar
true
<style name="MyActionBar" parent="Base.Widget.AppCompat.ActionBar">
<item name="android:background">#android:color/transparent</item>
<!--For compatibility-->
<item name="background">#android:color/transparent</item>
</style>
This worked for me:
I just added the following line of code to the onCreate() method
getSupportActionBar().setElevation(0);
In your styles.xml file , look for your AppTheme style and add the following style into it
<item name="android:actionBarDivider">#android:color/transparent</item>
like this
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:fontFamily">#font/roboto</item>
<item name="android:actionBarDivider">#android:color/transparent</item>
</style>
what it actually does is that it sets the background of the divider between activity window and action bar as transparent.
In case you are using AppBarLayout nothing of that will help. I found the solution using :
AppBarLayout appBarLayout = findViewById(R.id.app_bar_layout);
appBarLayout.setOutlineProvider(null);
I tried change color of my actionBar divider , but nothing work. I' using android support library v7 for support old devices and custom style, and i also change all action bar drawable, but nothing happend!
<resources>
<style name="MyTheme" parent="Theme.AppCompat">
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent = "Widget.AppCompat.ActionBar">
<item name="background">#drawable/my_action_bar</item>
</style>
</resources>
And my ide show me strange error in layout , why did i get this error? it's not color value
java.lang.NumberFormatException: Color value '#drawable/abs__ab_transparent_dark_holo' must start with #
Solution: Need to add android namespace if use for api level >= 14 .May be it will be helpful to someone.
It is because the "divider" is an image. It's hardcoded in the Holo theme assets.
Look at platforms/android-19/data/res/drawable-xxhdpi/ab_transparent_dark_holo.9.png
The style is declared here for holo dark.
<style name="Widget.Holo.ActionBar" parent="Widget.ActionBar">
...
<item name="android:background">#android:drawable/ab_transparent_dark_holo</item>
...
</style>
It's a background. You will need to change the color in the image and replace the background of your bar.
It also needs different sizes for different resolutions.
Maybe you should set color directly, change your theme as
<item name="android:divider">#color/dividercolor</item>
Then you should add color dividercolor in you /value/color file,like
<item name="dividercolor"> #0099CC </item>
I hope this will be helpful to you
<style name="CustomTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyTheme.ActionBarStyle</item>
<item name="android:actionBarDivider">#drawable/action_vertical_doted</item>
<item name="android:actionButtonStyle">#style/MyTheme.ActionBar.ActionButton</item>
<item name="android:actionMenuTextColor">#ffffff</item>
<!-- <item name="android:actionMenuTextAppearance">#style/MyTheme.Menu.FontStyle</item> -->
<!-- <item name="android:actionBarSize">50dp</item> -->
</style>
<style name="MyTheme.ActionBarStyle" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="android:background">#drawable/actionbar_bg_shap</item>
<item name="android:displayOptions">none</item>
<item name="android:backgroundSplit">#drawable/actionbar_bg_shap</item>
</style>
<style name="MyTheme.ActionBar.ActionButton" parent="#android:style/Widget.Holo.Light.ActionButton">
<item name="android:background">#drawable/main_button_inactive_tr</item>
</style>
I am using Android Navigation bar in my project,
I want to change the top color in action bar to something red, How can i do that?
I have something like this,
and i want something like this,
how can i achieve that?
You can define the color of the ActionBar (and other stuff) by creating a custom Style:
Simply edit the res/values/styles.xml file of your Android project.
For example like this:
<resources>
<style name="MyCustomTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyActionBarTheme</item>
</style>
<style name="MyActionBarTheme" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">ANY_HEX_COLOR_CODE</item>
</style>
</resources>
Then set "MyCustomTheme" as the Theme of your Activity that contains the ActionBar.
You can also set a color for the ActionBar like this:
ActionBar actionBar = getActionBar();
actionBar.setBackgroundDrawable(new ColorDrawable(Color.RED)); // set your desired color
Taken from here: How do I change the background color of the ActionBar of an ActionBarActivity using XML?
In general Android OS leverages a “theme” to allow app developers to globally apply a universal set of UI element styling parameters to Android applications as a whole, or, alternatively, to a single Activity subclass.
So there are three mainstream Android OS “system themes,” which you can specify in your Android Manifest XML file when you are developing apps for Version 3.0 and later versions
I am referring the (APPCOMPAT)support library here:--
So the three themes are
1. AppCompat Light Theme (Theme.AppCompat.Light)
AppCompat Dark Theme(Theme.AppCompat),
And a hybrid between these two ,AppCompat Light Theme with the Darker ActionBar.( Theme.AppCompat.Light.DarkActionBar)
AndroidManifest.xml and see the tag, the android theme is mentioned as:-- android:theme="#style/AppTheme"
Open the Styles.xml and we have base application theme declared there:--
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
</style>
We need to override these parent theme elements to style the action bar.
ActionBar with different color background:--
To do this we need to create a new style MyActionBar(you can give any name) with a parent reference to #style/Widget.AppCompat.Light.ActionBar.Solid.Inverse that holds the style characteristics for the Android ActionBar UI element. So definition would be
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="background">#color/red</item>
</style>
And this definition we need to reference in our AppTheme, pointing to overridden ActionBar styling as--
#style/MyActionBar
Change the title bar text color (e.g black to white):--
Now to change the title text color, we need to override the parent reference parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
So the style definition would be
<style name="MyActionBarTitle" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/white</item>
</style>
We’ll reference this style definition inside the MyActionBar style definition, since the TitleTextStyle modification is a child element of an ActionBar parent OS UI element. So the final definition of MyActionBar style element will be
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="background">#color/red</item>
<item name="titleTextStyle">#style/MyActionBarTitle</item>
</style>
SO this is the final Styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- This is the styling for action bar -->
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="background">#color/red</item>
<item name="titleTextStyle">#style/MyActionBarTitle</item>
</style>
<style name="MyActionBarTitle" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/white</item>
</style>
</resources>
For further ActionBar options Menu styling, refer this link
For Android 3.0 and higher only
When supporting Android 3.0 and higher only, you can define the action bar's background like this:
res/values/themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme" parent="#style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar" parent="#style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#ff0000</item>
</style>
</resources>
For Android 2.1 and higher
When using the Support Library, your style XML file might look like this:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#drawable/actionbar_background</item>
<!-- Support library compatibility -->
<item name="background">#drawable/actionbar_background</item>
</style>
</resources>
Then apply your theme to your entire app or individual activities:
for more details Documentaion
You can change action bar color on this way:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/green_action_bar</item>
</style>
Thats all you need for changing action bar color.
Plus if you want to change the status bar color just add the line:
<item name="android:colorPrimaryDark">#color/green_dark_action_bar</item>
Here is a screenshot taken from developer android site to make it more clear, and here is a link to read more about customizing the color palete
Another possibility of making.
actionBar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#0000ff")));
I can change ActionBar text color by using titleTextColor
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="titleTextColor">#333333</item>
</style>
Custom Color:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/ColorPrimary</item>
<item name="colorPrimaryDark">#color/ColorPrimaryDark</item>
<!-- Customize your theme here. -->
</style>
Custom Style:
<style name="Theme.AndroidDevelopers" parent="android:style/Theme.Holo.Light">
<item name="android:selectableItemBackground">#drawable/ad_selectable_background</item>
<item name="android:popupMenuStyle">#style/MyPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
<item name="android:listChoiceIndicatorMultiple">#drawable/ad_btn_check_holo_light</item>
<item name="android:listChoiceIndicatorSingle">#drawable/ad_btn_radio_holo_light</item>
</style>
For More: Android ActionBar
As I was using AppCompatActivity above answers didn't worked for me. But the below solution worked:
In res/styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
</style>
PS: I've used colorPrimary instead of android:colorPrimary
in the style.xml add this code
<resources>
<style name="MyTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyAction</item>
</style>
<style name="MyActionBarTheme" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#333333</item>
</style>
</resources>
Use this - http://jgilfelt.github.io/android-actionbarstylegenerator/
Good tool to customize your actionbar with a live preview in couple of minutes.