I have a ListView with some rows and a custom checkbox on the right hand side. On my OS 4.4 Nexus 4 it seems like a gentle gradient is being applied to the list row backgrounds, creating an ugly artifact on the checkboxes (they disappear half way down, and then invert for the bottom half). On other devices I don't see this problem, and I also don't see it in an OS 4.4.2 emulator.
I haven't been able to find any information online about this, so I'm not sure if it's specific to the device, or the exact OS flavor.
Is this something I can disable? If not, what advice should I give my asset designer?
Here's a screenshot:
The Holo.Light theme uses a subtle grey gradient background. It might only be more apparent on one of your devices due to the screen's contrast/brightness.
You can just set the background to solid white by using the android:windowBackground tag in your Activity's theme:
<style name="SolidWhiteTheme" parent="android:Theme.Holo.Light">
<item name="android:windowBackground">#android:color/white</item>
<item name="android:colorBackground">#android:color/white</item>
</style>
And then applying the theme to your activity in your AndroidManifest.xml like so:
<activity
android:theme="#style/SolidWhiteTheme"
...
>
...
</activity>
As Denley mentioned, the reason for this is the default background specified by the Holo.Light theme.
However, since this background is specifically affecting your ListView, I would suggest setting the background of your ListView in your xml file. Code below.
<ListView
android:background="#android:color/white">
Try specifying a background color for your activity (android:background). If the background is not explicitly set, the device may be using it's own device-specific default background, which is why the gradient is only shown on your Nexus 4 and not other devices.
Related
Anyone can help me?
I'm developing the Light and Dark theme function in the android app, everything goes fine, but the background of Recyclerview shows incorrectly.
The root background of xml file is White color and I didn't set background for recyclerview in xml. However, after changing from Light to Dark or Dark to Right=> background of recyclerview automatically change to a strange color(this color didn't see in my color.xml resource). I tried to set background of Recyclerview to #null or transparent in code and xml file as well but the background of recyclerview didn't remove that strange color.
So anyone knows exactly the reason why, please help me and much appreciated. Thanks
enter image description hereenter image description here
I am guessing you are using the DayNight Theme. If so you should have to themes.xml folder in res, one is called as mentioned and the other is with the extension (night). There you can define a color in both xml files. It has the same name but different color values like this:
<style name="AppTheme" parent="Theme.AppCompat.DayNight">
<item name="colorPrimaryDark">#ffffff</item> <!-- you normally shouldn't hardcode color -->
</style>
The same for your folder (night):
<style name="AppTheme" parent="Theme.AppCompat.DayNight">
<item name="colorPrimaryDark">#000000</item> <!-- you normally shouldn't hardcode color -->
</style>
The idea is to have one attribute name that contains 2 colors and takes the correct one if needed. For futher understanding I suggest to take a look at this reference to get more familiar with Themes and Styles. Now you set up your Day and Night files properly, you can implement it by using it in your recyclerView as follows:
android:background="?attr/colorPrimaryDark"
Another tip is to make custom colors in multiple colors.xml files to make them for more unique use. In this case colorPrimaryDark effect your whole app. It is also suggested to modify layouts and the visuals of widgets to take effect only on those. (e.x. your recyclerView). In my app I used colorPrimaryDark for all Background (that should be same for more clean design). I think you get the keypoint. Take a look around the net and this forum and you will find your final design strategy. Cheers! :)
My Samsung Galaxy s7 just updated to Android Nougat 7.0 and I noticed some of the buttons are displayed differently. I happen to have another Galaxy s7 around which hasn't gone through the update yet (Marshmallow 6.0.1). I can see the difference in sizes very clearly:
Marshmallow:
Nougat:
The layout_height of that SHARE button is hard set to 44dp. Using Layout Inspector in Android Studio I can read that it resolves to 176px for Marshmallow and 132px for Nougat (same values for mMeasuredHeight). You can also see that the other part of the layout on the left remained the same (ignore the little thumb up icon).
Another example:
Marshmallow:
Nougat:
I'm using following styling for the buttons:
<style name="AppTheme.Button" parent="Widget.AppCompat.Button">
<item name="android:textSize">14sp</item>
<item name="android:textColor">#color/colorPrimaryDark</item>
<item name="android:backgroundTint" tools:targetApi="lollipop">#color/colorTextBrightPrimary</item>
<item name="backgroundTint" >#FFFFFF</item>
<item name="colorButtonNormal">#color/colorTextBrightPrimary</item>
</style>
<style name="AppTheme.Button.Accent" parent="AppTheme.Button">
<item name="android:textColor">#color/colorTextBrightPrimary</item>
<item name="android:backgroundTint" tools:targetApi="lollipop">#color/colorAccent</item>
<item name="backgroundTint" >#color/colorAccent</item>
<item name="colorButtonNormal">#color/colorAccent</item>
</style>
While the SHARE button is a custom view, extending AppCompatButton, the Google and Facebook auth buttons are just AppCompatButtons. In either way, they all looked different just before the update and nothing else was changed in code, nor on the device (text size and zoom are the same).
Any idea what's going on? How to ensure these layouts stay the same on various devices/OS'?
A drawable can have its own padding. In the case of a nine-patch PNG file, that's simply having transparent pixels outside of the actual non-transparent/resizing portion of the image. In the case of ShapeDrawable, you can directly declare padding in the XML. And so on. This may or may not show up as "padding" in tools like the Layout Inspector, as they focus on padding declared on widgets.
Since the previous background you were using had the problem, and the replacement background does not, my guess is that this sort of implicit padding is the problem.
You have two approaches for trying to deal with this:
The risky-but-simple approach is to try using negative padding on the button itself, in a res/values-v24/ variant of your style resources (or, optionally, use a consistent dimension resource in the style and vary the dimension values based on -v25 or not). You would have to tinker a bit to try to get values that "undo" the change. I call this "risky" as I haven't the foggiest notion how well Android respects negative padding.
The aggravating approach is to try to find the actual button background that you were using before, and see what changed about it. The drawables would be declared either in appcompat-v7's themes or the platform's themes, and the actual drawables themselves would then be defined either in appcompat-v7 or in the platform.
When building my app, I started just using the Theme.Light.NoTitleBar.Fullscreen theme. I built all my layouts for the whole app like this, and got things to look how I want them. Some drawables used in the layouts have their size specifically set, and others are set to wrap_content.
I then decided to switch to the Holo light theme. When I do this, all the drawables used in layouts that are set to wrap_content end up larger. Almost as if they are pulling from a larger bucket. In fact, some look like they've been stretched.
I know the background is black in the older theme one, but that's not an issue (this is actually a layout file that is included in another layout). Obviously there's quite a difference in size between the two.
Here is just my guess based on what I read in this thread.
It can be because you use those images as background property of Button views. This is not safe because depending on default margin values - which are defined in the Theme - Buttons can stretch background images as they need to. If this is the case, then you need to use ImageButton views instead and use setImage*() method to assign images. There you can use scaleType property as it was mentioned by Carlos Robeles.
The only thing that comes to my mind, is that the different themes has different values for the defaultandroid:scaleType attribute of the image views.
Please, try specifying the attribute as some that is good for you, and see what happens using the 2 different themes. For example you can use android:scaleType="center", so your ImageViews would be something like
<ImageView
android:scaleType="center"
android:width="wrap_content"
android:height="wrap_content"
android:src="...
Yo can take a look at the different scale types in the ImageView reference:
http://developer.android.com/reference/android/widget/ImageView.html#attr_android:scaleType
It is not easy to understand what's the meaning of every type, so the best is to take a minute to play with them
My guess is that for some reason, the Holo theme is rendering your images in a lower resolution than Light. I mean that for instance you have your drawables in the drawable-xhdpi and Holo is treating them as drawable-hdpi. In fact, I don't have any evidence of that, but recently I've been messing around with resolutions and the difference seems very familiar to me.
If you don't have your drawables in the drawable-xxhdpi (the biggest resolution) folder, you could try putting them into a higher lever resolution folder, to see what happens.
From android's source code, see https://github.com/android/platform_frameworks_base/blob/master/core/res/res/values/styles.xml
The style which your button will be used in Holo.Light is
<style name="Widget.Holo.Light.Button" parent="Widget.Button">
<item name="android:background">#android:drawable/btn_default_holo_light</item>
<item name="android:textAppearance">?android:attr/textAppearanceMediumInverse</item>
<item name="android:textColor">#android:color/primary_text_holo_light</item>
<item name="android:minHeight">48dip</item>
<item name="android:minWidth">64dip</item>
</style>
See the last two lines. It has default minHeight and minWeight. That's why your button is stretched.
Solutions
1. Set minHeight and minWidth of your Button to 0.
2. Use a custom style like this.
<style name="MyHoloLightButtonStyle">
<item name="android:background">#android:drawable/btn_default_holo_light</item>
<item name="android:textAppearance">?android:attr/textAppearanceMediumInverse</item>
<item name="android:textColor">#android:color/primary_text_holo_light</item>
</style>
3. Use a ImageButton, and set your images by setImage*(not setBackround*) method.
I have a strange problem with android resources. I have app created on Android 2.2 (android:minSdkVersion="8"). The application works fine.
When I installed app on for example Android 4.0, the application works fine, however at first run some resources are changed.
For example, I have drawable color named primary_color which refers to #FFFFFF html color. After installation, the system renders black color instead of white. In some cases #android:color/white renders black color.
Force closing app and restart app solving this problem.
Please help me to solve this issue.
This is caused by a bug in Android versions 4.0 to 4.1.3, I have been testing a similar problem with drawables turning to black only on devices with these versions, it is not present in devices with android version > 4.2.
I'm sure you noticed in your own research but it does not seem to be documented properly and there is no official solution but I can provide a few workarounds:
1) Turn off hardware acceleration, I used a different solution for my problem but this has been known to resolve some issues with images in the above mentioned Android versions. If you want hardware acceleration on for your application you can disable it for the problem activity by adding this to the activity declaration in your manifest.
<activity
android:name="activityName"
android:hardwareAccelerated="false"/>
2) For a solution specific to your example try setting the color to #android:color/transparent, this resolved my issue where I needed a background drawable to remain white.
3) Refer here: http://code.google.com/p/android/issues/detail?id=34619 to see a similar, documented bug and some of those solutions may work for your issue as well.
HTH
I came across the exact same problem!
I had this on colors.xml
<resources>
<color name="white">#ffffffff</color>
</resources>
And on styles.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#color/white</item>
</style>
The problem was that when using fragment(which contains a ListView) inside an activity the ListView shows white color as background(which is what I need) at first run but at second run the ListView background was black. The problem only existed on Android 4.0(I did not test on 4.1) but worked fine on Android 4.3, 4.4, 5 etc.
Turns out only white color had the problem, when colors other than white was used there was no black background issue!
So as I wanted a white background and I did not want to have overdraw of having multiple background so setting white as the windowBackground on styles.xml was important but at the same time it causes black background issues!
So as solution, I created another color which is not completely white but its white
<resources>
<color name="fakewhite">#fffefefe</color>
</resources>
And on styles.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#color/fakewhite</item>
</style>
Hence, in short color #ffffffff gets converted to #00000000 for Views like ListView and I also notice this behaviour on ScrollView.
This may not be a perfect solution but it worked for me!
I've seen there are many different "themes" for the Android, depending on the device. For example on my HTC WildFire the highlight color is a "lime green", and that of the emulator is orange.
Is there anyway to know what are the main interface colors of the device in which my app is running?
So i can set (for example) TextViews background colors to match the device theme.
EDIT: You told me this is not possible so...
Is there any way to draw a simple rectangle with the highlight color? Maybe a void button?
Thanks!!
It's not actually a specified color, the drawables themselves are actually replaced on these modified Android skins that HTC, Samsung, etc. put out. So programmatically, there's no direct way to know what the color scheme will be. Your best bet would be to simply define your own drawables for your widgets with your own color scheme, or even reuse the defaults from stock Android, but copy them to your app's drawable folder, and set them into a StateListDrawable, and apply these to your widgets. This will ensure that you get the same color style on all platforms, with the disadvantage being that your app will not match the scheme of the rest of the skin. Depending on your app's layout, that will likely not be a problem, though.
I don't think that there is a way for you to get what the default highlight color is but you can certainly set your own by using the "textColorHighlight=#aarrggbb" attribute on your TextView within the layout.
As far as I know, there isn't a way (I don't see how there could be really). I guess you could have a few different "themes" in your own app and let the user pick one, to easily atleast somewhat match the rest of their setup.
You can use the #android:drawable/list_selector_background (or code form: android.R.drawable.list_selector_background) on your views. It has each of the default selector states. You can also create a selector yourself in the drawable folder like this (named something like default_highlight.xml):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#android:drawable/list_selector_background" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#android:drawable/list_selector_background" /> <!-- focused -->
<item android:drawable="#android:drawable/list_selector_background" /> <!-- default -->
</selector>
And change any of those that you might want to customize. Then you use it like any drawable by setting the background of a View to that (default_highlight or whatever you call it).