自定义字体未应用于 Nativescript 空白模板

Question

我尝试了一个nativescript项目一周了。我从 cli 创建了一个空白的 nativescript 模板并使用 VSCode 进行编码。

这是我使用的命令行。

tns create my-app-name --template tns-template-blank-ts

我发现了自定义字体的问题。我到处搜索我只是在应用程序文件夹中创建一个 "fonts" 文件夹，就像这样

/my-project/app/fonts

但是，由于从空白模板创建，模板已将 app 文件夹重新定位到 src 文件夹中，如下所示。

/my-project/src/app

当然，SourceRoot 文件夹已更改为"src" 文件夹。我将 "fonts" 文件夹放入 "src" 文件夹中。并将字体 "RSU" 放入 "fonts" 文件夹

接下来，我在文件"app.css".

中为字体写了css class

.rsu{
    font-family: 'RSU', 'RSU-Regular';
    font-size: 22;
}

并将 class 添加到 "home.component.html"

中的 Label 元素

<ActionBar class="action-bar">
    <Label class="action-bar-title" text="Home"></Label>
</ActionBar>

<GridLayout class="page">
    <!-- Add your page content here -->
    <label class="rsu" text="Hello World"></label>
</GridLayout>

所以，字体没有改变。我附上了这个问题的图片。

https://www.imgtrue.com/image/UIfgLE

https://www.imgtrue.com/image/UIfiKC

https://www.imgtrue.com/image/UIfTXV

Answer 1

试试这个代码

.rsu {
    font-family: 'RSU-Regular', 'RSU_Regular';
    font-size: 22;
}

Android 依赖于文件名，iOS 依赖于字体系列名称。因此建议使用字体名称重命名字体文件，或者将字体和文件名都用逗号分隔。

自定义字体未应用于 Nativescript 空白模板

Custom font is not applied to the Nativescript blank template

nativescript

angular2-nativescript