Problem Description
Custom fonts are not working on MobileWeb, But works well on Android and IOS.
Steps to reproduce
1. Create new mobile project (classic titanium)
2. Add this code:
var win = Ti.UI.createWindow({
backgroundColor: 'white',
layout: 'vertical',
title: 'Label Demo'
});
var label1 = Ti.UI.createLabel({
color: '#900',
font: { fontFamily: "ShadowsintoLight", fontSize:48 },
text: 'A simple label',
textAlign: Ti.UI.TEXT_ALIGNMENT_CENTER,
top: 30,
width: Ti.UI.SIZE, height: Ti.UI.SIZE
});
var label2 = Ti.UI.createLabel({
color:'blue',
font: {
fontFamily: "ShadowsintoLight",
fontSize: 14
},
text: 'A long label with\na few line breaks\nand unicode (UTF8)\nsymbols such as\na white chess piece \u2655\nand the euro symbol \u20ac\nlooks like this!\n',
textAlign: Ti.UI.TEXT_ALIGNMENT_LEFT,
top: 30,
width: 300, height: 200
});
win.add(label1);
win.add(label2);
win.open();
3. Create a fonts directory inside Resources
4. copy the attached font to the fonts directory.
5. Select 3.4.1.GA as the Mobile SDK
6. Run in mobile web
Actual Results
The custom fonts are not show.
Expected results
The custom fonts should appear, as used to happen with Mobile SDK 3.2.3.
Extra info
I tested this and the last known working version is Mobile SDK 3.2.3.GA
Master pull request: https://github.com/appcelerator/titanium_mobile/pull/6759 4_0_X pull request: https://github.com/appcelerator/titanium_mobile/pull/6760 To test, create a Mobile Web app. Inside the "Resources" directory, create a "fonts" directory. Drop in a "woff" and "ttf" font. Give them the same filename. Set the fontFamily on a Ti.UI.Label and build!
PR merged.
Verified the fix. Custom fonts are displayed successfully on mobile web. Closing. Environment: Appc Studio : 4.1.0.201505071004 Ti SDK : 4.1.0.v20150604094312 CLI : 4.0.2-rc2 Alloy : 1.6.0 MAC Yosemite : 10.10.3 Appc npm : 4.0.0 Appc CLI : 4.0.1 Node: v0.10.37 Nexus 5 - Android 5.1.1