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,
Related
I've ejected Expo app to get bare workflow (to archive IAPs).
But now I need to change app icon and splash screen.
I see tons of different size images in android/app/src/main/res/. Any change to app.json does not make sense (probably this is fine as far I use eas-cli to build it).
Is there some easy way do change an icon?
After some research I've found that there are no tools for automated icon change.
But if you go into branch until you detached (ejected) Expo, you can set icon there in assets dir, then make expo eject (it will also generate icons and splash screens in different resolutions) and copy required files:
android/app/src/res - for Android
ios/%app-name%/Images.xcassets - for iOS
Keeping the point before detaching Expo as separate branch/tag is good practice regarding Expo docs, this is one of the cases where it can be useful.
I am trying to find a dropdown related react-native package. I couldnt able to find any, which is compatible with both IOS and android devices.
So planning to use nativebase.io reactNative package.
Is it okay to use or do I face any problem?
Yes, You can use NativeBase with the expo.
Expo has its own Picker component you can use that as well which works on both platforms, Nativebase Picker is also dependent on this core module of react-native, So its recommended to use this one instead of installing a new UI lib only for Picker.
https://docs.expo.io/versions/latest/react-native/picker/
I have used to 'chalet' fonts in react-native app. This font doesn't work in 'iOS build', but it works fine in Android build. I have tried with other fonts , but it's works fine in both the builds iOS and android.
Can you please check this link for Font-family .ttf files.
If you guys found any solution, please help me !!
Usually font name is different for iOS and android,
Please follow below link to know the name of font for iOS,
https://medium.com/react-native-training/adding-custom-fonts-to-react-native-b266b41bff7f
and apply font according to platform name
I am using native-base library in react native. I have done following steps to change font but it does not work:
I pasted myfont.ttf in this directory:
node_modules/native-base/Fonts
I went to the following directory:
node_modules/native-base/src/theme/variables/...
and changed all font families into myFont.ttf in all three files (commonColor.js, material.js and platform.js)
Please help me in this issue.
You have to first eject NativeBase's theme, you can do that by
following the docs
here.
Then, add font to Android and iOS respectively, this
article
shows a good guide on how to do that.
Lastly, you can update the theme with your custom font on ./native-base-theme/variables/<theme-you-use>.js, also describe on the same docs above
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...