---
title: "Пользовательские шрифты в устаревшем Paywall Builder"
description: "Улучшите устаревший Paywall Builder с помощью пользовательских шрифтов для лучшего визуального опыта."
---

:::note
Пользовательские шрифты доступны только в AdaptyUI SDK v.2.1.0 и выше
:::

Один из признаков хорошего дизайна — единообразие визуального стиля. Поэтому при создании no-code пейволов вы, скорее всего, захотите использовать пользовательский шрифт, который сочетается с остальным приложением. Здесь мы расскажем, как работает настройка шрифтов и как их использовать.

:::important

Этот раздел описывает устаревший Paywall Builder, совместимый с Adapty SDK v2.x и более ранними версиями. Информацию о новом Paywall Builder, совместимом с Adapty SDK v3.x и выше, см. в разделе [Пользовательские шрифты в новом Paywall Builder](using-custom-fonts-in-paywall-builder).

:::

## Что можно настроить \{#what-can-be-customized\}

Каждый текстовый элемент в Paywall Builder может иметь собственный шрифт и стиль. Настройте это в параметрах шрифта для каждого текстового элемента:

  <img src="/assets/shared/img/2b67da0-CleanShot_2024-02-07_at_13.27.092x.webp"
  style={{
    border: 'none', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Но в некоторых случаях удобнее изменить шрифт сразу для всего пейвола. Это можно сделать в разделе Layout в Paywall Builder [путём настройки Paywall Font](paywall-layout-and-products#font-settings-of-your-paywall).

## Шрифты, доступные по умолчанию \{#fonts-available-by-default\}

При создании пейвола в Builder Adapty по умолчанию использует системный шрифт — как правило, SF Pro на iOS и Roboto на Android (хотя это может варьироваться в зависимости от устройства). Также можно выбрать один из распространённых шрифтов (Arial, Times New Roman, Courier New, Georgia, Palatino и Verdana). Для каждого из них доступно несколько начертаний:

  <img src="/assets/shared/img/8812fab-CleanShot_2024-01-12_at_19.33.072x.webp"
  style={{
    border: 'none', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

:::note
Обратите внимание: эти шрифты не поставляются в составе Adapty SDK и используются только для предпросмотра. Мы не можем гарантировать их корректную работу на всех устройствах.

Тем не менее в ходе тестирования мы наблюдали, что большинство устройств распознают эти шрифты без дополнительных усилий с вашей стороны. Список шрифтов, доступных по умолчанию на iOS, можно найти здесь: [В официальной документации Apple](https://developer.apple.com/fonts/)
:::

## Как добавить пользовательский шрифт в дашборд Adapty \{#how-to-add-a-custom-font-to-the-adapty-dashboard\}

Если стандартных шрифтов недостаточно, нужно добавить пользовательский. Нажмите «Add custom font» в любом выпадающем списке шрифтов — откроется следующий экран:

  <img src="/assets/shared/img/89fb748-CleanShot_2024-02-07_at_13.21.552x.webp"
  style={{
    border: 'none', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Вам нужно:

- Найти файл шрифта и загрузить его в эту форму
- Указать имя для ссылки на шрифт в Paywall Builder
- Указать корректные названия шрифта для обеих платформ
- Добавить файл шрифта в бандл приложения, если вы ещё этого не сделали

:::warning
Мы не будем отправлять загруженный файл шрифта на устройство — он нужен только для предпросмотра. SDK получает лишь строки с названием шрифта и использует их при отрисовке пейвола. Поэтому убедитесь, что файл шрифта включён в бандл и указаны правильные платформо-зависимые имена шрифта — иначе ничего не сработает. Не волнуйтесь, это займёт совсем немного времени.
:::

:::note
Загружая файл шрифта в Adapty, вы подтверждаете, что имеете право использовать его в своём приложении
:::

### Получение корректного имени шрифта на iOS \{#getting-the-correct-font-name-on-ios\}

Есть два способа получить правильный идентификатор шрифта: первый требует написания небольшого кода, второй использует приложение Font Book, доступное на macOS.

Если вы уже добавили пользовательский шрифт в бандл приложения — скорее всего, вы уже ссылаетесь на него по имени. Чтобы убедиться в правильности имени, вызовите `UIFont.familyNames()` для получения семейства шрифта, а затем передайте результат в `UIFont.fontNames(forFamilyName: familyName)`. Сделать это можно в `viewDidLoad`, после чего удалите этот фрагмент кода:

```swift showLineNumbers title="Swift"
override func viewDidLoad() {
    super.viewDidLoad()
  	...
  	for family in UIFont.familyNames.sorted() {
    		print("Family: \(family)")
	    	let names = UIFont.fontNames(forFamilyName: family)
    		for fontName in names {
        		print("- \(fontName)")
    		}
    }
}
```

`fontName` в этом фрагменте — именно то, что нам нужно. Оно может выглядеть примерно как «MyFont-Regular».

Второй способ значительно проще: установите шрифт на Mac, откройте приложение Font Book, найдите нужный шрифт и используйте его `PostScript name`:

  <img src="/assets/shared/img/bb8a902-CleanShot_2024-01-12_at_20.32.222x.webp"
  style={{
    border: 'none', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

### Получение корректного имени шрифта на Android \{#getting-the-correct-font-name-on-android\}

Если файл шрифта правильно добавлен в папку ресурсов, достаточно указать имя файла. Убедитесь, что оно написано строчными буквами и содержит только буквы, цифры и символы подчёркивания — иначе это может не сработать.

Проверить правильность имени файла можно, вызвав `ResourcesCompat.getFont(context, R.font.my_font)`, где `my_font` — это имя вашего файла. В данном случае именно `my_font` нужно указать при создании пользовательского шрифта в Adapty.

## Добавление файлов шрифтов в бандл приложения \{#adding-the-font-files-to-your-apps-bundle\}

Скорее всего, вы уже используете пользовательский шрифт в других частях приложения. Но если нет — убедитесь, что файл шрифта включён в проект и бандл приложения. Подробнее об этом читайте ниже.

На iOS: [В официальной документации Apple](https://developer.apple.com/documentation/uikit/adding-a-custom-font-to-your-app)

На Android: [В официальной документации Android](https://developer.android.com/develop/ui/views/text-and-emoji/fonts-in-xml)