Unable to customize ActionBar Tabs for API-23 - android

I'm working on a application in which I am having Tab Bars. I am assigning a custom theme to my tabs using styles.xml present in values-v23 folder. But the thing is that I am not able to achieve my custom theme every time I'm launching the application. I can't understand where is the problem. I am sharing my style.xml file here to make you understand this better.
styles.xml
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<style name="AppThemeWhite" parent="AppBaseTheme">
<item name="android:windowIsTranslucent">false</item>
<item name="android:windowBackground">#color/white</item>
<item name="android:textColor">#color/black</item>
<item name="android:editTextStyle">#style/BlackEditText</item>
<item name="android:actionBarTabTextStyle">#style/CustomActionBarTabs_TextColor</item>
<item name="android:actionBarTabStyle">#style/CustomActionBarTabs</item>
<item name="android:actionBarTabBarStyle">#style/CustomActionBarTabBar</item>
</style>
<!-- action bar tab styles -->
<style name="CustomActionBarTabs_TextColor" parent="#style/Widget.AppCompat.ActionBar.TabText">
<item name="android:textColor">#666666</item>
<item name="android:textSize">14sp</item>
<item name="android:typeface">sans</item>
</style>
Here I'm trying to change the text color of Tab titles by using the #style/CustomActionBarTabs_TextColor property but nothing is happening. Can someone please help to solve this one.
Any help would be appreciable.
Thanks.

you can apply following style to your tab layout
<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">#color/indicatorcolor</item>
<item name="tabIndicatorHeight">4dp</item>
<item name="tabTextAppearance">#style/MyCustomTabTextAppearance</item>
<item name="tabSelectedTextColor">#color/seltextcolor</item>
</style>
<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textSize">14sp</item>
<item name="android:textColor">#000000</item>
<item name="textAllCaps">true</item>
</style>

Related

Android's Material Design of Toolbar / SupportActionBar

I'm experimenting with the news themes tonight and I'm wondering if anyone knows these fix to this issue.
This appears on the stock Toolbar and even, as seen below, when referring to custom layout file.
It's relatively minor but my OCD eyes go right to it so maybe someone can help. Thanks :)
UPDATE: Inheriting from the correct theme and declaring attributes in pairs (with and without the android: prefix) was the fix!
<!-- Base app theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles. -->
<style name="MyActionBar" parent="Widget.AppCompat.ActionBar">
<item name="android:titleTextStyle">#style/MyActionBarTitleText</item>
<item name="titleTextStyle">#style/MyActionBarTitleText</item>
<item name="android:subtitleTextStyle">#style/MyActionBarSubTitleText</item>
<item name="subtitleTextStyle">#style/MyActionBarSubTitleText</item>
<item name="android:background">#color/blue</item>
<item name="background">#color/blue</item>
</style>
<style name="MyActionBarTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/white</item>
</style>
<style name="MyActionBarSubTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
<item name="android:textColor">#color/white</item>
<item name="android:textSize">#dimen/subtitle</item>
</style>
If es0329's answer doesn't work for you, try to replace titleTextStyle by titleTextAppearance. It is working for me:
<style name="MyActionBar" parent="Widget.AppCompat.ActionBar">
<item name="android:titleTextAppearance">#style/MyActionBarTitleText</item>
<item name="titleTextAppearance">#style/MyActionBarTitleText</item>
<item name="android:subtitleTextAppearance">#style/MyActionBarSubTitleText</item>
<item name="subtitleTextAppearance">#style/MyActionBarSubTitleText</item>
<item name="android:background">#color/blue</item>
<item name="background">#color/blue</item>
</style>

Change Color of Actionbar in Android

