I am having a really hard time with the styling of my Android application, check out the screenshot:
The screenshot is from a Android 4.0.3 emulator, so I expect the new looks.
There are several problems with it:
The black border around the title of the alert dialog
The blue border around the whole alert dialog
The NumberPicker looks like Android 2.0
The buttons should be black and with no space between them and the border of the dialog
My Styles.xml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.Splash" parent="android:Theme">
<item name="android:windowBackground">#drawable/splash</item>
<item name="android:windowNoTitle">true</item>
</style>
<style name="Theme.Recson.BlueBackground" parent="android:Theme">
<item name="android:background">#ff2390C8</item>
</style>
<style name="Theme.Recson.NoActionBar" parent="Theme.Recson.BlueBackground">
<item name="android:windowNoTitle">true</item>
</style>
</resources>
The activity that spawns this alert dialog uses Theme.Recson.BlueBackground. Not specifying any theme for the activity makes it look the way I want it to - except for the missing blue background:
So, I guess, the question is: How to fix my theme?
Try using parent="android:Theme.Holo".
Of course, this is only available from API level 11 and up, so you will have to create a separate styles.xml file and place it in the values-v11 folder.
In the default styles.xml file use your existing configuration, in the v11 file, you can use Theme.Holo.
Have a look at Styles and Themes - Select a theme based on platform version | Android Developers.
Related
I understand that to correctly use some of the Material theme design patterns for pre API-21 devices, I'll have to include two style folders.
The theme is applied correctly on my Nexus 5 (lolipop) device, but when I run my application on a pre API-21 device (I'm using my Samsung Galaxy Note, API-16), I'm getting a blank, black screen. The application works, as I can interact with the activity (press buttons, use the keyboard, etc), but I can't see anything.
Here is my res/values-v21/themes.xml file:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.MyTheme" parent="AppTheme">
<item name="colorPrimary">#color/green</item>
<item name="colorPrimaryDark">#color/darkgreen</item>
</style>
</resources>
and here is my res/values/themes.xml file:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.MyTheme" parent="Theme.AppCompat.Light">
</style>
</resources>
and I've included this line inside my manifest file under <application>:
android:theme="#style/Theme.MyTheme"
Am I not supposed to use the AppCompat theme for pre-lolipop devices? I'm using the v7 support library.
Any help is appreciated.
Change your res/values/themes.xml in:
<style name="Theme.MyTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/green</item>
<item name="colorPrimaryDark">#color/darkgreen</item>
</style>
Then remove the same theme (name="Theme.MyTheme") from res/values-v21/themes.xml
I'm making my app ready for Android 5.0, I'm using the latest compatibility library, here is what my style looks like.
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/theme_accent</item>
<item name="colorAccent">#color/theme_accent_secondary</item>
</style>
<style name="AppThemeDark" parent="Theme.AppCompat">
<item name="colorPrimary">#color/theme_accent</item>
<item name="colorAccent">#color/theme_accent_secondary</item>
</style>
</resources>
(The ActionBar color is being set programmatically.)
Now, I want the overflow/popup menu to have the dark background like it had in the holo implementation, but I can't get it to work, here is what it looks like:
I have tried setting the popupMenuStyle but it didn't work.
How can I make the popup menu darker?
Stop using the ActionBar. If you want a ToolBar to be set up like an ActionBar, follow this guide on the android-developers blog.
It actually mentions your use case at Dark Action Bar and provides this code:
<android.support.v7.widget.Toolbar
android:layout_height=”wrap_content”
android:layout_width=”match_parent”
android:minHeight=”#dimen/triple_height_toolbar”
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
Not a full answer but what I found so far:
In past versions you needed to specify a drawable (Check https://github.com/StylingAndroid/StylingActionBar code and tutorials)
Apparently, now that is a color. To modify it you need to do specify the following theme:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppTheme" parent="android:Theme.Material.Light.DarkActionBar">
<item name="android:actionBarPopupTheme">#style/popupNew</item>
</style>
<style name="popupNew" parent="android:ThemeOverlay.Material.Light">
<item name="android:colorBackground">#color/red</item>
</style>
</resources>
This works correctly if the theme applied to the app is just this.
If I add android:actionBarPopupTheme to my existing theme, it doesn't work. I am trying to figure out why.
Solved my problem by using this style:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/theme_accent</item>
<item name="colorAccent">#color/theme_accent_secondary</item>
<item name="actionBarStyle">#style/AbStyle</item>
<item name="actionModeBackground">#color/actionmode_bg</item>
</style>
<style name="AbStyle" parent="Widget.AppCompat.Toolbar">
<item name="elevation">2dp</item>
<item name="displayOptions">homeAsUp|showTitle</item>
<!--showHome-->
</style>
<style name="AppThemeDark" parent="Theme.AppCompat">
<item name="colorAccent">#color/theme_accent_secondary</item>
<item name="actionBarStyle">#style/AbStyle</item>
</style>
I had to use Widget.AppCompat.Toolbar as the parent actionBarStyle
Add the property popupTheme to your toolbar:
<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"
app:theme="#style/Theme.AppCompat.Light"
app:popupTheme="#style/Theme.AppCompat" />
Or define a new style for your toolbar:
<style name="MyToolBarStyle" parent="Widget.AppCompat.Toolbar">
<item name="android:background">#color/green</item>
<item name="popupTheme">#style/Theme.AppCompat.Light</item>
<item name="theme">#style/Theme.AppCompat</item>
</style>
This question has already been answered for styling via XML, but I'm adding an explanation here of how to work out the solution to this and similar styling questions yourself.
First, this is the solution when using AppCompat. To your App's style.xml add actionBarPopupTheme to your theme:
<style name="Theme.MyTheme" parent="#style/Base.Theme.AppCompat.Light.DarkActionBar">
...other stuff here
<item name="actionBarPopupTheme">#style/Theme.MyTheme.ActionBarPopupTheme</item>
</style>
<style name="Theme.MyTheme.ActionBarPopupTheme" parent="#style/ThemeOverlay.AppCompat.Light">
<item name="android:textColor">#android:color/white</item>
<item name="android:background">#android:color/black</item>
</style>
Here's the steps I took to arrive at this solution (it takes a bit of detective work as the Android documentation is poor):
Open your App's style.xml in Android Studio
On the line where you App's theme is defined, put your screen cursor in the parent theme (e.g. click in #style/Base.Theme.AppCompat.Light.DarkActionBar) then press F4. This should take you to the source code for the style in the appcompat library.
Within this style I saw this line:
< item name="actionBarPopupTheme">#style/ThemeOverlay.AppCompat.Light< /item>
This looked like a possible place to change the theme of the popup. I searched for "actionBarPopupTheme" in the poor
Android developers documentation and found "Reference to a theme that should be used to
inflate popups shown by widgets in the action bar". So this was worth playing with.
I copied the appcompat line containing "actionBarPopupTheme" to my style.xml then in this line replaced the item's theme reference (the bit in bold above) with Theme.MyTheme.ActionBarPopupTheme.
In my style.xml I created my new style named Theme.MyTheme.ActionBarPopupTheme. I used the same parent that was used in the style I copied from the appcompat source (the bit in bold above).
To ensure my new popup style was working, I changed the parent style to ThemeOverlay.AppCompat.Dark then ran and tested the code on a device. The popup style changed, so now I knew my overriding of actionBarPopupTheme was the correct thing to do. Then I changed back to ThemeOverlay.AppCompat.Light.
The next challenge is to work out what item names to override in Theme.MyTheme.ActionBarPopupTheme. I changed the text and background colours. To find the correct item names that change the style of something can be tricky in some cases. One way to find less obvious style item names is to look through the style definitions in the appcompat xml file (the one you opened when pressing F4 in the 2nd step above), continually descending into parent styles (F4 again!) until you find something that may do what you want. Google searches will help here too.
I am trying to get all of my activities to have a custom theme style that should look like this:
This theme works on many devices, including the Nexus 7, the Samsung Galaxy S4, and the Samsung Droid Charge (running Gingerbread). However, on other devices, such as HP Slate 7 and Motorola Droid RAZR, it ends up looking like this:
I have the following in my AndroidManifest.xml's application tag:
android:theme="#style/AppTheme"
The theme is as follows in res/values/styles.xml:
<style name="AppBaseTheme" parent="#android:style/Theme.Light.NoTitleBar">
</style>
<style name="AppTheme" parent="#style/AppBaseTheme">
<item name="android:windowBackground">#color/background</item>
</style>
I have also added a styles.xml under res/values-v11. Here is the applicable style from there:
<style name="AppBaseTheme" parent="#android:style/Theme.Holo.Light.NoActionBar">
</style>
Finally, this appears in styles.xml under res/values-v14:
<style name="AppBaseTheme" parent="#android:style/Theme.DeviceDefault.Light">
</style>
I have tried to define the theme for each activity and to manually use the setTheme() function in onCreate(), but nothing has worked. I have also tried to manually set a background in every Activity, and this did not work either. What can I do to fix my problem?
EDIT: What's interesting is setting android:background in the styles makes it work, but then elements that should not have backgrounds receive that background color as well.
The key to solving the problem was changing android:windowBackground in the theme to the following:
<item name="android:windowBackground">#drawable/default_background</item>
Notice that I am no longer using #color, but simply a #drawable, the xml for which is below:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#color/background"/>
</shape>
It seems that some devices do not support accepting a color for this element.
I found that the latest version of Android Studio expect that the parent for the style needs to be Theme.AppCompat. Also, it is good style to create a colors.xml file in the values directory (with named color elements between the resource tags). Put your RGB values as values to the named color elements. Reference them in your styles with #color/.
<!--colors.xml in values folder-->
<resources>
<color name="color1">#ffb62a23</color>
<color name="color2">#ffedeba6</color>
<color name="color3">#00ff00</color>
</resources>
<!--style tags -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:windowBackground">#color/color2</item>
<item name="android:textColorPrimary">#color/color1</item>
<item name="android:textColorSecondary">#color/color2</item>
<item name="android:textColorTertiary">#color/color3</item>
</style>
I have a custom view on an activity that is showed as a dialog.
I applied a custom theme to my activity so its parent is: "#android:style/Theme.Dialog" and I changed the window background to be transparent.
My Manifest.xml:
<activity android:name="com.rev.revcorder.ui.UserAuthenticationDialogActivity" android:screenOrientation="portrait"
android:theme="#style/userAuthenticationDialog">
</activity>
My styles.xml:
<style name="userAuthenticationDialog" parent="#android:style/Theme.Dialog">
<item name="android:windowBackground">#android:color/transparent</item>
</style>
The issue is that it is working fine on my device (Nexus 4 running 4.4) but on other device that is the same as mine (Nexus 4 running 4.4) it is not. Instead, the background is shown in black not transparent.
It only worked when I set it grammatically by adding:
getWindow().setBackgroundDrawable(new ColorDrawable(Color.parseColor("#00000000")));
My question is, what is the difference between setting the window background on my xml style and doing i grammatically ?
Also, how come it is working on my device and not on another same device ?
Thanks for your help
Add 2 more attributes to style like below code:
<style name="userAuthenticationDialog" parent="#android:style/Theme.Dialog">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:windowIsTranslucent">true</item>
</style>
You can make a Custom Theme for all the devices.
For example, here is the declaration for a custom theme which is simply the standard platforms default light theme. It would go in an XML file under res/values (typically res/values/styles.xml):
<style name="LightThemeSelector" parent="android:Theme.Light">
...
</style>
To have this theme use the newer holographic theme when the application is running on Android 3.0 (API Level 11) or higher, you can place an alternative declaration for the theme in an XML file in res/values-v11, but make the parent theme the holographic theme:
<style name="LightThemeSelector" parent="android:Theme.Holo.Light">
...
Now use this theme like you would any other, and your application will automatically switch to the holographic theme if running on Android 3.0 or higher.
For more information about providing alternative resources, such as themes and layouts, based on the platform version or other device configurations, see the Providing Resources document.
Show below image how can u structure resources.
Update:
Also try this, set below Theme into manifest.xml
android:theme="#android:style/Theme.Translucent.NoTitleBar"
I'm starting my second Android app and find that I would like to mostly use HOLO dark theme for app.
EXCEPT for the EditTexts, I would prefer to use the old Gingerbread style ones (looking closer to iOS) with some rounded corner.
I'm a bit lost as to how I can achieve this. If anyone could drop some hints or links that would be HIGHLY appreciated
In your Theme:
<style name="myTheme" parent="android:Theme.Holo">
<item name="editTextStyle">#style/MyWidget.EditText</item>
</style>
<style name="MyWidget.EditText" parent="android:Widget.EditText">
<item name="android:background">#drawable/edit_text</item>
</style>
Now you can get the referenced drawable from Github(from the Gingerbread branch of the framework)