iOS Question App with custom font - can a webview use it?

Sandman

Sandman

Expert
Licensed User
Longtime User
So I have an app with a custom font. In this app I use a webview. I thought I could specify the custom font in the html and use it that way. But I'm not having much luck.

Before I investigate further, I just wanted to quickly ask the forum: Is this something that I should expect to work, or are webviews "sandboxed" and can't use the custom font because it's not installed system-wide in the iPhone, or something like that?
 
Solution
Erel
1675837299478.png

B4X: 
Dim FontFile As String = "vermidirouge 1.0.ttf"
Dim s As String = $"
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0" />
<style>
@font-face
{
    Font-family: 'VermidiRouge';
    src: local('VermidiRouge'),url('${FontFile}') format('opentype');
}
</style>
</head>
<body>

<h1 style="font-family:VermidiRouge">This label uses a custom Font and it is inside WebView</h1>

</body>
</html>

"$
File.WriteString(xui.DefaultFolder, "test.html", s)
If File.Exists(xui.DefaultFolder, FontFile) = False Then
    File.Copy(File.DirAssets, FontFile, xui.DefaultFolder, FontFile)
End If
WebView1.LoadUrl("file://" & File.Combine(xui.DefaultFolder, "test.html"))

You need to put the font file in the...
Sort by date Sort by votes
Erel

Erel

B4X founder
Staff member
Licensed User
Longtime User
1675837299478.png

B4X: 
Dim FontFile As String = "vermidirouge 1.0.ttf"
Dim s As String = $"
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0" />
<style>
@font-face
{
    Font-family: 'VermidiRouge';
    src: local('VermidiRouge'),url('${FontFile}') format('opentype');
}
</style>
</head>
<body>

<h1 style="font-family:VermidiRouge">This label uses a custom Font and it is inside WebView</h1>

</body>
</html>

"$
File.WriteString(xui.DefaultFolder, "test.html", s)
If File.Exists(xui.DefaultFolder, FontFile) = False Then
    File.Copy(File.DirAssets, FontFile, xui.DefaultFolder, FontFile)
End If
WebView1.LoadUrl("file://" & File.Combine(xui.DefaultFolder, "test.html"))

You need to put the font file in the assets folder.
 
Upvote 0
Solution

Sandman

Expert
Licensed User
Longtime User
Excellent, it was this part of the puzzle that I needed to get it to work. Thanks!
CSS: 
src: local('VermidiRouge'),url('${FontFile}') format('opentype');
 
Upvote 0
You must log in or register to reply here.

Similar Threads

  • Article
Android Code Snippet [B4X] Using custom fonts on labels and canvases
Replies
1
Views
1K
TILogistic
  • Question
iOS Question The custom Font in WebView1 does not work
Replies
17
Views
4K
Semen Matusovskiy
M
  • Question
iOS Question Custom Fonts Problem
Replies
6
Views
2K
Mike1970
M
  • Locked
  • Article
B4J Tutorial [B4X] Custom Views with Enhanced Designer Support
2 3
Replies
48
Views
57K
rwblinn
  • Article
iOS Tutorial Custom Fonts
2
Replies
21
Views
17K
JanPRO