I am trying to change the background color of actionbar in my App but this is showing different on my app. Instead of coloring the actionbar the whole activity is color.
I am not sure why this is happening? I just want the main actionbar and settings actionbar colored.
Please check the screenshot.
Main Activity Map:
Preference Settings:
I also have transparent Actionbar with UP Navigation enabled for all my sub activities other than the main activity and preference settings activity.
I am not sure why it is showing like the above:
Here is style.xml (values-v14):
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppBaseTheme" parent="android:Theme.Holo.Light.DarkActionBar">
<item name="android:background">#FF5050</item>
</style>
<style name="dialogtheme" parent="#android:style/Theme.Holo.Light.DarkActionBar"></style>
<!-- Transparent ActionBar Style -->
<style name="AppTheme.Light.ActionBar.Transparent" parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#android:color/transparent</item>
</style>
<!-- Activity Theme with transparent ActionBar -->
<style name="AppTheme.TransparentActionBar.Light" parent="#style/AppBaseTheme">
<item name="android:actionBarStyle">#style/AppTheme.Light.ActionBar.Transparent</item>
<item name="android:windowIsTranslucent">true</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:displayOptions">showHome|homeAsUp|showTitle</item>
<item name="android:icon">#android:color/transparent</item>
<item name="android:actionBarTabTextStyle">#style/ActionBarTabTextStyle.Tabtheme</item>
<item name="android:actionBarDivider">#drawable/verticallinefordivder</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle.MapsLocation</item>
</style>
<style name="simpledialog" parent="android:Theme.Holo.Light.Dialog">
<item name="android:windowNoTitle">true</item>
</style>
<style name="ActionBarTabTextStyle.Tabtheme" parent="#style/AppBaseTheme">
<item name="android:textSize">18sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#android:color/black</item>
</style>
<style name="ActionBarTabStyle.MapsLocations" parent="#android:style/Widget.Holo.Light.ActionBar.TabView">
<item name="android:background">#drawable/tab_indicator</item>
</style>
<style name="myPreferenceTheme" parent="#style/AppBaseTheme">
<item name="android:textColor">#color/blue</item>
</style>
<style name="Widget.ActionButton" parent="#style/AppBaseTheme">
<item name="android:background">?android:attr/actionBarItemBackground</item>
<item name="android:paddingLeft">12dip</item>
<item name="android:paddingRight">12dip</item>
<item name="android:minWidth">56dip</item>
<item name="android:minHeight">?android:attr/actionBarSize</item>
</style>
</resources>
A little change and you action bar will be red:
<style name="AppBaseTheme" parent="android:Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/AppTheme.Light.ActionBar</item>
</style>
<style name="dialogtheme" parent="#android:style/Theme.Holo.Light.DarkActionBar"></style>
<!-- Transparent ActionBar Style -->
<style name="AppTheme.Light.ActionBar" parent="#android:style/Widget.Holo.ActionBar">
<item name="android:background">#FF5050</item>
</style>
I have changed item in AppBaseTheme & AppTheme.Light.ActionBar .
Now you are good to go. let me know if it works however working at my end :P
You can try set custom view in action bar.
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(you_custom_layout);
I know this is not right answer to this question but if you want to edit your ActionBar, you can use this online Android Action Bar Style Generator.
At least you can create a style and check yours to find differences and learn how to edit your ActionBar.

Experimenting with styles => No resource found that matches the given name: attr

I try to develop an app for API 8 but do not have any experience with styles.xml. For activities in the app I use Theme.Light. After playing with styles I got the error above. I've also checked other posts on this portal and I tried many suggestions but I could not get further. The styles.xml is below and hopefully someone will come with suggestions.
<resources>
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<style name="ContactLabelTextView">
<item name="layout_width">wrap_content</item>
<item name="layout_height">wrap_content</item>
<item name="layout_gravity">left|center_vertical</item>
<item name="layout_marginLeft">15dp</item>
<item name="layout_marginRight">5dp</item>
<item name="layout_marginTop">5dp</item>
<item name="clickable">false</item>
<item name="longClickable">false</item>
<item name="textSize">14sp</item>
<item name="textAppearance">?android:attr/textAppearanceMedium</item>
<item name="android:textColor">#android:color/black</item>
<item name="layout_marginBottom">5dp</item>
</style>
<style name="ContactMultiplineText" >
<item name="layout_width">match_parent</item>
<item name="layout_height">wrap_content</item>
<item name="layout_marginLeft">15dp</item>
</style>
After reading the post recommended by Alexander Zhak I have better understanding of styles. Therefore, I made some modifications to my styles.xml and it works. Those modifications are:
...
<style name="ContactLabelTextView" parent="#android:style/TextAppearance.Medium">
<item name="android:textSize">14sp</item>
<item name="android:textColor">#android:color/black</item>
<item name="android:longClickable">false</item>
<item name="android:clickable">false</item>
</style>
<style name="ContactLabelTextView.Layout">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_gravity">left|center_vertical</item>
<item name="android:layout_marginLeft">15dp</item>
<item name="android:layout_marginRight">5dp</item>
<item name="android:layout_marginTop">5dp</item>
<item name="android:layout_marginBottom">5dp</item>
</style>
<style name="ContactMultiplineText">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_marginLeft">15dp</item>
</style>
...
You need to have a parent style to enable you to call the attributes of it.
sample:
<style name="ContactLabelTextView" parent="#android:style/TextAppearance.Medium">
The above code is used when you want your textView as a Medium size text, you can still change it what ever size you want for your TextView.

change ActionBar Spinner text color

