Why does Punjabi (Indian) appear as boxes on some smart devices?

Question

I released an application called Gurbani Ujagar . It seems to work on some smartphones like Samsung Galaxy S3 , but on other phones like Galaxy Nexus , Galaxy S and some tablets, words / characters look like fields or random punctuation. I have over 1000 HTML files that are viewed using WebView .

I am not sure how I can fix this problem so that the text is displayed accurately on all phones. I tested some other Punjabi apps on the Galaxy Nexus and Galaxy S , namely Dhur Ki Bani (this looks fine), but the Gurbani Ujagar displays as fields. I do not know why this is so. I tried editing the font in an HTML file.

Text appears on phones that were not displayed before editing, but some texts are still not displayed correctly.

Manually editing more than 1000 pages will be a lot of work. HTML files (not source code) are located in my resources folder. Can I edit all HTML files using Typeface ? It seems I can edit all of them at once in Xcode , but I'm not sure why.

Any help would be greatly appreciated. The following is an example of my code:

You can also view the HTML file here .

 public class MainActivity extends Activity { @SuppressLint("SetJavaScriptEnabled") @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); WebView webview = (WebView) findViewById(R.id.webView1); webview.loadUrl("file:///android_asset/3.html"); } } 

Answer 1

Characters are displayed as fields if the font you are using does not have glyphs for these characters (the font does not have these letters).

Some phones provide more fonts than others, and some phones may have fuller and newer versions of the font than others, which means that some phones will select a font and the font will contain the characters you use, while others versions of the same font on different phones or versions of Android may not be so complete and will not contain the characters that you use, so they will be displayed as boxes on these phones.

If you want to guarantee that your application will work and display all the text on all phones, find a free font on Google Webfonts or Font Squirrel with a license that allows you to integrate into the application, and then send this custom font with your application and use it in your HTML with CSS @font-face .