How to display icons without alteration in an ImageButton/ImageView? - android

in my app, I have buttons with icons. The icons are provided as PNG images in the three densities in drawable-ldpi-v4/, drawable/ and drawable-hdpi-v4/. Here's a sample:
Each icon is displayed in an ImageButton:
<ImageButton style="#style/Shortcut" android:id="#+id/open_button"
android:src="#drawable/shortcut_open" android:layout_marginRight="4dp"/>
Where the Shortcut style is:
<style name="Shortcut">
<item name="android:layout_width">65dp</item>
<item name="android:layout_height">45dp</item>
<item name="android:scaleType">center</item>
<item name="android:background">#drawable/shortcut_background</item>
</style>
However, on certain devices/platform versions, certain icons get altered, blurred or something. I'm not sure that it's scaling, it's more like a rendering bug I think. I have tried to disable anti aliasing on the BitmapDrawable, but that didn't help.
As shown on the image below, on Android 2.1 LDPI, one icon gets broken/cropped, and on both Android 1.6 MDPI and Android 2.1 HDPI an extra line seems to be randomly added at the bottom of the icon (look closely).
In the manifest, I have an empty <supports-screens /> as recommended in the docs about supporting multiple screens in legacy apps. Adding anyDensity="true" doesn't help.
Apparently, as of Froyo, things get better as you can see on the image above. But how can I solve this on Android <= 2.1?

I think you should not use explicit sizes (even when expressed as dip) for the buttons, but let the system do it for you.
Use
<ImageButton android:id="#+id/SpeakButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
Also it may be that you are falling into the "dip" vs. "dp" trap that others have reported, where documentation says that they are synonymous, but using "dip" made stuff work as intended.

Not sure if this is the case but you can check if you are not running into the bugs mentioned in this Google I/O talk. I still have to wrap my head around it but I think it's worth having a look if you are targeting platforms from 1.5 to 2.0.

Related

Android add a padding with size that looks equal on all devices

I have a view that is the same size as my screen / fragment. However, I want to add a padding on the left and right edges such that on all devices, this padding looks like its the same size. when I use:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingStart="20dp"
android:paddingEnd="20dp">
....
The padding is not equal on all devices. On a tablet, it is much smaller than on a small phone. Is there a way maybe programmatically to set the padding as equal on all devices?
and is dp supposed to be density-independent? Then how come, on different density devices the padding set to dp is not always the same size visually?
Notice that what you want is not scalable and not recommended. The reason is that the sizes of devices vary a lot in Android, as well as their pixel densities.
Furthermore, I include a more general article that might help you.
However:
A. Try with other units like mm or in, which are "based on the physical size of the screen" (see documentation).
B. Maybe set it programmatically. That is, calculate how many px/etc. you need on each device so that it looks the same (mm) on all of them.
float px = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_MM, 1, getResources().getDisplayMetrics());
Finally, I am not sure if this is the case, but as other users sugest, maybe this could help. Once again, however, I am not entirely sure if this is what you need. On the same line, you can also define sizes depending on the details of the device with qualificators (refer here).
You need manage different dimens file for different resolutions , please check this link , You just need to put your padings parameter in dimens and then use from dimens.
How to define dimens.xml for every different screen size in android?
Like the answer said in here
on API 21 padding doesn't work via XML, you can define programmatically like the link i share above
but you can try create style="#style/RootLayoutWithPadding" use this in your view
and inside styles.xml add this
<style name="RootLayoutWithPadding">
<item name="android:paddingLeft">#dimen/activity_horizontal_margin</item>
<item name="android:paddingTop">#dimen/activity_vertical_margin</item>
<item name="android:paddingRight">#dimen/activity_horizontal_margin</item>
<item name="android:paddingBottom">#dimen/activity_vertical_margin</item>
</style>
for every padding you can fill the sizes you want inside values.xml
i hope it help you :)

ActionBarSherlock Item Icon strange width with Android 4.3

