I'm working on a managed workflow Expo React Native app and am using Google Fonts (Nunito Sans specifically). I imported the font from #expo-google-fonts/nunito-sans and am loading it using the useFonts hook.
When using the font in styled components like font-family: "Nunito Sans", I get the error that:
fontFamily "Nunito Sans" is not a system font and has not been loaded through Font.loadAsync.
- If you intended to use a system font, make sure you typed the name correctly and that it is supported by your device operating system.
- If this is a custom font, be sure to load it with Font.loadAsync.
Is there any way I can still load Nunito Sans using useFonts?
Related
My react native project all of a sudden stopped loading all vector icons with this error
fontFamily "Material Design Icons" is not a system font and has not been loaded through Font.loadAsync.
And i have no idea what could be causing it.
I have deleted node_modules and ran ‘npm install’ still dose not load icons. This is how icons look like in my app
Please what else do i do to fix this
I have a Vue app that uses Vuetify. When I'm running the development server on MacOS Mojave, the page opens with a dark theme that I certainly didn't put anywhere into the styles. Besides using the dark theme, there are some components missing from the view.
If I open the app in a Firefox private window, I get the light theme and everything works as expected.
I noticed a few items in local storage that seem to be related to this:
No results show in google for the "darky" keys (darkyMode, darkyState and darkySupported). I'm not sure what writes and/or reads these keys and changes the theme to dark.
Other packages I'm using are leaflet and SVGjs.
I am building an app that requires Times New Roman or an equivalent. I have found that a style with fontVariant: ['small-caps'] has no effect. Are there specific fonts that have this capability? Is there a better way to specify this with the font? I am loading fonts with
await Font.loadAsync({
'times': require('./assets/fonts/TimesRoman.ttf'),
})
I have also tried the same with styled-components but does not work with this custom font.
Testing on simulator via react-native run-ios
Thanks to all,
I'm trying to make a graphic using the same font as the one being used by default in React Native but I don't know what the font is.
Anyone know?
The default font that React Native uses is "System font", which refers to the font used by the operating system on which the app is running.
On iOS, the system font is San Francisco, and on Android, it is Roboto.
Pretty sure React-Native just uses the default font family for each platform. So that's San Francisco on IOS and Roboto for Android.
I'm working on some HTML5 content to be included as part of an iPad app in a Web View and it requires some custom fonts which I was attepting to implement via CSS and #font-face
As I understand it, Mobile Safari only supports SVG fonts, but my testing has shown Mobile Safari to really struggle with SVG and the performance hit is a serious issue.
So... is it possible to put fonts in the App Bundle and somehow make them available to the webview?
Yes it is. Include the fonts in the App Bundle and in the app-info.plist use
"Fonts provided by application"
and provide the file name for each font.
Looks something like this...