Text not appearing on ios / android device but working fine on simulator










0















I've been working on deploying a react-native project which has been working (and continues to work) fine on both ios and android simulator. I've recently deployed it to beta in the playstore and testflight and when we launch the app it appears that some placeholder & default text is missing :-(



I'm new to react-native development, so any advice is greatly appreciated. Could it be that i'm missing something when generating my app bundle? I'm using react-native: 0.55.4. Below is the code on my login page where the labels are missing & the inputs are not being passed to the subsequent page.



.
.
.



constructor(props) 
super(props);

this.state =
username: '',
password: '',
isJobOwner: false,
saveCredentials: false,
isLoading: false
;



.
.
.



onPressLogin() 
this.props.navigation.navigate('SignUpChoice',
data:
username: this.state.username,
password: this.state.password

);



.
.
.



<Form style=styles.loginForm>
<View style=styles.formInputs>
<UnderlinedInput floating=true label='Email' value=this.state.username
onChangeText=(username) => this.setState(username)
keyboardType='email-address' autoCapitalize='none'/>
<UnderlinedInput floating=true label='Password' value=this.state.password
onChangeText=(password) => this.setState(password)
secureTextEntry=true
autoCapitalize='none'/>

</View>
<View style=styles.formButtons>
<Button transparent
onPress=() => this.onPressForgotPassword()
disabled=this.state.isLoading style=styles.forgotButtonStyle><Text
style=styles.forgotTextStyle>Forgot
Password?</Text></Button>
<Button primary style=styles.loginButtonStyle onPress=() => this.onPressLogin()
disabled=this.state.isLoading>
<Text style=styles.loginTextStyle>Sign In</Text>
</Button>
</View>


.
.
.



function mapStateToProps(state) 
const data = state.data.loginReducer;
return
requesting: data.requesting,
successful: data.successful,
errors: data.errors,
isJobOwner: data.isJobOwner





.
.
.



export default connect(mapStateToProps)(LoginScreen);


This is all working fine in on the simulators but on the devices its as if the the state is not being updated.



Edit: Including the source for the UnderlinedInput



import React from 'react';
import Item, Input, Label from 'native-base';
import colors from 'Colors';

const UnderlinedInput = (defaultValue, label, value, onChangeText, secureTextEntry, keyboardType, autoCapitalize, floating, onEndEditing) =>
return (
<Item floatingLabel=floating stackedLabel=!floating style=styles.inputTextStyle>
<Label style=styles.labelStyle>label</Label>
<Input
secureTextEntry=
autoCorrect=false
autoCapitalize=
value=value
onChangeText=onChangeText
keyboardType=
defaultValue=defaultValue
onEndEditing=onEndEditing
style=styles.inputMainStyle
/>
</Item>
);


;



const styles = 
inputTextStyle:
borderBottomColor: colors.lightGrey,
borderBottomWidth: 1,
color: colors.lightGrey,
width: '80%',
marginLeft: 'auto',
marginRight: 'auto',
paddingBottom: 10
,
inputMainStyle:
color: colors.lightGrey,
fontSize: 14
,
labelStyle:
fontWeight: '700',
letterSpacing: 1,
paddingTop: 4,
color: colors.lightGrey,
fontSize: 14

;


export default UnderlinedInput;










share|improve this question




























    0















    I've been working on deploying a react-native project which has been working (and continues to work) fine on both ios and android simulator. I've recently deployed it to beta in the playstore and testflight and when we launch the app it appears that some placeholder & default text is missing :-(



    I'm new to react-native development, so any advice is greatly appreciated. Could it be that i'm missing something when generating my app bundle? I'm using react-native: 0.55.4. Below is the code on my login page where the labels are missing & the inputs are not being passed to the subsequent page.



    .
    .
    .



    constructor(props) 
    super(props);

    this.state =
    username: '',
    password: '',
    isJobOwner: false,
    saveCredentials: false,
    isLoading: false
    ;



    .
    .
    .



    onPressLogin() 
    this.props.navigation.navigate('SignUpChoice',
    data:
    username: this.state.username,
    password: this.state.password

    );



    .
    .
    .



    <Form style=styles.loginForm>
    <View style=styles.formInputs>
    <UnderlinedInput floating=true label='Email' value=this.state.username
    onChangeText=(username) => this.setState(username)
    keyboardType='email-address' autoCapitalize='none'/>
    <UnderlinedInput floating=true label='Password' value=this.state.password
    onChangeText=(password) => this.setState(password)
    secureTextEntry=true
    autoCapitalize='none'/>

    </View>
    <View style=styles.formButtons>
    <Button transparent
    onPress=() => this.onPressForgotPassword()
    disabled=this.state.isLoading style=styles.forgotButtonStyle><Text
    style=styles.forgotTextStyle>Forgot
    Password?</Text></Button>
    <Button primary style=styles.loginButtonStyle onPress=() => this.onPressLogin()
    disabled=this.state.isLoading>
    <Text style=styles.loginTextStyle>Sign In</Text>
    </Button>
    </View>


    .
    .
    .



    function mapStateToProps(state) 
    const data = state.data.loginReducer;
    return
    requesting: data.requesting,
    successful: data.successful,
    errors: data.errors,
    isJobOwner: data.isJobOwner





    .
    .
    .



    export default connect(mapStateToProps)(LoginScreen);


    This is all working fine in on the simulators but on the devices its as if the the state is not being updated.



    Edit: Including the source for the UnderlinedInput



    import React from 'react';
    import Item, Input, Label from 'native-base';
    import colors from 'Colors';

    const UnderlinedInput = (defaultValue, label, value, onChangeText, secureTextEntry, keyboardType, autoCapitalize, floating, onEndEditing) =>
    return (
    <Item floatingLabel=floating stackedLabel=!floating style=styles.inputTextStyle>
    <Label style=styles.labelStyle>label</Label>
    <Input
    secureTextEntry=
    autoCorrect=false
    autoCapitalize=
    value=value
    onChangeText=onChangeText
    keyboardType=
    defaultValue=defaultValue
    onEndEditing=onEndEditing
    style=styles.inputMainStyle
    />
    </Item>
    );


    ;



    const styles = 
    inputTextStyle:
    borderBottomColor: colors.lightGrey,
    borderBottomWidth: 1,
    color: colors.lightGrey,
    width: '80%',
    marginLeft: 'auto',
    marginRight: 'auto',
    paddingBottom: 10
    ,
    inputMainStyle:
    color: colors.lightGrey,
    fontSize: 14
    ,
    labelStyle:
    fontWeight: '700',
    letterSpacing: 1,
    paddingTop: 4,
    color: colors.lightGrey,
    fontSize: 14

    ;


    export default UnderlinedInput;










    share|improve this question


























      0












      0








      0








      I've been working on deploying a react-native project which has been working (and continues to work) fine on both ios and android simulator. I've recently deployed it to beta in the playstore and testflight and when we launch the app it appears that some placeholder & default text is missing :-(



      I'm new to react-native development, so any advice is greatly appreciated. Could it be that i'm missing something when generating my app bundle? I'm using react-native: 0.55.4. Below is the code on my login page where the labels are missing & the inputs are not being passed to the subsequent page.



      .
      .
      .



      constructor(props) 
      super(props);

      this.state =
      username: '',
      password: '',
      isJobOwner: false,
      saveCredentials: false,
      isLoading: false
      ;



      .
      .
      .



      onPressLogin() 
      this.props.navigation.navigate('SignUpChoice',
      data:
      username: this.state.username,
      password: this.state.password

      );



      .
      .
      .



      <Form style=styles.loginForm>
      <View style=styles.formInputs>
      <UnderlinedInput floating=true label='Email' value=this.state.username
      onChangeText=(username) => this.setState(username)
      keyboardType='email-address' autoCapitalize='none'/>
      <UnderlinedInput floating=true label='Password' value=this.state.password
      onChangeText=(password) => this.setState(password)
      secureTextEntry=true
      autoCapitalize='none'/>

      </View>
      <View style=styles.formButtons>
      <Button transparent
      onPress=() => this.onPressForgotPassword()
      disabled=this.state.isLoading style=styles.forgotButtonStyle><Text
      style=styles.forgotTextStyle>Forgot
      Password?</Text></Button>
      <Button primary style=styles.loginButtonStyle onPress=() => this.onPressLogin()
      disabled=this.state.isLoading>
      <Text style=styles.loginTextStyle>Sign In</Text>
      </Button>
      </View>


      .
      .
      .



      function mapStateToProps(state) 
      const data = state.data.loginReducer;
      return
      requesting: data.requesting,
      successful: data.successful,
      errors: data.errors,
      isJobOwner: data.isJobOwner





      .
      .
      .



      export default connect(mapStateToProps)(LoginScreen);


      This is all working fine in on the simulators but on the devices its as if the the state is not being updated.



      Edit: Including the source for the UnderlinedInput



      import React from 'react';
      import Item, Input, Label from 'native-base';
      import colors from 'Colors';

      const UnderlinedInput = (defaultValue, label, value, onChangeText, secureTextEntry, keyboardType, autoCapitalize, floating, onEndEditing) =>
      return (
      <Item floatingLabel=floating stackedLabel=!floating style=styles.inputTextStyle>
      <Label style=styles.labelStyle>label</Label>
      <Input
      secureTextEntry=
      autoCorrect=false
      autoCapitalize=
      value=value
      onChangeText=onChangeText
      keyboardType=
      defaultValue=defaultValue
      onEndEditing=onEndEditing
      style=styles.inputMainStyle
      />
      </Item>
      );


      ;



      const styles = 
      inputTextStyle:
      borderBottomColor: colors.lightGrey,
      borderBottomWidth: 1,
      color: colors.lightGrey,
      width: '80%',
      marginLeft: 'auto',
      marginRight: 'auto',
      paddingBottom: 10
      ,
      inputMainStyle:
      color: colors.lightGrey,
      fontSize: 14
      ,
      labelStyle:
      fontWeight: '700',
      letterSpacing: 1,
      paddingTop: 4,
      color: colors.lightGrey,
      fontSize: 14

      ;


      export default UnderlinedInput;










      share|improve this question
















      I've been working on deploying a react-native project which has been working (and continues to work) fine on both ios and android simulator. I've recently deployed it to beta in the playstore and testflight and when we launch the app it appears that some placeholder & default text is missing :-(



      I'm new to react-native development, so any advice is greatly appreciated. Could it be that i'm missing something when generating my app bundle? I'm using react-native: 0.55.4. Below is the code on my login page where the labels are missing & the inputs are not being passed to the subsequent page.



      .
      .
      .



      constructor(props) 
      super(props);

      this.state =
      username: '',
      password: '',
      isJobOwner: false,
      saveCredentials: false,
      isLoading: false
      ;



      .
      .
      .



      onPressLogin() 
      this.props.navigation.navigate('SignUpChoice',
      data:
      username: this.state.username,
      password: this.state.password

      );



      .
      .
      .



      <Form style=styles.loginForm>
      <View style=styles.formInputs>
      <UnderlinedInput floating=true label='Email' value=this.state.username
      onChangeText=(username) => this.setState(username)
      keyboardType='email-address' autoCapitalize='none'/>
      <UnderlinedInput floating=true label='Password' value=this.state.password
      onChangeText=(password) => this.setState(password)
      secureTextEntry=true
      autoCapitalize='none'/>

      </View>
      <View style=styles.formButtons>
      <Button transparent
      onPress=() => this.onPressForgotPassword()
      disabled=this.state.isLoading style=styles.forgotButtonStyle><Text
      style=styles.forgotTextStyle>Forgot
      Password?</Text></Button>
      <Button primary style=styles.loginButtonStyle onPress=() => this.onPressLogin()
      disabled=this.state.isLoading>
      <Text style=styles.loginTextStyle>Sign In</Text>
      </Button>
      </View>


      .
      .
      .



      function mapStateToProps(state) 
      const data = state.data.loginReducer;
      return
      requesting: data.requesting,
      successful: data.successful,
      errors: data.errors,
      isJobOwner: data.isJobOwner





      .
      .
      .



      export default connect(mapStateToProps)(LoginScreen);


      This is all working fine in on the simulators but on the devices its as if the the state is not being updated.



      Edit: Including the source for the UnderlinedInput



      import React from 'react';
      import Item, Input, Label from 'native-base';
      import colors from 'Colors';

      const UnderlinedInput = (defaultValue, label, value, onChangeText, secureTextEntry, keyboardType, autoCapitalize, floating, onEndEditing) =>
      return (
      <Item floatingLabel=floating stackedLabel=!floating style=styles.inputTextStyle>
      <Label style=styles.labelStyle>label</Label>
      <Input
      secureTextEntry=
      autoCorrect=false
      autoCapitalize=
      value=value
      onChangeText=onChangeText
      keyboardType=
      defaultValue=defaultValue
      onEndEditing=onEndEditing
      style=styles.inputMainStyle
      />
      </Item>
      );


      ;



      const styles = 
      inputTextStyle:
      borderBottomColor: colors.lightGrey,
      borderBottomWidth: 1,
      color: colors.lightGrey,
      width: '80%',
      marginLeft: 'auto',
      marginRight: 'auto',
      paddingBottom: 10
      ,
      inputMainStyle:
      color: colors.lightGrey,
      fontSize: 14
      ,
      labelStyle:
      fontWeight: '700',
      letterSpacing: 1,
      paddingTop: 4,
      color: colors.lightGrey,
      fontSize: 14

      ;


      export default UnderlinedInput;







      android ios react-native






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 14 '18 at 0:52







      Tarig

















      asked Nov 14 '18 at 0:15









      TarigTarig

      11




      11






















          1 Answer
          1






          active

          oldest

          votes


















          0














          from my point of view, it's because you are using a third party libraries UnderlinedInput, be sure that those components are not 100% reliable, they my not work on some devices, or for some cases. If you try for exemple to use a simple TextInput, Iam sure it will work.






          share|improve this answer























          • Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

            – Tarig
            Nov 14 '18 at 0:49












          • Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

            – G. Adnane
            Nov 14 '18 at 13:00










          Your Answer






          StackExchange.ifUsing("editor", function ()
          StackExchange.using("externalEditor", function ()
          StackExchange.using("snippets", function ()
          StackExchange.snippets.init();
          );
          );
          , "code-snippets");

          StackExchange.ready(function()
          var channelOptions =
          tags: "".split(" "),
          id: "1"
          ;
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function()
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled)
          StackExchange.using("snippets", function()
          createEditor();
          );

          else
          createEditor();

          );

          function createEditor()
          StackExchange.prepareEditor(
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader:
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          ,
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          );



          );













          draft saved

          draft discarded


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53291353%2ftext-not-appearing-on-ios-android-device-but-working-fine-on-simulator%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown

























          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes









          0














          from my point of view, it's because you are using a third party libraries UnderlinedInput, be sure that those components are not 100% reliable, they my not work on some devices, or for some cases. If you try for exemple to use a simple TextInput, Iam sure it will work.






          share|improve this answer























          • Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

            – Tarig
            Nov 14 '18 at 0:49












          • Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

            – G. Adnane
            Nov 14 '18 at 13:00















          0














          from my point of view, it's because you are using a third party libraries UnderlinedInput, be sure that those components are not 100% reliable, they my not work on some devices, or for some cases. If you try for exemple to use a simple TextInput, Iam sure it will work.






          share|improve this answer























          • Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

            – Tarig
            Nov 14 '18 at 0:49












          • Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

            – G. Adnane
            Nov 14 '18 at 13:00













          0












          0








          0







          from my point of view, it's because you are using a third party libraries UnderlinedInput, be sure that those components are not 100% reliable, they my not work on some devices, or for some cases. If you try for exemple to use a simple TextInput, Iam sure it will work.






          share|improve this answer













          from my point of view, it's because you are using a third party libraries UnderlinedInput, be sure that those components are not 100% reliable, they my not work on some devices, or for some cases. If you try for exemple to use a simple TextInput, Iam sure it will work.







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 14 '18 at 0:35









          G. AdnaneG. Adnane

          8418




          8418












          • Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

            – Tarig
            Nov 14 '18 at 0:49












          • Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

            – G. Adnane
            Nov 14 '18 at 13:00

















          • Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

            – Tarig
            Nov 14 '18 at 0:49












          • Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

            – G. Adnane
            Nov 14 '18 at 13:00
















          Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

          – Tarig
          Nov 14 '18 at 0:49






          Thanks for your response but I think the UnderlinedInput is a component that used quite standard react-native controls editing original post to include. If it was this component specifically wouldn't it break in the simulator first?

          – Tarig
          Nov 14 '18 at 0:49














          Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

          – G. Adnane
          Nov 14 '18 at 13:00





          Like i said, it may not work on some* devices, or fore some cases* . But I just noticed something, for exemple in keyboardType , the value assigned is a string, so why are you adding the braquet , when the value is a String, you don't have to add those braquet , juste write for exemple, keyboardType = "email-adresse". So try to remove them when u have a String

          – G. Adnane
          Nov 14 '18 at 13:00

















          draft saved

          draft discarded
















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid


          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.

          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53291353%2ftext-not-appearing-on-ios-android-device-but-working-fine-on-simulator%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          這個網誌中的熱門文章

          How to read a connectionString WITH PROVIDER in .NET Core?

          Node.js Script on GitHub Pages or Amazon S3

          Museum of Modern and Contemporary Art of Trento and Rovereto