At my app i use ActionBar using AppCompat v7. I notice that on devices is something like padding on the left and on the right of ActionBar (white spaces). I have fixed that using that solution:
<resources>
<!-- the theme applied to the application or activity -->
<style name="AppTheme"
parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="Widget.AppCompat.Toolbar">
<!-- Support library compatibility -->
<item name="contentInsetStart">0dp</item>
<!--<item name="background">#android:color/transparent</item>-->
</style>
Everything looks ok at my cell phone (5 inches) but at large screens like tablets the problem still exists... why?
I think using toolbar is the answer but if someone don't want to rebuild an app here is (less elegant) solution:
use:
ab.setCustomView(R.layout.actionbar_main);
Toolbar parent =(Toolbar) ab.getCustomView().getParent();
parent.setContentInsetsAbsolute(0,0);
parent.setBackgroundColor(Color.parseColor("#00A0D1"));
instead of using
<item name="contentInsetStart">0dp</item>
in style.xml
that "strange" padding is still there but have the same color like ActionBar.
Now Everything looks fine even on large screens.
Related
On android 7 (nexus phone) the title in my context menu appears white. I would expect it to be black as it is on all other devices I tested. The rest of the app looks good.
Update:
I figured out that the colorAccent is the culprit (AppCompat styles various things based on that). I set it to white in a child theme because the tabBar needs to have white tab indicators.
So now the issues is that I need white tab indicators in the actionbar, black titles in dialogs and context menus and Orange text on buttons styled with the Button.Borderless.Colored style. All of these seem to be controlled with colorAccent. I can make a seperate style for the buttons. But the styles of the dialogs and tab indicators are still conflicting. For legacy reasons I cannot use the new toolbar with a tablayout (That one is stylable) but have to use the Actionbar. Any ideas?
White title in context menu screenshot:
Thanks in advance!
Theme:
<resources>
<!-- default theme -->
<style name="Theme.MyApp" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Remove actionbar -->
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<!-- Basic coloring -->
<item name="colorPrimary">#color/MyAppOrange</item>
<item name="colorPrimaryDark">#color/MyAppOrangeDark</item>
<item name="colorAccent">#color/MyAppOrangeDark</item>
<!-- AppCompat dialog themes -->
<item name="dialogTheme">#style/Theme.MyApp.Dialog</item>
<item name="alertDialogTheme">#style/Theme.MyApp.Dialog.Alert</item>
///// Tried this with a custom style but that just f*cked up my tabs...
<item name="actionBarTabStyle">#style/CustomActionBarTabs</item>
</style>
<!-- Alert and dialog styles -->
<style name="Theme.MyApp.Dialog" parent="Theme.AppCompat.Light.Dialog">
<item name="colorPrimary">#color/MyAppOrange</item>
<item name="colorPrimaryDark">#color/MyAppOrangeDark</item>
<item name="colorAccent">#color/MyAppOrangeDark</item>
</style>
<style name="Theme.MyApp.Dialog.Alert" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="colorPrimary">#color/MyAppOrange</item>
<item name="colorPrimaryDark">#color/MyAppOrangeDark</item>
<item name="colorAccent">#color/MyAppOrangeDark</item>
</style>
</resources>
Djangow, you need to define a new style that with the text color as the specific color you want and then set that style in the app theme you want to use. See this link for the exact coding needed.
UPDATE: Djangow, I apologize. I looked into it and found that you have to add this line <item name="android:actionMenuTextColor">#color/your_color</item> to the main App theme. I found the answer here. Hope that helps
I need to change text size of action buttons in AppBar/Toolbar. It should be 14sp, but I'll use 20sp in this example, because it is more evident. I am using appcompat-v7 22.1.1
At first I tried to use theme attribute android:actionButtonStyle:
<style name="FirstAttemptTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionButtonStyle">#style/Custom.Widget.AppCompat.Light.ActionButton</item>
</style>
<style name="Custom.Widget.AppCompat.Light.ActionButton" parent="Widget.AppCompat.Light.ActionButton">
<item name="android:textSize">20sp</item>
</style>
Then I ran application on the Lollipop and the result was as needed:
But then I used an emulator with lower version and my theming had no effect:
I digged a little deeper and discovered that abc_action_menu_item_layout.xml is used for action menu items and it has a line android:textAppearance="?attr/actionMenuTextAppearance"
So I tried to modify this theme attribute (I also had to add textStyle:bold):
<style name="SecondAttemptTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionMenuTextAppearance">#style/Custom.TextAppearance.AppCompat.Widget.ActionBar.Menu</item>
</style>
<style name="Custom.TextAppearance.AppCompat.Widget.ActionBar.Menu" parent="TextAppearance.AppCompat.Widget.ActionBar.Menu">
<item name="android:textSize">20sp</item>
<item name="android:textStyle">bold</item>
</style>
As in the first time, the result was as needed on Lollipop and no effect on any version below.
So, the question is: how to properly change text size for action menu item?
PS: I created a simple project on github to demostrate my issue
It appears that actionButtonStyle and actionMenuTextAppearance should be used without android: namespace.
As it can be seen in values-v21/values.xml of support library, Lollipop uses attribute from system theme (note the android: prefix), that's why my attempts worked with it:
<style name="Base.V21.Theme.AppCompat.Light" parent="Base.V7.Theme.AppCompat.Light">
...
<item name="actionButtonStyle">?android:attr/actionButtonStyle</item>
...
</style>
I am using theme as:
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat">
<item name="android:windowActionBarOverlay">true</item>
<!-- Support library compatibility -->
<item name="windowActionBarOverlay">true</item>
</style>
I want to show the ImageView partly behind the the ActionBar. I have tried Show ImageView partly behind transparent ActionBar and searched on google, but can't find the appropriate solution.
Better use Toolbar or Support Toolbar
With Toolbar, you can add it in your XML File just like any other View.
In your Activitys onCreate call setActionBar(toolbar) / setSupportActionBar(toolbar)
Or try to add these two lines in your style:
<item name="android:windowActionBarOverlay">true</item>
<!-- Support library compatibility -->
<item name="windowActionBarOverlay">true</item>
But using the Toolbar is actually pretty simple and the new standard.
Read this to get started: http://android-developers.blogspot.de/2014/10/appcompat-v21-material-design-for-pre.html
I have been banging my head over this for some time now without any luck.
I am using the android.support.v7.widget.Toolbar in my App (which supports Android API 11 and above), and want to style it. Here is how I am trying it:
My Activity Layout XML contains:
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:theme="?attr/foo" />
res/values/attr.xml contains (this is where I define my attributes):
<attr name="foo" format="reference" />
res/values/Themes.xml:
<style name="AppTheme" parent="Theme_one">
</style>
<style name="Theme_one" parent="#style/Theme.AppCompat.Light">
<item name="windowActionBar">false</item>
<item name="foo">#style/foo_style</item>
<!-- bunch of other styles -->
</style>
res/values/Styles.xml:
<style name="foo_style" parent="#style/Theme.AppCompat.Light">
<item name="android:background">#color/actionBarDark</item>
</style>
res/values-v21/Themes.xml:
<style name="AppTheme" parent="Theme_one">
<!-- some v21 specific items not related to toolbar like animations etc-->
</style>
res/values-v21/Styles.xml:
<style name="foo_style" parent="#style/Theme.AppCompat.Light">
<item name="android:colorPrimaryDark">#color/actionBarDark</item> <!-- THIS DOES NOT WORK !!! -->
<item name="android:background">#color/actionBarDark</item>
<item name="android:elevation">5dp</item>
</style>
This arrangement works fine for Android API v11 to v19.
My issues for v21 (I also tried 2 and 3 without the android: prefix with same result):
1) android:background works fine!
2) android:colorPrimaryDark does not work!
3) android:elevation applies to the title of the Toolbar and the Toolbar buttons as below. Is this expected?
What am I missing? Clearly I am not doing the styling the correct way, but unable to find any resources which talk about toolbar styling!
I got colorPrimaryDark to work by by moving the:
<item name="colorPrimaryDark">#color/actionBarDark</item>
from res/values-v21/Styles.xml to res/values-v21/Themes.xml.
I got the elevation to work by removing it from all styles or theme xmls, and putting it in the android.support.v7.widget.Toolbar declaration.
Also, If I define another theme here and change it dynamically in the app using Content.setTheme(), the theme changes but the status bar color does not. Any suggestions are welcome.
I am working on an app where I have to modify the app Actionbar. I am able to design it according to the requirement, but facing problem in designing the white line beneath the action bar. Well, I have got some hack where I can take the view and design it. But I want it to style it using style.xml.
EDIT
Now google has released toolbar that you can modify easily.
You can style your action bar like the below code -
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme"
parent="#android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#drawable/actionbar_background</item>
</style>
and also please check the link - https://developer.android.com/training/basics/actionbar/styling.html to get more information. Hope it helped you.