Corrupted font rendering in P3D/OPENGL

[wit221]

I have posted about the issue in the forum but did not receive any response.
Here are some previews of the issue received from different people:

http://imgur.com/a/3PQP8
http://imgur.com/a/eL6eM
http://imgur.com/3lrVQ1l
https://imgur.com/a/8iVjy
http://imgur.com/5NN6rNm

The way I implement text rendering is the following:

fontLarge = createFont("Caviar_Dreams_Bold.ttf",(int)8*displayWidth/100, true);
textFont(fontLarge);

where 8*displayWidth/100 is the maximum font size in the application.
I then use textSize() to resize that font depending on the size it should have and use both the three arguments and the 5 arguments text() method.

The issue appears on some devices, on some not. The general trend I observed is that the issue appears on high pixel density devices but not on lower ones. It is only a general observation, since the font problem does not appear on, for instance, the s6 edge, which has the same density and resolution as the N6P, which does have the issue. The bug seems to be independent of the android version and locale.

I have tried switching from P3D to OPENGL, to no avail. I have tried, isntead of using createFont(), to create fonts in the Processing IDE and then importing them to the assets folder and using loadFont(), to no avail. I have tried to change the font numerous times, to no avail.

The only differences I see every time I implement a change is that a different set of letters is not displayed properly. As a matter of fact, when I changed the font and decreased the size considerably when I create the font, only signs (such as "!", ",",".") appear.

In some devices, the bug appears in a different way: instead of fully showing some letters and not showing others at all, letters overlap:

http://imgur.com/2aZIyE6

The longer the application runs, the more corrupted the font is:

http://imgur.com/Y8iBGKL

This suggests textSize() might be the culprit, since it is the only method I call besides text() that deals with font rendering.

At a given time, if a glyph is bugged, it is bugged in the same way on the entire screen. For instance, if "p" is displayed as an overlay of "&" and "r", then all "p"s on the screen will be displayed as an overlay of "&" and "r".

Is it an error in my implementation or a bug?

[codeanticode]

Does this happen only with the largest font size, 8*displayWidth/100, or with smaller sizes too?

I just pushed a new release of the mode, RC1, can you take check if this problem still happens in this release?

[codeanticode]

@wit221 Did you have a chance to see if this still happens in RC1? Thanks!

[evshellshear]

Hi @codeanticode,

I think I have this issue too. I have tested RC1 and it did not help. You can test the game BugRope at https://play.google.com/store/apps/details?id=processing.test.bugrope&hl=en. I have a Nexus 5x Android 6.0.1 and in the beginning it seemed to cause a problem but the problem is now gone. However, someone who downloaded my game on a LG g4, h811, running rooted but stock 5.1, BUT with "modified dpi setting", has corrupted fonts. A friend of mine with a stock standard S7 has the problem too. Check out http://i.imgur.com/dd0Qdaz.png for an example of the font issue. Keen to know any fixes to solve this. I'd be happy to share my code with you if that helps.

Cheers,
Evan

Thanks for any help!

[codeanticode]

Ok, at least I can reproduce it (on a N5X), not yet sure about the cause though. My guess is that it is related to the logic that creates the textures needed to store the font's glyphs. Looking into it.

[evshellshear]

Awesome. At least you can reproduce it. I can't on my Nexus 5 anymore. It
used to happen but not anymore. I used to think it was a memory issue but I
doubt that nowadays.

Thanks!

Cheers,
Evan
On Apr 5, 2016 10:10 AM, "codeanticode" notifications@github.com wrote:

Ok, at least I can reproduce it (on a N5X), not yet sure about the cause
though. My guess is that it is related to the logic that creates the
textures needed to store the font's glyphs
https://github.com/processing/processing-android/blob/master/core/src/processing/opengl/FontTexture.java#L88
.

—
You are receiving this because you commented.
Reply to this email directly or view it on GitHub
#199 (comment)

[evshellshear]

@codeanticode thanks for that. Let me know when there is an update to the Android mode and I'll rebuild my game with it, post it on Google Play and get people to test it. Otherwise I can just send you the apk if you want.

Thanks for your help!

[codeanticode]

Try RC2 https://github.com/processing/processing-android/releases/tag/latest

However, font rendering issues might not be completely fixed. I noticed that some characters (backslash and k) are missing in the output of the following sketch:

String text = "";

void setup() {
  fullScreen(P2D);
  randomSeed(1);
  textFont(createFont("Arial", 80));
}

void draw() {
  background(0);
  fill(255);
  text(text, 0, 0, width, height);
  text += char(int(random(50, 127)));
}

void mousePressed() {
  if (looping) noLoop();
  else loop(); 
}

but this could have a different cause. Can you check if you see the same missing characters?

[evshellshear]

Awesome. Thanks for that. I don't actually see the issue on my phone so
I'll build an apk and send it to you if that's OK.

How do I actually install this RC2 to processing? Do I just need to unpack
it into the Processing directory and copy over the Android Mode folder?

Thanks again!

Cheers,
Evan

[codeanticode]

The new release should show up in the contribution manager, but this might take a while until the indexes are updated. In the meantime you can install RC2 manually by downloading the zip file, unpacking it, and moving the AndroidMode folder into the your sketchbook/modes folder.

[evshellshear]