I already read many ways to change spinner textColor in an ActionBar, but I really can't figure it out what is missing to make what I need.
This is how I have my actionbar spinner:
As you can see, I have white text on spinner items. I need to change it to black.
My res/styles file is this one.
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppBaseTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<!-- API 14 theme customizations can go here. -->
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:dropDownItemStyle">#style/MyDropDownItemView</item>
<!-- <item name="android:textColor">#color/white</item> -->
</style>
<!-- ActionBar styles -->
<style name="MyDropDownListView" parent="#style/Widget.AppCompat.ListView.DropDown">
<item name="android:background">#color/white</item>
</style>
</resources>
I changed background to white, but now i need to change text to black and I can't do it.
Some one can help me?
I think the easiest way is to create a custom spinner item layout for your spinner, but with only a textview & it's color set to whatever you want it to be.
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:textSize="14sp"
android:textColor="#000000" />
Here is also a post that explains how to do it by changing the xml styles: Android Actionbar navigation spinner text color
UPDATE:
Remove the "android:" part from the xml statments that change something from the appcompat library. In my app it did the trick. So instead of this:
<style name="AppBaseTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<!-- API 14 theme customizations can go here. -->
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:dropDownItemStyle">#style/MyDropDownItemView</item>
<!-- <item name="android:textColor">#color/white</item> -->
</style>
You remove the "android:" part:
<style name="AppBaseTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<!-- API 14 theme customizations can go here. -->
<item name="dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="dropDownItemStyle">#style/MyDropDownItemView</item>
<!-- <item name="textColor">#color/white</item> -->
</style>
UPDATE 2:
So i'll just post how i style my appcompat apps, so maybe you can see what i don't see. I have 2 folders: resources/values & resources/values-v14.
In the resource/value my style.xml file looks like this:
<style name="Theme.Jamesstyle" parent="#style/Theme.AppCompat.Light">
<item name="actionBarStyle">#style/Actionbar.FlatUi</item>
<item name="actionBarTabStyle">#style/ActionBar.FlatUi.Tabs</item>
<item name="actionBarTabTextStyle">#style/ActionBar.FlatUi.Text</item>
<item name="homeAsUpIndicator">#android:color/transparent</item>
</style>
<style name="Actionbar.FlatUi" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="background">#color/bizzumi_light</item>
<item name="backgroundStacked">#color/bizzumi_red</item>
<item name="backgroundSplit">#color/bizzumi_red</item>
<item name="titleTextStyle">#style/TitleColor</item>
<item name="displayOptions">showHome|homeAsUp|showTitle</item>
</style>
<style name="TitleColor" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="textColor">#000099</item>
</style>
And in my resources/values-v14 style.xml file i have:
<style name="Theme.Jamesstyle" parent="#style/Theme.AppCompat.Light">
<item name="android:actionBarStyle">#style/Actionbar.FlatUi</item>
<item name="android:actionBarTabStyle">#style/ActionBar.FlatUi.Tabs</item>
<item name="android:homeAsUpIndicator">#android:color/transparent</item>
<item name="android:actionBarTabTextStyle">#style/ActionBar.FlatUi.Text</item>
</style>
<style name="Actionbar.FlatUi" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/bizzumi_light</item>
<item name="android:backgroundStacked">#color/bizzumi_light</item>
<item name="android:backgroundSplit">#color/bizzumi_light</item>
<item name="android:titleTextStyle">#style/TitleColor</item>i
<item name="android:displayOptions">showHome|homeAsUp|showTitle</item><item name="displayOptions">showHome|homeAsUp|showTitle</item></style>
<style name="TitleColor" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#000099</item>
</style>
Maybe try this folder structure and create 2 different styles.xml files. Otherwise i'm clueless. Good luck!
`<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppBaseTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<!-- API 14 theme customizations can go here. -->
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:dropDownItemStyle">#style/MyDropDownItemView</item>
<!-- <item name="android:textColor">#color/white</item> -->
</style>
<!-- ActionBar styles -->
<style name="MyDropDownListView" parent="#style/Widget.AppCompat.ListView.DropDown">
<item name="android:background">#color/white</item>
<item name="android:textColor">#000000</item>
</style>

How to align the Action bar Tab text in android

You can check out my output below.There you can see, In ANNOUNCEMENT,letter T is placed at bottom.It needs to be align like Gallery and placed in the center.
styles.xml:
<resources>
<style name="AppBaseTheme" parent="android:Theme.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<style name="GridLayout">
<item name="android:drawSelectorOnTop">true</item>
<item name="android:listSelector">#drawable/photogrid_list_selector</item>
</style>
<style name="CustomRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/custom_ratingbar</item>
<item name="android:minHeight">20dip</item>
<item name="android:maxHeight">20dip</item>
</style>
<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">12sp</item>
<!-- <item name="android:textStyle">bold</item> -->
</style>
</resources>
I doesn't know how to solve these issue.Anybody can help me if you know how to solve these.Thank you.
I just tried it almost two days.But I can't find a solution for
these.After that I think and solve these problem.
Actually I am using an emulator.So that these kind of problems
occurred for me.
Then I try to run these code in Real devices.It seems Action bar
Tab test Announcement align at the centre.Problem solved for me.

Categories

Resources