How to fix jagged edges of controls (buttons, autocomplete text)? - android

I am developing my first Android application. I have created a relativelayout with two buttons and one autocomplete text view. The three controls display correctly on the emulator. However, when I create the apk file and install it on my Samsung Galaxy 5, the buttons show jagged edges, and the top and bottom lines 'sink' a bit and the text view gets an appearance of rounded square brackets on either side with horizontal edges sunk by a half millimeter or so.
Any help in understanding what is happening and how to fix it is highly appreciated.

I'm guessing that Samsung is using their own theme in your app. You can override this theme by making one yourself.
This will help you: http://developer.android.com/guide/topics/ui/themes.html

I think I got the answer. It was perhaps because I had not defined Minimum SDK version and target SDK version in the manifest (uses-sdk node).
Adding the following two attributes to the uses-sdk node in manifest file solved the issue. I hope this is what was really necessary.
android:minSdkVersion="7"
android:targetSdkVersion="7"

Related

9 patch buttons with image android

I have downloaded Google and Facebook 9-patch button files and added them to my app.
It all seemed surprisingly straightforward, as it seemed to work just fine with just setting button background to the 9-patch file and setting some text. Here is the result:
The thing is, when I previewed my app on device with Android 4.0 and 4.4, this is the result:
What can be done, to make the buttons in Android 4 look like the ones in Android 5?
The reason for the buttons displaying wrong could be that the content area in the 9-patch file is wrong. You could try to open the files with the draw9patch tool, that is describe here. Then you can adjust the content area by adding to or removing from the black bars on the right and bottom.
Alternatively you could try adjusting the padding of your buttons
I have actually found a solution.
I used style="?android:attr/borderlessButtonStyle" to get rid of borders. For some reasons, it overriden the padding for buttons in version 4.
Once I changed it to style="#style/Widget.AppCompat.Button.Borderless" everything worked just fine.

Iconfont charachterspace collapses in Android (Fontastic)

I’ve used Fontastic.me to create an iconfont. It works great except in the native browser of Android 4.2.2 and 4.3 (eg: modern Samsung tablets).
In these browsers, the characters of the entire font have no width. This occurs with every font made with Fontastic.me (even the fonts it supplies itself). This is a major problem when centering the icons (horizontally).
I've set up a webpage to test it: http://ajuin2013.boondoggle.eu/fontastic-streamlineicons/icons-reference.html. The pink color shows the width of the character.
The following screenshot compares the normal behaviour with the AndroidBrowser-behaviour :
http://ajuin2013.boondoggle.eu/fontastic-streamlineicons/fontastic.png
I’m sure it’s because of the Fontastic, because when i use Icomoon as fontgenerator, the problem doesn’t occur. I've also notified the owner but he says he can't look into it because he doesn't now how to install an Android Emulator on his Mac.
Does anyone has a clue to what's happening here? What causes the character-space to collapse?
I had the same problem yesterday. I resolved it with a little bit of a work around. Like you said, when you want to center the icon with text-align:center; it ends up more to the right. If you put it to the left, it aligns left as intended. So I made the speudo element exactly the same width as the icon and centered the speudo element with margin: 0 auto; In that case you can leave the text-align to the left.
I know it's not the perfect solution, but for now it works for me and maybe also for you.
I had the same problem and resolved it by using icomoon.

Roboto inconsistent font height

I'm currently facing strange problems with Android's font Roboto. At first I had two TextViews in one horizontal LinearLayout, centered both vertically and horizontally. The first TextView was set font Roboto-Black.ttf and the second was Roboto-Light.ttf. Both was set to textSize="12sp", but the one with Roboto-Light.ttf was just a pixel higher then the Roboto-Black.ttf TextView. But it didn't happen when I've set textSize="13sp". So I've created new Android project, just to be sure it's not only in the one application. The result is almost identical, but in this case, textSize="12sp" works as expected but textSize="13sp" doesn't. I've made screenshots to show the issue.
12sp works as expected. Top edges align.
13sp has this strange behavior.
Strange is, that this happens only when I try to mix thin and thick lined variants. When I make one TextView Roboto-Bold.ttf and second Roboto-Black.ttf, result is good. When I try Roboto-Light.ttf and Roboto-Thin.ttf, it also work properly.
So I also tried to test this in photoshop and this is what I found:
It's the same for all fonts from Roboto family, except for the Roboto-Light.ttf. I can also post source code for the layout if needed.
Thanks in advance.
PS: I'm sorry for the links but due to low reputation (brand new account) I can't post images. Also in the last link i had to remove the "h" from "http", because it didn't allow me more than two links.
I can't tell you if its the fonts or how your phone interprets the fonts and displays them on the screen but I can tell you that I've had issues with centering views in the middle before.
Have you tried using a relativelayout and then align the second textviews top and bot with the first textview? That might solve the problem.

Is it possible to style the android fonts styles with leading and tracking?

Is it possible to have the followings in android font styling.
Leading (the space vertically between lines of text - name comes from the physical piece of lead that used to be used in mechanical printing process to separate lines of text).
Tracking (the horizontal space between each character).
If you have any ideas please share with me.
You can change leading by calling TextView's method setLineSpacing() or changing corresponding XML attributes of TextView in layout (android:lineSpacingExtra or android:lineSpacingMultiplier).
As answered here:
AFAIK, you cannot adjust kerning in TextView. You may be able to adjust kerning if you draw the text on the Canvas yourself using the 2D graphics APIs.
Update: since API 21 there is an option to set kerning/tracking/letter spacing. You can call method setLetterSpacing() or set it in XML with attribute letterSpacing.
For Tracking, check out this answer. It works fine for me.

Distorted buttons and edittexts

I have an issue with the rendering of some views (buttons and edittext) which edges are distorted (the left and right edges appear 1 px below the body of the control). Controls on my device behave like that, but not on the emulator. Does anyone know the reason of this?
Maybe take a look too to this : http://developer.android.com/guide/practices/screens_support.html
Maybe you have a density issue or something like that.
When setting the layouts, are you adjusting them to the appropriate 'fills'?
WRAP_CONTENT, FILL_PARENT. The views you are creating will need to be set so they appear correctly within the layout.
Posting some code for us to look at will help us better help you.
I got the same problem. I solved it by changing the skin built in to HVGA.
procedure is as follows:
In Eclipse SDK go to Window--> Android SDK and AVD Manager-->Virtual devices....
select your Android Virtual Device....
click on Edit...
change Skin Buil-in to HVGA..
and Click on Edit AVD...
If u r already using HVGA go for Higher version..
I changed it from QVGA to HVGA...
I hope this is on alternative to solve the problem on emulator.

Categories

Resources