简体   繁体   中英

Text in TextInput not in correct position on ios

I have a textInput in a View which is positioned at the center using flex . the problem is, when you start writing in the textInput , the text gets centered, even though I didn't style it that way...

The initial cursor is at the correct position, but as soon as the user starts typing, the text centers.

What's weird is that this issue is only with ios, not android...

I tried adding a style of textAlign: left , but it didn't anything. What am I doing wrong, and how can I fix that?

Here's a link to the project: https://snack.expo.io/S1PlOqFvN

import React from 'react';
import { StyleSheet, Text, View, TextInput } from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <TextInput style={styles.textFieldStyling} placeholder="Try typing something..."></TextInput>
        <Text style={styles.textStyling}></Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'orange',
    alignItems: 'center',
    justifyContent: 'center',
  },
  textStyling: {
    fontSize: 50,
    textAlign: 'center',
  },
  textFieldStyling: {
      color: 'blue',
  },
});

TextInput in React Native does not have a close tag

  <TextInput
      style={styles.textFieldStyling} 
      placeholder="Try typing something..."
  />

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM