Я не могу использовать собственный шрифт для реакции реагента с экспо? - PullRequest
0 голосов
/ 25 августа 2018

Мой проект - это реакция собственного реагента clojureScript на expo, и мне нужно настроить шрифт.Я уже читал документацию expo о том, как настраивать шрифт и пытался следовать инструкции в ClojureScript.

(инструкция по использованию шрифта expo https://docs.expo.io/versions/latest/guides/using-custom-fonts)

  1. асинхронная загрузка шрифта, это загрузка асинхронной функции

    (defn load-font-async
     [name url]
     (.call (aget Font "loadAsync")
       Font
       (js-obj "Kanit" url)))
    
  2. , вызывающей асинхронную функцию загрузки перед рендерингом.

    (->
     (expo/load-font-async "Kanit" (js/require "./assets/fonts/Kanit/Kanit-Regular.ttf"))
     (.then (fn [] (.registerComponent app-registry "main" #(r/reactify-component app-root))))))
    

    ps. Не рекомендуется держать все приложение только длязагрузка шрифта, но мне просто нужно убедиться, что шрифт уже загружен. (Мне нужен рефакторинг)

  3. Я установил стиль семейства шрифтов для текстового компонента

    [text {:style {:font-family "Kanit"}} "test"]
    

, но текстовый компонент не может найти семейство шрифтов "Kanit", которое я уже объявляю и загружаю. Ошибка была

 Unrecognized font family 'Kanit'

Я пока пуст, что не так с этим решением?

ps. Скажите, если вам нужна дополнительная информация, спасибо за ответ:)

ОБНОВЛЕНО : из рекомендации Криса Кэллейта я переместил expo/load-font-async в app-root идиспетчеризация для текстового компонента Tell, только присоединение семейства шрифтов к шрифтуредакторкак это

(defn app-root []
  (let [ ... ]
  (expo/load-font-async [{"Kanit" (js/require "./assets/fonts/Kanit/Kanit-Regular.ttf")}]
    (rf/dispatch [:app/set-font-loaded true]))
  (r/create-class {:reagent-render ..... }))))

, и он по-прежнему имеет ту же ошибку :(.

1 Ответ

0 голосов
/ 25 августа 2018

Проверьте это решение, оно использует Promise.All для вызова Font.loadAsync и загружает сразу несколько шрифтов.

(defn- cache-fonts [fonts]
  (for [font fonts]
    (when font
      (.loadAsync Font font))))

(defn- cast-as-array [coll]
  (if (or (array? coll)
          (not (reduceable? coll)))
    coll
    (into-array coll)))

(defn all [coll]
  (.all js/Promise (cast-as-array coll)))

(defn load-fonts [fonts cb]
  (->
    (all (cache-fonts (clj->js fonts)))
    (.then (fn [resp]
             (if cb (cb))))
    (.catch (fn [err]
              (println "Loading font failed: " (aget err "message"))))))


(load-fonts [{"Kanit" (js/require "./assets/fonts/Kanit/Kanit-Regular.ttf")}]
            (println "Font success loaded"))

Мой init:

(defn app-root []
  (let [...]
    (load-fonts ...)
    (fn []
      ...)))

(defn init []
  (.registerComponent app-registry "main" #(r/reactify-component app-root)))
...