I possess two complementary fonts that are installed on my computer (Linux), and that are used to render every characters that the two fonts have.
I would have liked to use in the same way these fonts in Android. Unfortunately, I don't know how to do this (I know how to load one font).
I have tried to merge them with FontForge, but unfortunately I couldn't because the total number of glyphs is over 65535 glyphs (which is the limit of the sfnt format).
Is there a possibility to go over 65535 glyphs, so that the font can be used in Android?
If not, is there a way to use these fonts conjointly in Android in general, so that the characters not recognized by a font are recognized by the other (like my computer does)?
If not, is it possible to use two Typeface in a TextView, so that the characters not recognized by a font are recognized by the other?
I know that we can use Spannable to use different Typeface for different parts of the TextView, but that's not exactly my need here.
If not, is it possible to detect all the unrecognized characters of my TextView, so as to use the other font only for them?
Is it possible to use the CSS style "font-family" in a TextView, so as to provide an alternative font in the case the first fails for some characters?
Thanks to the direction given by JaiSoni, I have managed to find a way to solve my problem using HTML and CSS : I have used a WebView, and have declared the #font-face to define my fonts. Then, I have used them in the CSS attribute "font-family" like this :
<style type="text/css">
#font-face {font-family: MyFont; src: url("file:///android_asset/fonts/font.ttf")}
#font-face {font-family: MyFont2; src: url("file:///android_asset/fonts/font2.ttf")}
body {font-family: MyFont2, MyFont; }
</style>
Thank you very much.
Related
I have an HTML script that needs to be displayed inside of a webview in Android and in an UITextView in iOS. This script uses multiple fonts.
When declaring the fonts in Android I used the following script:
#font-face {
font-family: 'myfont';
src:url("file:///android_asset/fonts/myfont.ttf")
}
and it worked perfectly fine.
In ios, however, I was unable to find the correct solution for setting the source path for the fonts.
I tried the following:
src:url("myfont.ttf")
src:url("myfont.ttf")
src:url("file:///fonts/myfont.ttf")
src:url("file:myfont.ttf")
Do you know how it should be set for iOS
You need to mention the correct font family name and that's it. No need to specify the src. Just make sure to add it in your Info.plist file under key <key>UIAppFonts</key> like so:
<key>UIAppFonts</key>
<array>
<string>Lato-Black.ttf</string>
</array>
How to find font family name?
You might think that the font family name is the name of the file itself. But it is not. Have a look at the below screenshot
The file name is different but the font book shows something else. The title in the font book application is your font family name. To denote different weights of the font, use -Regular, -Bold, etc.
Then in your css you can directly use
span {
font-family: "MathJax_Math-Regular"
}
and your font should be applied
I imported a set of files for Galano Grotesque xxx.otf font (xxx=Alt Black, Alt Black Bold, etc), and it works like a charm on iOS but not on Android. When I run the app on Android the font is not loaded.
I'm using this:
Label {
font-family: "Galano Grotesque";
color: #5b5b5f;
}
I found this post - Android Not Showing Font Icon In NativeScript - and I tried this
Label {
font-family: "Galano Grotesque", galano grotesque;
color: #5b5b5f;
}
but without success :(
Does anybody knows what I can do to solve it?
Thanks
There is one primary consideration when working with fonts in iOS and Android.
For the font to work on iOS it should use the exact font name (notice that this is not the file name!) where in Android the font should be referenced with its particular file name.
Example:
Let's assume you are using the Galano Grotesque DEMO Bold font from here (this one is free for demonstration purposes)
When downloaded you will see that the file name is as follows
Rene Bieder - Galano Grotesque DEMO Bold.otf
But the font name is (in Mac open with FontBook app to see the font-name at the top of the pop-up.. for Windows open the font with Windows Font Viewer and look for font name)
Galano Grotesque DEMO
So to use it in iOS, you should use
font-family: "Galano Grotesque DEMO";
And for Android, you should use
font-family: "Rene Bieder - Galano Grotesque DEMO Bold";
Of course, the best practice is to see what is the actual font name and rename the file with the exact name so you can reuse it in both iOS and Android with no different CSS files.
All that said check your file name under Android and make sure that reference in the CSS file is the same
Okay, so I am creating this mobile website where I am trying to change the font-size and color of some text. Now, I have tested my code on my PC, iOS and Android (using Chrome browser) and only on the Android there seems to be a problem. When using an imported CSS document some settings will not change, but if I type then in directly into the element using the "style" attribute everything works.
Font
The font-size seems to have different levels as when I type in:
font-size: 31px;
it gives me this:
Hello
However if I were to change it to:
font-size: 30px;
the font size will now be like this:
Hello
Color
Also, the color on Android never seems to change as the color is always black. I have tried changing it to both other dark and bright colors without any success (note the colors are changing on both my PC and on iOS).
Override
I am thinking that there might be some sort of snippet of code which would override these default settings. If anyone of you have found one when importing CSS to a PHP/HTML doc or have any other solution it would gladly be appreciated!
your style is overwritten by some other CSS class or css styling use:
font-size: 30px !important;
thereby your styling will be applied over all other stylings thereby overwriting all predefined stylings
I have a simple line of text
<h4>This is just some placeholder junk</h4>
with the following CSS:
h4 {
font-size:20px;
color:#000000;
font-style:italic;
}
This is working in everything but the default browser on Android GS3.
I've tried wrapping the text in a span with font-style:italic;, as well as including <i> and <em> tags, but the font will not slant. Am I overlooking something simple here?
In terms of performance I would not recommend to use a custom font on mobile devices at all, unless there is really no other way. But this seems to be a problem caused by Samsung: https://code.google.com/p/chromium/issues/detail?id=169446#c11
So I think this is one of the rare situations where you should go with a custom font. Of course it should be a custom font that supports the italic font style. Don´t forget the font-styleproperty in the #font-face declaration.
#font-face {
...
font-style: italic, oblique;
}
I am trying to display phonetic symbols in a WebView, but so far I am only getting squares.
For instance, for the word "apostrophe", this should be displayed:
əˈpåstrəfi
but all I am getting on the display is:
□□påstr□fi
If it would help, I am getting the strings from an SQLite database. The string I retrieve has some HTML tags in it, so I use this:
webView.loadDataWithBaseURL("file:///android_asset/",
article, "text/html", Encoding.UTF_8.toString(), null);
where I have my CSS files in /assets. And the article variable contains some text enclosed in HTML tags.
I've resolved problem to display phonetic symbols in TextView. The problem is the default android fonts are not implement IPA symbols. I can advise to use ccs like this
#font-face {
/* Regular */
font-family: "ConstructiumRegular";
src: url("http://openfontlibrary.org/content/RebeccaRGB/412/Constructium.ttf") format("truetype");
font-weight: 400;
font-style: normal;
font-variant: normal;
font-stretch: normal;
}
In me case mentioned Constructium.ttf fits.
If you pick up a unicode font like Gentium,
and you make sure you can change your font with a utility like this, you should be good to go. I don't have an Android, so there may be issues surrounding types of fonts that can be installed. You may need to check into that, or the font install utility that I've cited may not work well for you. ymmv