I've been struggling with PopupMenu styling, and after a lot of research, the process of creating a custom PopupMenu style for my theme seemed to be fairly straightfoward. For example the answer on this question seems like an easy way to change the background color of a PopupMenu. However, none of these solutions have worked for my project. So I started digging into the style sources to find out what I should actually be inheriting to style the PopupMenu in my own project.
I'm running my tests on a handset running API 19, and my base theme looks like this:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- ... -->
<item name="android:popupMenuStyle">#style/CustomPopupMenu</item>
</style>
<style name="CustomPopupMenu" parent="#style/Widget.AppCompat.Light.PopupMenu">
<item name="android:popupBackground">#color/retina_burning_hot_pink</item>
</style>
This is the solution that most of the accepted answers here show. But this does not style my PopupMenu. So I dug into the sources to find the geneology of my theme and see what default settings where being used. This is what I found:
<style name="Theme.AppCompat.Light.DarkActionBar" parent="Base.Theme.AppCompat.Light.DarkActionBar"/>
<style name="Base.Theme.AppCompat.Light.DarkActionBar" parent="Base.Theme.AppCompat.Light">
<style name="Base.Theme.AppCompat.Light" parent="Base.V7.Theme.AppCompat.Light"/>
And then in Base.V7.Theme.AppCompat.Light I found these default settings:
<!-- Popup Menu styles -->
<item name="popupMenuStyle">#style/Widget.AppCompat.Light.PopupMenu</item>
<item name="textAppearanceLargePopupMenu">#style/TextAppearance.AppCompat.Light.Widget.PopupMenu.Large</item>
<item name="textAppearanceSmallPopupMenu">#style/TextAppearance.AppCompat.Light.Widget.PopupMenu.Small</item>
<item name="listPopupWindowStyle">#style/Widget.AppCompat.ListPopupWindow</item>
<item name="dropDownListViewStyle">?android:attr/dropDownListViewStyle</item>
So as far as I can tell, my theme inherits from Theme.AppCompat.Light.DarkActionBar which uses a default PopupMenu style of #style/Widget.AppCompat.Light.PopupMenu. I then inherit that style to set my own PopupMenu settings. I made sure my Activity and my Application are all using the correct Theme. I'm not sure why else this just won't work. I've also tried these settings:
<item name="android:textAppearanceLargePopupMenu">#style/CustomPopupMenuLarge</item>
<item name="android:textAppearanceSmallPopupMenu">#style/CustomPopupMenuSmall</item>
<item name="android:popupWindowStyle">#style/CustomPopupMenuListWindow</item>
I provided custom styles for each one, and none of them worked. What could be overriding all my custom styles? Any help would be appreciated, because I'm stumped.
EDITS
Here's my manifest...
<?xml version="1.0" encoding="utf-8"?>
<manifest
xmlns:android="http://schemas.android.com/apk/res/android"
package="com.blah.blah">
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<activity
android:name=".Activities.MainActivity"
android:label="#string/app_name"
android:theme="#style/AppTheme.NoActionBar">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
Here is AppTheme.NoActionBar
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
Do not specify android: in
<item name="android:popupMenuStyle">#style/CustomPopupMenu</item>.
Instend:
<item name="popupMenuStyle">#style/CustomPopupMenu</item>
I think you need to define a parent for AppCompat.NoActionBar. Try parent="Theme.AppCompat.Light.NoActionBar" and also add in <item name="android:popupMenuStyle">#style/CustomPopupMenu</item> to it.
Related
I am trying to create base theme for whole my app, I have created custom styles for base components like EditText, Button, TextView and wanna to set them globally in my app.
Here is my xml code.
<style name="AppThemeBase" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">#color/base_app_color</item>
<item name="colorPrimaryDark">#color/base_app_color</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="windowActionBarOverlay">true</item>
<item name="windowActionModeOverlay">true</item>
<item name="android:editTextStyle">#style/EditTextBaseStyle</item>
<item name="android:textViewStyle">#style/TextViewBaseStyle</item>
</style>
My custom edit text style
<style name="EditTextBaseStyle" parent="Widget.AppCompat.EditText">
<item name="android:textColor">#color/base_text_color</item>
<item name="android:textSize">#dimen/text_size_edit_text</item>
<item name="android:textColorHint">#color/base_hint_color</item>
<item name="android:layout_centerHorizontal">true</item>
<item name="android:background">#drawable/edit_text_rounded_corners_bg</item>
</style>
I also tried to use #android:style/Widget.EditText as a parent.
<style name="TextViewBaseStyle" parent="#android:style/Widget.TextView">
<item name="android:textColor">#color/base_text_color</item>
<item name="android:textSize">#dimen/size_text_base</item>
<item name="android:layout_margin">#dimen/margin_text_view_base</item>
</style>
And of course in AndroidManifest.xml file
<application
android:name=".application.QrApplication"
android:allowBackup="true"
android:icon="#drawable/ic_logo_green"
android:label="#string/app_name"
android:theme="#style/AppThemeBase">
<activity
android:name=".ui.activities.LoginActivity"
android:configChanges="orientation|keyboardHidden"
android:label="#string/app_name"
android:noHistory="true"
android:screenOrientation="portrait">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
I have several questions
Why it doesn't apply style for each view (EditText and TextView), if set style manually in xml layout it works like a charm, but I cannot get it working globally
About style inheritance. There are two types of inheritance explicit or implicit or for user custom styles using . (dot) and using keyword parent for default themes, but what will be if combine this types of inheritance like this <style name="SomeStyle.ParentStyle" parent="Widget.AppCompat.Button">?
Are styles and theme applied to fragments inside activity, theoretically it should because for inflating fragment context from activity is used which is ContextWrapper ?
Please if you have any ideas what can cause such problem, help to solve it or at least share your thoughts.
Thanks.
The problem was solved
Instead of overriding
<item name="android:editTextStyle">#style/EditTextBaseStyle</item>
I have to override
<item name="editTextStyle">#style/EditTextBaseStyle</item>
To figure out what style item you need to override, follow the inheritance tree of base style/theme and you will find what is the name of style item you need to use.
BUT NOTE
Text view style should be still
<item name="android:textViewStyle">#style/TextViewBaseStyle</item>
It is weird but as is.
In styles.xml, in my user's style I can't set window title size (height).
It's always the same.
<item name="android:windowTitleSize">20dip</item>
and
<style name="my_menu" parent="#android:style/Theme.Dialog">
<item name="android:windowTitleStyle">#style/CustomMenuTitle</item>
...
<style/>
<style name="CustomMenuTitle" >
<item name="android:layout_height">12dip</item>
<item name="android:windowTitleSize">12dip</item>
<style/>
* EDIT *
in manifest.xml:
<activity android:name=".DlgSubmenuZnajdz"
android:screenOrientation="sensor"
android:configChanges="orientation|keyboardHidden"
android:theme="#style/my_menu">
</activity>
not working.
How can I do it?
If you set a custom style, you also have to modify your AndroidManifest.xml.
Something like:
<application android:icon="#drawable/icon" android:label="#string/app_name" android:theme="#style/my_menu">
You can also apply your custom theme to an specific Activity. Like the example below.
<activity android:name="com.example.Activity" android:theme="#style/my_menu">
Edit: Try the following xml:
<style name="my_menu" parent="#android:style/Theme.Dialog">
<item name="android:layout_height">12dip</item>
<item name="android:windowTitleSize">12dip</item>
<item name="android:windowTitleStyle">#style/CustomMenuTitle</item>
...
<style/>
<style name="CustomMenuTitle" >
<!-- customize other stuff here, like the example below -->
<item name="android:textSize">20dip</item>
<style/>
I've a newly created project and the first thing I want to do is add and style an action bar. I made it the way they tell in their official tutorials and even tried some other ways but I just can't make it work.
After many tries, I decided to do something really basic but even like that I can't make it work.
This is what I have:
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/blue</item>
</style>
manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="#string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
Another question is what is the difference between the #android:style/Theme.Holo, #style/Theme.AppCompat.Light.DarkActionBar or simply Theme.AppCompat.Light.DarkActionBar?
Thanks.
Per the Using the Material Theme training, the Material theme (and AppCompat theme's which backport / use Material theming) use colorPrimary to color the action bar. Therefore your theme can be:
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/blue</item>
</style>
You'll find more details on how to theme using AppCompat / Material in the AppCompat v21 blog post and in this pro-tip
I recommend you use this tools to generate ActionBar styles:
http://jgilfelt.github.io/android-actionbarstylegenerator/
Good Luck!
I've a newly created project and the first thing I want to do is add and style an action bar. I made it the way they tell in their official tutorials and even tried some other ways but I just can't make it work.
After many tries, I decided to do something really basic but even like that I can't make it work.
This is what I have:
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/blue</item>
</style>
manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="#string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
Another question is what is the difference between the #android:style/Theme.Holo, #style/Theme.AppCompat.Light.DarkActionBar or simply Theme.AppCompat.Light.DarkActionBar?
Thanks.
Per the Using the Material Theme training, the Material theme (and AppCompat theme's which backport / use Material theming) use colorPrimary to color the action bar. Therefore your theme can be:
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/blue</item>
</style>
You'll find more details on how to theme using AppCompat / Material in the AppCompat v21 blog post and in this pro-tip
I recommend you use this tools to generate ActionBar styles:
http://jgilfelt.github.io/android-actionbarstylegenerator/
Good Luck!
short and simple question:
I use the actionBarSherlock library, and wish to have only the app's label set to some string, yet all activities have the empty label unless specified otherwise.
I know you can go over each activity and set its label to "" , but is there a better solution? like using the styles ? I've tried putting :
<item name="android:label"></item>
in there, but it didn't do anything.
EDIT: fact is, for some reason, setting the label of all activities to "" , actually also change the label of the app on some android versions (tested on galaxy s mini, with android 2.3) , so its name is "" too. How come? is it a bug?
This is a bug on either android or any launcher i've tested on.
it seems that setting the label to the activities to "" (or at least the main one) sets the name of the app to "" , so the label of the application tag is just for the default value of all of its activities.
You can remove the whole title bar by putting <item name="android:windowNoTitle">true</item> in your app theme. I don't think you should have a title bar without a title (unless on devices running 3.0 or higher, where the title bar becomes the ActionBar and has more functionality), as it'll just waste valuable space.
If you are developing on 3.0+, as well as 2.3, add the following elements to your theme:
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="#android:style/Widget.ActionBar">
<item name="android:displayOptions">showHome|useLogo</item>
</style>
EDIT:
styles.xml:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppBaseTheme" parent="android:Theme.Holo">
<!-- Base Theme style elements -->
</style>
<style name="AppTheme" parent="AppBaseTheme">
<!-- Other style elements. -->
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="AppThemeWithTitle" parent="AppTheme">
<item name="android:actionBarStyle">#style/ActionBarWithTitle</item>
</style>
<style name="ActionBar" parent="#android:style/Widget.ActionBar">
<!-- Other ActionBar style elements. -->
<item name="android:displayOptions">showHome|useLogo</item>
</style>
<style name="ActionBarWithTitle" parent="ActionBar">
<item name="android:displayOptions">showHome|useLogo|showTitle</item>
</style>
</resources>
AndroidManifest.xml:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.themes"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="16" />
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
<activity
android:name="com.example.themes.Activity1"
android:theme="#style/AppThemeWithTitle">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name="com.example.themes.Activity2" />
<activity
android:name="com.example.themes.Activity3" />
</application>
</manifest>
Activity1 will have the title displayed but Activity2 and Activity3 will not.