I am using Font Awesome, which was designed for use with Twitter Bootsrap.
The Android (version 2.1) browser on the Galaxy S (Model # GT-I9000M) phone does not display the icons. It shows them as vertical rectangles, similar to what you see here:
Does anybody know a fix to this problem?
Here is the across the board support for #font-face: http://caniuse.com/fontface
2.1 browser simply doesn't support it, and it's not properly supported until 4.0. 2.2-3 partial support refers to the use of local(), which isn't supported at all. Font will not work at all on the stock Android browser if you are trying to source local fonts or using it to force user to download yours (smiley face hack).
Edit: How to know if a font (#font-face) has already been loaded? You can use this jQuery plugin to detect if Font-Awesome has loaded. If it hasn't (either due to bad font file or due to lack of support by the phone) then you can add a class which adds a background image (of the icon) to the div/span/whatever (can't be the <i> tag) that the icon has been applied to.
You can see a demo here.
Related
I have recently added a custom font to my Android project in Android Studio (following these instructions). This is not a regular font to show text but a custom font containing a large number of icons which are used all over my app.
This works fine. However now some users reported the problem, that on their devices only some icons can be used, while many other icons are shown as characters instead. All users have in common, that they have configured a custom font/theme in their device settings which seems override the app styles. Thus instead of my icon font the app now uses the device font which of course does not include my custom icons...
As far as I found out this option is not a native Android feature but is implemented independently by different devices manufactures. Since I have no such a device, I cannot reproduce or test this problem.
Is there any way to skip these device settings and force the app use my custom font?
EDIT:
This is how I added the custom font to my project:
Created a new fonts folder in res/ and put my font files there
Use android:fontFamily="#font/my_custom_font" on TextViews, etc.
done
This is then overwritten by the system settings on some devices (e.g. by the Huawei Design Manager). Can this be avoided?
Put your font in the res/font folder and reference them in your TextView in case you need a specific one with the android:fontFamily attribute.
For the whole app put
<item name="android:fontFamily">#font/your_font_name</item>
In
styles.xml
Source : Youtube Video
I formatted my pc, download the newest flutter SDK and surprised that last thing before I formatted my pc that there was a log_out and video_settings Icons, but after, it gives me error, and what made me confused that I found video_settings icon in material icons page !!. so, any ideas why I can't use it in my app ?
If you upgraded your version of flutter and there is an error, it means that those icons are no longer supported.
You will have to use another icon library. Take a look at font awesome, it provides a large range of icons ranging from barcodes to video. It's available for free on pubspec.
https://pub.dev/packages/font_awesome_flutter
We developed an application in IOS using 'apple-system-font' and we loved this font so we want to use the same font for all TextViews in the android application.
So Is there any way to use 'apple-system-font' in the android application like the following:
<TextView
...
android:fontFamily="-apple-system-font" />
Latest iOS uses 'Helvetica Neue' as system font. You need to download the font file and then add it in your assets. This process is explained in this StackOverflow question.
Note that Apple may choose to change this font over time. Also, even though the font is highly legible and crisp, the users on an Android device may not be used to seeing it. this may result in a 'different' experience for them. Make sure you do proper user testing before adding the feature in production app.
there is app that made before android 4.0 came, that use webview to show some text(arabic) we use Almohanad.ttf font but now when we test on 4.x it is font not working as before(3.x)and it is only apply the font on some words, tried with different font, and it working for some but other has same problem .
please guys if any one want me to send him zip file for the part of the project that can be test easily by him, please give me your mail
We're developing a hybrid app for Android and iOS and are using html+css to style the app. There is however one problem that we can't fix right now:
Since we want support for Android 2.3-4.2 and iOS 5.1-6.1 we try to use 'position:fixed' for the fixed header and footer. To be able to use the nice 'glow' on the tabs in the footer, we use webkit-mask-image and a gradiated background. This works well on iOS and Android 4+ but not on Android 2.3.
Also, if we remove all the 'fixed' elements on the page, the icons show up on 2.3.
It seems much similar to this question: http://www.sencha.com/forum/archive/index.php/t-192463.html?s=9b3768697b19cd9957d1c0ee2b7fe6da but we do use a z-index for the div's and this problem tagets Android 4.0.3 and did work on Android 2.3. Sencha however doesn't seem to use 'position:fixed' for header and footer.
Anyone have a suggestion on how to tackle this problem?
I had the same problem with SVG icons, and I found that Android <2.3 does not support SVG (using the default browser).
This article describes a solution (i.e. workaround) using canvg.js to render the SVG with a canvas.