I`m developing an App using ActionBarSherlock
One of the items in the menu is a rectangular image. See it`s xml:
<item
android:id="#+id/kapturar_action"
android:showAsAction="always"
android:icon="#drawable/camera_action_icon"
android:title="#string/kapturar" />
<item
So far so good.
The problem is that the SDK 4.3 appears to accept only square images (This is my supposition, i`m not sure of that) and the icon shows in a strange fashion preserving what appears to be a "max width" property.
See the printscreens
Android 2.2 - Simulator:
Android 4.1.2 - Samsung Galaxy S3 Mini:
Android 4.3 - Nexus 4:
I double checked the drawables and I think that everything is right. I have defined the MDPI, HDPI and XHDPI images.
Can anybody affirm that is impossible to use rectangular drawables in the menu`s item? Is there a way to fix the problem in the Android 4.3 preserving the backward-compatible?
Action Bar Sherlock is now deprecated as Google released their own Action Bar compatibility library.
I strongly recommend to switch to that official library, I guess/hope your problem won't appear there.
You can simply use compatibility version of ActionBar. This is not very good answer but it will help you.
To make it just comment line
registerImplementation(ActionBarSherlockNative.class);
In ActionBarSherlock class.
Moreover after this you can edit sources, resources in ActionBarSherlock and they will look the same on Android 2.3 and Android 4.0+ devices.
Try to put your drawable into another folder. I mean if it is in drawable-xhdpi folder put it to drawable-hdpi (or other).
Sometimes it solves the problem with resizing images from resources

Android: Unwanted left/right margins on Nexus 10 in landscape mode

I'm having an issue with seemingly inexplicable margins that appear on the left and right sides of my layouts when using a Nexus 10 device in landscape mode.
I'm sure it's something embarrassingly straightforward, but I can't find any mention of this when searching around.
I'm pretty sure it's not related to my code, because the default Hello World project created by Eclipse exhibits the phenomenon. The following screenshot excerpts are taken from a brand new project and the only change I have made is to make the TextView textSize a bit bigger for clarity:
You can see that the default margins from the layout XML file (shown below) are applied correctly in portrait mode, but there is a considerable additional margin applied in landscape mode - indicated by the red bar underneath the screenshot.
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>
Has anyone else seen this or have any idea how I can get rid of them? I don't really know where to start, because it seems to be specific this one device and screen orientation. Plus it affects the simplest program possible, as well as my own, so there's no sense in pulling apart my own code until I find out how to fix the default case.
The same screens display correctly on emulated devices and my Samsung Galaxy S2 (running Gingerbread). Changing the Project Build Target from API level 17 to 10 didn't alter the unwanted effect either. Any thoughts?
Ok, so it was embarrassingly straightforward! The margin for the Nexus 10 in landscape mode is taken from the 'values-sw720dp-land' resource folder, which declares a much larger value:
<!--
Customize dimensions originally defined in res/values/dimens.xml (such as
screen margins) for sw720dp devices (e.g. 10" tablets) in landscape here.
-->
<dimen name="activity_horizontal_margin">128dp</dimen>
After nearly a year of lurking on SO and finding answers to all my questions, the first one I finally decide to ask properly turns out to be as trivial as this...
Thanks, danj1974! You saved much time for me! I changed a setting in res/values-w820dp/dimens.xml to
<dimen name="activity_horizontal_margin">0dp</dimen>
and it works good.

making fonts get larger on larger screens

I have searched Stackoverflow and google and what I find is answers for people who want fonts to remain the same size but I want them to get bigger when the screen gets bigger.
Specifically, I want very large fonts in my application. On my phone, they are 1/2 inch high - perfect. My problem is that on my 7 inch tablet they are also 1/2 inch high and I want them to scale up and be about 1 inch high. I have tried sp and dp modes and both just keep the fonts the same physical height, which is not what I want. I see there is something new for tablets with 3.2 and higher but I want to support devices from 2.3 and higher. I have seen complex code that says it auto scales fonts to fit the text in a width but that is not what I need. I want the fonts to be the equivalent of say 100sp on a phone and 200sp on the tablet. I have no graphics and simple relative layouts with very few elements on the screen. I just need to make a couple of the textsizes larger for large screens. I would think it would be simple but I can't find it.
Here is a typical text view entry
<TextView
android:id="#+id/textDistance"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/labelDistance"
android:layout_centerHorizontal="true"
android:text=""
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#ffffff"
android:textSize="100sp" />
Is there a relatively simple straight forward way to do this?
'dp' or 'dip' dimensions - specially made for been the same on different screens. So, there is not any special dimension for you task.
For implementing different text sizes you have to create several styles, and put them in folders values-xlarge, values-large, values-normal and values-small.
One style will looks like this:
<style name="BigTextStyle">
<item name="android:textSize">50dp</item> <!-- different values in different folders -->
</style>
And in your text view just provide style reference:
<TextView
style="#style/BigTextStyle"
...
/>
I went with the method Here: http://developer.android.com/guide/topics/resources/more-resources.html#Dimension and added one line to the dimens.xls files:
<resources>
<dimen name="padding_small">8dp</dimen>
<dimen name="padding_medium">16dp</dimen>
<dimen name="padding_large">16dp</dimen>
<dimen name="font_size">200sp</dimen>
The above is the file in views-large. In the views file I have 100sp instead of 200sp.
Now the font is large on my tablet. According to the documentation, this may be a problem with some of the new phones, the 5 inch ones and that is why there is some way to deal with this in the newer versions of Android but as I want this to work on older phones and 7 inch tablets, this will solve my problem. The solution above, which led me to this, would also work I am sure, I just went with this as it seemed simpler and was pretty well documented by Google.
In my layout file, I just changed the specific callout of font size to this:
<TextView
android:id="#+id/textDistance"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/labelDistance"
android:layout_centerHorizontal="true"
android:text=""
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#ffffff"
android:textSize="#dimen/font_size" />

Custom HDPI controls are invisible

I have an app, which provides a switchable set of night mode (red) controls using a custom Theme. The controls are in the Shared Preferences view. I have copied and colored all of the necessary images for my controls from Android git sources' hdpi and mdpi folders. The red theme works perfectly fine on the 160 dpi screen (480x800 Android 3.2), but on the 240 dpi one (480x854 Android 2.1) custom check boxes and radios are invisible, they do not occupy any space on the line with label either. Though the drop down list control on a simple linear view seems to be shown perfectly fine. The only difference I can see is that the later one has .9.png images.
What is wrong and how to fix that?
HURRAY! Found the solution by an accident. I have added a hidden checkbox item to one of the first views of my application, and all of the styled checkboxes magically appeared as they should be in every other view! I believe it's a bug in the 2.1 version of Android. I saw something like that mentioned once while googling for the problem here. It might be irrelevant though.

Categories

Resources