61

アプリでカスタム フォントを使用しています。それらは bundle にコピーされ、appName-info.plist にハードコードされます。このフォントは、アプリ全体と UIWebView で完全に機能します。

私はhtmlStringをロード [webView loadHTMLString:htmlString baseURL:nil]; しています私はcssでwebViewでこのフォントを使用しています: fontFamily: fontName

しかし、WkWebView カスタム フォントを使用しようとすると、機能しません。WkWebView は、ランダムな既定のフォントを表示します。

ベース URL にメイン バンドル パスを指定し、css で font-face を使用してロードしようとしましたが、WkWebView にはまだランダムなフォントが表示されます。

WKWebView でカスタム フォントを機能させるにはどうすればよいですか?

4

5 に答える 5

56

私は同じ問題に直面しました。私の場合、base64 エンコーディングとGCDWebServerを使用せずに修正できました。

シナリオ：

  • WkWebView の読み込みは文字列 html を介して行われます
  • WkWebView はローカルの .css を使用しています
  • フォントはローカルであり、最上位プロジェクトに追加されます
  • フォントのエントリは、appName-info.plist のキーUIAppFonts/の下に提供されますFonts provided by application(注: WKWebView はこのキーを無視するため、このダンスを作成する必要がありますが、ネイティブ コントロールでフォントを使用できるように宣言することをお勧めします)。

解決：

次のように最上位の .css にフォント フェイスを追加します。

@font-face
{
    font-family: 'FontFamily';
    src: local('FontFamily'),url('FontFileName.otf') format('opentype');
}

デモプロジェクト:

GitHub プロジェクト リンク

注：新しいデモアプリの実行には2〜3秒かかる場合があります.UIWebViewと同じように動作する長いhtml文字列でテストしましたが、ラグはありません. 同じフォントは、UIWebView よりも WKWebView の方が少し小さく見える場合があります。

于 2016-02-24T20:08:22.950 に答える
42

ターゲット バンドルにコピーされるリソースとしてアプリケーションにフォントを埋め込むと仮定すると、NSURL をそのフォルダーに baseURL として渡すことで、WKWebView にフォントへのアクセスを与えることができます。

NSString *bundlePath = [[NSBundle mainBundle] bundlePath];
NSURL *bundleUrl = [NSURL fileURLWithPath:bundlePath];
[self.webView loadHTMLString:HTML baseURL:bundleUrl];

先行するパス要素なしで font-face url を定義します。これにより、WKWebKit が baseURL の前に追加されます。

<style>
  @font-face { font-family: 'Custom Font'; src: url('CustomFont.ttf'); }
  ...
</style>
于 2016-04-08T09:15:53.120 に答える
22

そのためだけに別のサードパーティを使用したくないので、そしてhtml文字列自体を構築しているので、フォントフェイスを使用する最初の部分を取り、リモートまたはローカルファイルへのURLを使用する代わりに、私はフォントを base64 に変換しました。

css は次のようになります。

@font-face {
    font-family: 'FONTFAMILY';
    src: url(data:font/ttf;base64,FONTBASE64) format('truetype');
}

FONTFAMILY を必要なファミリに置き換え、FONTBASE64 をフォントから生成された base 64 文字列に置き換えることができます。

アプリケーションでbase64文字列を作成する必要がある場合は、これを使用できます。ファイル名とタイプを指定するだけです(私は他のファイルを取得するために使用したので、より一般的です。ofTypeパラメーターを削除して@"ttf"を使用できます)代わりは）：

- (NSString*)getBase64FromFile:(NSString*)fileName ofType:(NSString*)type
{
    NSString * filePath = [[NSBundle mainBundle] pathForResource:fileName ofType:type];

    // Create NSData object
    NSData *nsdata = [NSData dataWithContentsOfFile:filePath];

    // Get NSString from NSData object in Base64
    NSString *base64Encoded = [nsdata base64EncodedStringWithOptions:0];

    return base64Encoded;
}

一度だけ実行してファイルに保存する場合は、次のように、ファイルを base64 に変換するオンライン Web サイトを使用できます。

于 2014-09-27T18:49:19.593 に答える