[FIXED-266] Text is jagged in landscape view on iPad/iPhone

[jep]

Sencha Touch version tested:

0.9.4



only default ext-all.css
live kitchen sink demo: http://dev.sencha.com/deploy/touch/examples/kitchensink/

Platform tested against:

iOS 3.x
iOS 4

Description:

Text appears jagged on both the iPhone 3G (iOS 4.0.1) and iPad (iOS 3.2) when you switch to landscape view.

Test Case:



Go to the live Kitchen Sink demo, click on User Interface
Look at the text along the left side of the screen, especially "List" and "Nested List"
Swap between portrait and landscape orientation.
Note the chunkiness/jagginess/glitchiness of the text in landscape, especially the Ls, ds and ts.
Notice also that the Back button is blurrier, as well as the "User Interface" title.
Click on the "Buttons" item.
Note that the button text is less clear in horizontal mode.

Screenshot or Video:

22307 22308

Further screenshots from iPad (too large to attach):
http://img10.imageshack.us/img10/2038/senchaipad1.png
http://img96.imageshack.us/img96/3500/senchaipad2.png
http://img814.imageshack.us/img814/8261/senchaipad3.png
http://img59.imageshack.us/img59/636/senchaipad4.png
http://img443.imageshack.us/img443/5559/senchaipad5.png

This issue is also discussed here:
http://www.sencha.com/forum/showthread.php?103166-iPHone-horizontal-view-and-Fonts

[Jamie Avins]

Thank you for the report, we're checking into the issue.

[aconran]

This is fixed in the 0.95 release for Monday.

[jep]

Thanks for the quick turnaround! Now I just gotta get MY code working so I can convince my boss to give you guys some money. :D

[jep]

This says it's fixed in 0.9.5, but I still get the exact same problem in the live 0.9.5 kitchen sink demo. I can post more screenshots, but it's the same problem.

[jep]

For reference, here are the before (0.9.4) and after (0.9.5) screenshots with the same iPhone:

22534

22536

Note there are SOME differences. The content font size is somewhat smaller. The header has been changed to a lighter gray.

But the text is still glitchy. Plus, a new feature is that the Back button now has a glitch on the top and bottom left corners where they attach to the arrow.

Edit: The glitchy Back button part of my post actually only occurs on the iPad. I've spun it off into another post.

[davidkaneda]

Interesting... Could you send the iOS details for the screenshots above? Do you notice a landscape text improvement on the iPad? Mine looks much better in .95 on both:

http://cl.ly/b3315861bc38b10bc896/content

[jep]

It's an iPhone 3G running 4.0.1. As you can see, I'm on T-mobile so I need to have it jailbroken/unlocked. I haven't upgraded to 4.1 yet due to their being no unlock yet. And sweet criminy, it's SLOW.

I wonder, did you change from 4.0.x to 4.1 right before you fixed the problem? I wonder if it was a change in Safari that actually fixed it for you.

The landscape text still has the exact same problem on the iPad. It's running 3.2, but I'm just about to update it to 3.2.2 momentarily. I will let you know how that changes anything, if at all. If you need any further info, just let me know and I'll post it ASAP.

[jep]

Nope, looks like the landscape problem is still there in 3.2.2 on the iPad.

[jep]

Appears to have been fixed in 0.96. Good work, guys.

[jeffcrilly]

(not fixed in 0.97?)
I just started putting together my first sencha touch app... am using 0.97 and noticed some portrait/landscape font issues on iphone 3.1.3... Note: ipad does not have this issue.

Here's an image that is from dev.sencha.com - the kitchen sink app, and then select the "bottom" tabs demo.
(actually, all the demos do this.)

Portrait looks fine. Landscape looks like this...

http://www.pbase.com/jeffcrilly/image/129802555/original.jpg

Notice the fonts are all outlined.. the bottom toolbar text is washed out.

Here's the portrait version...
http://www.pbase.com/jeffcrilly/image/129803262/original.jpg

thx

jeff