react-native - 如何为输入(react-native-elements)标签设置 fontFamily?

标签 react-native input font-family react-native-elements

fontFamilyreact-native-elements 中的 Input 组件的 labelStyle 属性中不起作用。我错过了什么?

我正在使用 react 16.8.6、react-native 0.60.4 和 react-native-elements 1.1.0。我一直在我的整个应用程序中使用这个字体系列 (Arciform),到目前为止它一直有效。

样式表代码 - 文件 definicoesBase

export const definicoesBase = {
    tamanhoFonteTextoComum : 16,
    alturaLinhaTextoComum : 22,
    fontFamilyTextoComum : 'Arciform',
    corFonteTextoCabecalho : "#fff",
    tamanhoFonteTextoCabelho: 20,
    corFonteTextoComum : "#212121",
    corFonteTextoAvaliacao : "#e7a74e",
    fontWeightCabecalho:"bold",
    backgroundGeral : "#fff",
    backgroundAnuncio : "#FFF",
    corBordaAnuncio : "#bdbdbd",
    corBarraSlider : "#bdbdbd",
    corBotaoSlider : "#0288d1",
    backgroundCabecalho : "#0288d1",
};

样式表代码 - 文件 StyleFaleConosco

import { StyleSheet } from "react-native";

import StyleBase, { definicoesBase } from "./StyleBase";

const StyleFaleConosco = StyleSheet.create({
...
    corpoText:{
        fontFamily: definicoesBase.fontFamilyTextoComum,
        fontSize: definicoesBase.tamanhoFonteTextoComum,
        color: definicoesBase.corFonteTextoComum,
        lineHeight: definicoesBase.alturaLinhaTextoComum
    },
...
});
export default StyleFaleConosco;

输入文件代码

import React, { Component } from "react";
import { ScrollView, Linking, Text, TouchableOpacity, View, BackHandler } from "react-native";
import { Input, Icon } from "react-native-elements";
import StyleFaleConosco from "../../styles/StyleFaleConosco";
import { navigationOptions } from "../../styles/StyleBase";
export default class FaleConosco extends Component {
...
  render() {
    return (
...

  state = {
    titulo: "",
    descricao: ""
  };
...
            <Input
              label="Título"
              labelStyle={StyleFaleConosco.corpoText}
              onChangeText={titulo => this.setState({ titulo })}
            />
...
            <Input
              label="Descreva o seu problema/sugestão"
              onChangeText={descricao => this.setState({ descricao })}
              multiline={true}
              numberOfLines={4}
              containerStyle={{ width: '90%', }}
              labelStyle={StyleFaleConosco.corpoText}
              inputContainerStyle={{
                borderWidth: 1,
                borderRadius: 5,
              }}
            />
...

    );
  }
}

它一直显示这 2 个标签的默认 fontFamily 而不是 Arciform。

最佳答案

将字体粗细设置为“正常”:

 <Input
    labelStyle={{
        color: 'white',
        fontFamily: 'Montserrat-Light',
        fontWeight: 'normal'
    }}
    editable={false}
    autoCapitalize="none"
    autoCorrect={false}
    label="EMAIL ADDRESS"
  />

关于react-native - 如何为输入(react-native-elements)标签设置 fontFamily?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57926824/

相关文章:

css - 在 Firefox 中显示 Arial Black 有技巧吗?

javascript - 没有异步/等待,缓存中的更改不会被保存

javascript - React Native slider onValueChange 调用 setState 使 slider 滞后

iPhone 在聚焦于 HTML 输入字段时选择 Shift 键。如何关闭此功能?

android - Android 是否能够管理麦克风/输入音量?

CSS3 字体系列在 Safari 浏览器中不起作用

android - 从哪里获取 Chrome for Android 中可用的字体

react-native - 导航到组件两次给出 setstate 错误

reactjs - 来自 react-native-searchable-dropdown 的 React-native 组件 SearchableDropdown 不会触发 onItemSelect={(item) => {console.log(item)}}

html - 将文本框拉伸(stretch)到页面的整个宽度,边距为 5px