Save

Author: dgca

package-lock.json

@@ -53,7 +53,17 @@
           }
         }
       ],
-      "./plugins/withPointerEvents.js"
+      "./plugins/withPointerEvents.js",
+      [
+        "expo-font",
+        {
+          "fonts": [
+            "./assets/fonts/ABCFavorit-Regular.otf",
+            "./assets/fonts/ABCFavoritExtended-Bold.otf",
+            "./assets/fonts/ABCFavoritExtended-Regular.otf"
+          ]
+        }
+      ]
     ]
   }
 }

packages/mobile-app/app.json

@@ -1,11 +1,21 @@
-import { useColorScheme, View, Text } from "react-native";
+import * as Font from "expo-font";
+import { useColorScheme, View, Text, StyleSheet } from "react-native";
 import { Button, Box, HStack, VStack } from "@ironfish/tackle-box";
 import { useState } from "react";
 
+const styles = StyleSheet.create({
+  base: {
+    fontFamily: "Favorit",
+  },
+});
+
 export default function UiKit() {
   const scheme = useColorScheme();
   const [count, setCount] = useState(0);
 
+  const blah = Font.isLoaded("ABCFavorit-Regular");
+  console.log({ blah });
+
   return (
     <View
       style={{
@@ -14,7 +24,7 @@ export default function UiKit() {
         backgroundColor: scheme === "dark" ? "#333" : "#fff",
       }}
     >
-      <Text>Count: {count}</Text>
+      <Text style={styles.base}>Count: {count}</Text>
       <Button title="Press me" onClick={() => setCount(count + 1)} />
       <Box height="auto" bg="pink" borderWidth={2} borderColor="gray">
         <Button title="Press me" onClick={() => setCount(count + 1)} />

packages/mobile-app/app/(tabs)/ui.tsx

@@ -35,7 +35,8 @@
     "react-native-svg": "15.2.0",
     "zod": "^3.22.4",
     "react-native-reanimated": "~3.15.0",
-    "react-native-gesture-handler": "~2.18.1"
+    "react-native-gesture-handler": "~2.18.1",
+    "expo-font": "~12.0.10"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",