Font tùy chỉnh trong Flow & Paywall Builder
Khi xây dựng flow, bạn có thể muốn dùng font tùy chỉnh để phù hợp với phần còn lại của ứng dụng. Dưới đây là cách thêm font tùy chỉnh và sử dụng chúng trong flow của bạn.
Tất cả các flow trong một ứng dụng đều dùng chung font bạn tải lên. Điều này bao gồm cả các flow bạn sao chép. Các ứng dụng khác trong tài khoản Adapty của bạn cần tải lên font riêng.
Cấu hình phông chữ trong bảng Styles trước khi bạn bắt đầu thiết kế flow. Như vậy, mọi thay đổi bạn thực hiện sẽ được áp dụng toàn cục.
Font tích hợp sẵn
Khi bạn tạo một flow trong Builder, Adapty sử dụng font hệ thống theo mặc định. Thông thường là SF Pro trên iOS và Roboto trên Android, mặc dù có thể khác nhau tùy theo thiết bị. Bạn cũng có thể chọn từ các font phổ biến như Arial, Times New Roman, Courier New, Georgia và Helvetica. Mỗi font trong số này đi kèm với một vài tùy chọn kiểu chữ.
Các font chữ này không được cung cấp kèm theo Adapty SDK và chỉ được sử dụng cho mục đích xem trước. Chúng tôi không thể đảm bảo chúng sẽ hoạt động hoàn hảo trên mọi thiết bị. Tuy nhiên, qua quá trình kiểm thử, các font này thường được hầu hết thiết bị nhận dạng mà không cần bạn thực hiện thêm bất kỳ thao tác nào. Bạn cũng có thể xem danh sách các font có sẵn theo mặc định trên iOS.
Thêm font chữ tùy chỉnh
Tệp bạn tải lên chỉ dùng để xem trước trong trình chỉnh sửa — Adapty không đẩy tệp này xuống thiết bị của người dùng. Để hiển thị font chữ trên thiết bị, hãy đưa tệp vào app bundle của bạn. Nếu không có tệp này, SDK sẽ tự động dùng SF Pro (iOS) hoặc Roboto (Android) khi chạy.
Nếu bạn cần dùng font chữ khác ngoài font mặc định của hệ thống, bạn có thể thêm font chữ tùy chỉnh.
Để thêm font chữ tùy chỉnh:
- Chọn Upload new font trong bất kỳ menu thả xuống font chữ nào.
-
Trong cửa sổ Add custom font, kéo và thả các file font hoặc nhấp vào Select files:
- Định dạng hỗ trợ:
.ttfvà.otf. - Variable fonts: Adapty tạo một face riêng cho mỗi named style trong file, chẳng hạn như Regular hay Bold.
- Nhiều typeface cùng lúc: Thêm tất cả font của bạn trong một lần tải lên. Adapty đọc tên family được lưu trong mỗi file và nhóm các file thành các family. Ví dụ: 10 file của 2 typeface sẽ trở thành 2 font family, mỗi family có 5 face.
- Family đã tồn tại: Một file có cùng tên family với font bạn đã tải lên trước đó sẽ được thêm vào font đó như một face mới.
- Định dạng hỗ trợ:
-
Nhấp vào Add fonts. Adapty tải lên các tệp và hiển thị một thẻ cho mỗi họ font. Để đổi tên họ font, nhấp vào biểu tượng bút chì bên cạnh tên.
-
Cấu hình thuộc tính của từng kiểu font riêng lẻ nếu cần:
- Font Family: Họ font mà kiểu dáng đó thuộc về — bạn có thể chuyển style sang một họ font khác.
- Font Face: Độ đậm và kiểu dáng của font — được tự động nhận diện khi tải lên.
- iOS font name và Android font name: Tên của font trong ứng dụng của bạn. Chúng phải khớp với bundle ứng dụng của bạn.
Bằng cách tải file font lên Adapty, bạn xác nhận rằng bạn có quyền sử dụng nó trong ứng dụng của mình.
Quản lý phông chữ tùy chỉnh
Nhấp vào Edit custom font để mở màn hình chỉnh sửa thuộc tính.
- Để đổi tên bộ phông, hãy chỉnh sửa Font family name in Builder.
- Để thêm độ đậm hoặc kiểu chữ mới, nhấp vào Add font face.
- Để sửa tên phông iOS hoặc Android của một kiểu, nhấp vào hàng tương ứng.
- Để tải lên tệp mới cho một kiểu, nhấp vào hàng đó, rồi nhấp Replace.
Xóa font chữ tùy chỉnh
Để xóa một font family hoặc một font face đơn lẻ, nhấn Delete font family hoặc Delete font face trong màn hình chỉnh sửa thuộc tính.
Nếu bất kỳ flow nào của bạn đang sử dụng font face đó, Adapty không thể xóa ngay lập tức. Thay vào đó, bạn sẽ được yêu cầu chọn một font thay thế từ thư viện của mình. Các thành phần đang dùng font face cũ sẽ chuyển sang dùng font mới. Nhấn Replace & delete để xác nhận quyết định của bạn.
Phông chữ tùy chỉnh trong các mẫu flow
Thư viện mẫu flow bao gồm các mẫu có phông chữ tùy chỉnh. Di chuột qua chip Custom font trên thẻ mẫu để xem mẫu đó sử dụng những phông chữ nào.
Adapty không đính kèm sẵn các phông chữ này. Bạn cần tự tìm nguồn phông chữ, khớp với tên phông được hiển thị trong chip. Một số phông chữ có thể yêu cầu giấy phép thương mại.
Sau khi có file phông chữ, hãy làm theo các bước đóng gói bên dưới.
Thêm file font vào bundle của ứng dụng
Adapty không gửi font tùy chỉnh đến thiết bị của người dùng, vì vậy ứng dụng của bạn phải bao gồm file của mọi kiểu chữ mà flow của bạn sử dụng. Nếu ứng dụng đã dùng font tùy chỉnh, hãy thêm chúng theo cách tương tự. Nếu chưa, hãy làm theo hướng dẫn theo nền tảng:
- iOS: Thêm font tùy chỉnh vào ứng dụng của bạn
- Android: Fonts in XML
Flow tìm từng font trong ứng dụng của bạn theo tên, vì vậy tên trong Adapty phải khớp với ứng dụng của bạn. Để xem lại các tên, mở style trong cài đặt font:
- iOS font name: Tên PostScript được lưu trong file font. iOS tìm font bằng tên này, không phải tên file. Tên này phải là duy nhất trong tất cả các font tùy chỉnh trong ứng dụng. Adapty tự điền khi file khai báo tên này. Các file font biến thể thường không có, nên bạn cần tự nhập. Để tìm tên này, mở Font Book > PostScript name, hoặc dùng
UIFontAPI. - Android font name: Tên file trong
res/font/, không bao gồm phần mở rộng. Chỉ dùng chữ thường, số và dấu gạch dưới. Adapty không bao giờ tự điền tên này. Tất cả các kiểu chữ mà Adapty tạo ra từ một file font biến thể đều dùng chung tên này.