Great. I did it and have now uploaded a new version to Google Play (a few hours ago so it should be available soon - look for version 2.36) which you can test if you want. It is at https://play.google.com/store/apps/details?id=processing.test.bugrope&hl=en. Let me know if there are still problems on your phone. If you don't have any problems I will start contacting other people who I know which had the problem and ask them to test it.

[evshellshear]

I'll post a comment when I see version 2.36 there.

[evshellshear]

@codeanticode It looks like version 2.36 is live now. If you want to give it a spin to see if it works and let me know what happens, I'd really appreciate that.

Thanks again!

[evshellshear]

Hi @codeanticode, a friend of mine just checked it the update had fixed the problem on his Samsung S7 and the problem was still there. The fonts still weren't displaying properly.

[evshellshear]

@codeanticode if you want, maybe you can point out the part of the processing code base which you believe is causing the issue I can also take a look at it and see if I can help (no guarantees :))

[codeanticode]

Sure, my guess is somewhere in here.

Could you post a screenshot of the text displaying incorrectly with RC2? Are the characters garbled, like it was reported originally by @Wit22, or simply missing?

Thanks!

[evshellshear]

I'm not sure but I will ask for a screenshot. It's 10:40pm here now so I'll ask my friend tomorrow to send me a screenshot and I'll post it tomorrow morning.

I'll start looking at the code now and see if I can come up with any solutions before I head off to bed and keep looking over the next couple of days.

[evshellshear]

@codeanticode, I hope comments like this aren't annoying but I was just looking at the code a bit and have a couple suggestions like the following (I'm doing also just to make sure I understand the code). In the function contextIsOutdated() you have the following code:
public boolean contextIsOutdated() { boolean outdated = false; for (int i = 0; i < textures.length; i++) { if (textures[i].contextIsOutdated()) { outdated = true; } } if (outdated) { for (int i = 0; i < textures.length; i++) { textures[i].dispose(); } } return outdated; }
could it be replaced by
int i = 0; while(!textures[i].contextIsOutdated()) ++i; if(i != textures.length){ for (int i = 0; i < textures.length; i++) { textures[i].dispose(); } } return i != textures.length;
?
If my understanding there is right, then I guess something which I may not be understanding properly is that you do bilinear sampling only in 3D mode but later in the code (e.g. addToTexture(pg, idx, glyph) and updateUV()) it seems that you treat all glyphs like they have been bilinearly sampled. Am I misunderstanding this?

Sorry if stuff like this is totally noob and a waste of your time! My first step is to try and understand the code a bit.

[evshellshear]

@codeanticode My friend who has a sony xperia Z1 sent me the attached photo. It is definitely an improvement. In the past the fonts were completely broken and corrupted (letters appearing ontop of each other, etc). Now it just seems letters are missing. I've attached the photo to this post.

[evshellshear]

This would point to somewhere in the code not rendering the textures when it should. My guess at the moment somewhere between line 300 and 330 maybe in addTexture(pg, idx, glyph) function? I still need to try and understand the code a bit more

[evshellshear]

I don't think it has anything to do with specific letters because the S in SCORE is visible but the S in CREDITS isn't

[evshellshear]

@codeanticode have you had any luck further narrowing down what the cause could be? I've had a bit of a further look but apart from my previous two suggestions, nothing else is popping out at me.

[evshellshear]

@codeanticode, I'm going to try and get my hands on a phone and try a few tricks to see if I can figure out a workaround e.g. rendering a text multiple times to see if that helps. If you come up with anything in the mean time let me know. Thanks again!

[evshellshear]

@codeanticode I see you've made some changes, let me know when there is a version to try and I'll give it a go and let you know if it worked.

[codeanticode]

I will push a new PR shortly.

[codeanticode]

I just uploaded RC3, give it a try and let me know if you still have font rendering issues.

[evshellshear]

@codeanticode Thanks for that. I'll integrate it into the code and upload it and get someone to try it who has a problematic device (probably tomorrow when I see them)

[evshellshear]

@codeanticode After running the new patch I just noticed one thing which I thought I would check with you. In commit 6ae45c9 you changed the fullscreen mode. Unfortunately, when I swipe in to get back the navigation buttons, they then don't disappear after a while. Unless this change needed to occur because of the font problem, in my opinion I'd prefer if it remained like it was in the past. Especially because I can put "android:theme="@android:style/Theme.NoTitleBar.Fullscreen" in my manifest if I want this behavior. However if I don't want this behavior it seems I am now stuck with your commit. What is your opinion? I can probably do a workaround to get back to the old behavior but just wanted to check.

Thanks again!

[evshellshear]

@codeanticode if my previous suggestion is not appropriate, how can I build only the AndroidMode.jar by cherrypicking your commits?

[evshellshear]

@codeanticode I can understand what you are doing on line 504 in PApplet.java, did you not also want View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY as well to get your desired behavior? Not totally sure. But I just see that the nav buttons won't go away (after swiping left) even after trying to mess with my manifest and a few other things.

[evshellshear]

@codeanticode by the way I run a nexus 5 with Android 6.0.1

[codeanticode]

I updated your app and now all the text renders correctly on my test device (N5X), so looks like this issue is finally solved. Please confirm.

Let's discuss the fullscreen behavior on a separate thread.

[evshellshear]

@codeanticode you legend! It now works on all devices I have. Thanks so much for that. I'll jump to the other thread for this issue