Question

hai在我的TextInput中我想改变placeHolder字体的大小，我试过这样：

<TextInput
                   style={styles.email}
                   value={this.state.email} 
                   placeholder="Email"
                 placeholderTextColor="red"
                 //placeholderTextSize = 20px
                   onChange={this.handleEmailChange.bind(this)}
                   onBlur={this.onBlur.bind(this)}/>

当我写这样的颜色对我有用但尺寸不起作用时，任何人都可以给我建议如何更改占位符文字的大小，任何帮助非常感谢

Answer 1

我不确定您是否只能指定placeholderText的大小。但是您可以从TextInput中更改输入文本的fontSize：

var styles = StyleSheet.create({
 email:     {
    fontSize:   12, <-- Textsize of Input-Text and Placeholder-Text
 },
})

也许你的解决方案没有px工作？！但我不这么认为。如果你想拥有一个与InputText不同的PlaceholderText，那么你可以访问onChangeText-TextInput的方法，并在你在Textfield中输入内容后立即更改fontSize。

Answer 2

<TextInput 
style={{fontSize:12}} 
placeholder='any text' 
onChangeText={(input)=>this.setState({input: input})}
placeholderTextColor='green'/>

Answer 3

（据我所记得）没有办法直接更改仅占位符的字体大小，因为当您使用样式更改fontSize时，您同时更改了输入fontSize和占位符fontSize。但是，有一种方法可以...

const [ text, setText ] = useState<string>('');

，然后使用状态检查输入字段是否为空。如果为空，则将fontSize更改为：

{ fontSize: text ? 18 : 12 }

但是，重要的是要注意即使此方法也可以使用，但是由重新渲染引起的延迟当然很明显。

Answer 4

TextInput 组件可以这样创建。

<TextInput
value={value}
style={value ? styles.input : styles.placeholder}
placeholderTextColor="white"
{...props}/>

如何在react-native中更改占位符textSize

4 个答案: