如何解决样式化的组件自定义字体无法识别本机元素
我正在尝试使用样式组件包装 react-native-elements Input 组件并使用自定义字体。
<Input
placeholder={placeholder}
placeholderTextColor="white"
style={{ fontFamily: "Arimo-Italic" }}
autoCapitalize="none"
/>
这段代码也能工作(没有 react-native-elements 组件)
export const StyledText = styled.Text`
color: white;
font-weight: bold;
text-align: right;
font-size: 30px;
font-family: Arimo;
`;
但是,当我尝试使用样式组件包装 react-native-elements 输入组件时,我收到此错误无法识别的字体系列“Arimo”
这是我的样式组件代码:
import { Input } from "react-native-elements";
import styled from "styled-components";
export const StyledInput = styled(Input).attrs({
textAlign: "right",fontFamily: "Arimo",marginTop: 50,inputContainerStyle: {
borderBottomColor: "#2f2f2f",borderBottomWidth: "0.33px",},});
这是我的具有加载字体功能的应用组件:
function App() {
let [fontsLoaded] = useFonts({
Arimo: require("./assets/fonts/Arimo-Regular.ttf"),"Arimo-Italic": require("./assets/fonts/Arimo-Italic.ttf"),});
if (!fontsLoaded) {
return <AppLoading />;
} else {
return (
<NavigationContainer theme={MyTheme}>
<Stack.Navigator>
<Stack.Screen name="Login" component={Login} />
</Stack.Navigator>
</NavigationContainer>
);
}
}
export default App;
我正在我的 iOS 设备上运行代码
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。