Nhảy tới nội dung

my.loadFontFace

Cập nhật lần cuối vào

my.loadFontFace là API để load 1 web font.

Khả dụng:Hỗ trợ từ version 1.89.5 trở lên.

Quét mã để trải nghiệm

Xem code mẫu trên Tini Studio

Demo

Lưu ý
  • Đường dẫn của font phải là đường dẫn có thể download được.
  • Trên ios chỉ support đường dẫn https
  • Chỉ support woff, otf, ttf, sfnt fonts.

API Params

Thuộc tínhKiểu dữ liệuBắt buộcMô tả
familystringTên font
sourcestringĐường dẫn của font
descStringThuộc tính của font
successFunctionCallback function khi load font thành công.
failFunctionCallback function khi việc load font bất thành.
completeFunctionCallback function khi gọi API hoàn tất bất kể thành công hay thất bại.

desc params

Thuộc tínhKiểu dữ liệuMô tả
stylestringStyle của font, mặc định là normal. Các giá trị normal/italic/oblique
weightstringFont weight, mặc định là normal. Các giá trị normal/bold/100/200../900
variantStringThiết lập việc có chuyển các "ký tự in thường" trong văn bản sang dạng "ký tự in hoa" hay không. Mặc định là normal. Các giá trị normal/small-caps/inherit.

Sample Code

index.txml
<view>
<block-header title="Usage" description="Load font face" />
<view class="block-content">
<button class="button-full" onTap="onLoadFontFace">Get Font Face</button>
<text class="test-font">Text after loaded font</text>
</view>
</view>
index.js
Page({
onLoadFontFace() {
my.loadFontFace({
family: 'Pacifico Regular',
source: "url('https://sungd.github.io/Pacifico.ttf')",
success: (res) => {
my.showAlert({ content: 'Font is load successful' });
},
fail: (res) => {
my.showAlert({ title: JSON.stringify(res) });
}
});
}
});