CODEWITHSUNDEEP
jqueryjquery-mobilecordova
rpelluru
rpelluru

Reputation: 231

Font is not rendering properly for Phonegap iOS app

When we render our template screen using safari browser on iPhone4 (retina display) screen , UI is displayed with out any issues. I ported same template code as a Phonegap iOS app. After porting UI fonts are increased in phonegap native app. I used below viewport meta tag in my code :

<meta name="viewport" content="width=device-width,initial-scale=0.5 maximum-scale=0.5; user-scalable=0;">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta content='True' name='HandheldFriendly' />

Can some one explain me why font sizes are rendered properly in safari browser but not in Phonegap iOS app ?

Upvotes: 1

Views: 928

Answers (3)

rpelluru
rpelluru

Reputation: 231

I found root cause of my issue, it's because of "EnableViewPortScale" value in cordova.plist file. We should set this value to 'YES', but in my project setting it was 'No'.

Setting this value to 'YES' resolved my issue.

Upvotes: 1

imaginethepoet
imaginethepoet

Reputation: 864

I believe mobile safari uses .svg for font renderings. So if you are using a non-standard font that might be one place to look.

Upvotes: 0

Samuli Hakoniemi
Samuli Hakoniemi

Reputation: 19049

You could try -webkit-text-size-adjust and set it too 100%.

Another thing causing this may be that you're having -webkit-transform set to the container when it's in hw accelerated mode and font's get bit blurry.

Upvotes: 0

Related Questions