title: How can I put currency icon in front of the value of TextInput in ReactNative?
body: <p>I need to put the currency icon in front of the value when the user is putting an amount, but it is not so easy. I spent all day, but still not found the ideal solution. My best way was to wrap child component to TextInput,like this:</p>
  
  <pre><code>          &lt;TextInput
              style={SS.input}
              placeholder={props.placeholder}
              underlineColorAndroid='transparent' editable={!props.disabled}
              keyboardType={keyboardType} autoCapitalize='none'
              autoCorrect={false} selection={state.position}
              value={state.value} onChangeText={this._onChangeText}
              onFocus={this._onFocus} onBlur={this._onBlur}
              autoFocus={autoFocus}&gt;
              {!!this.props.icon &amp;&amp; !!state.value &amp;&amp; (
                &lt;Text style={{marginLeft: 10}}&gt;{this.props.icon}&lt;/Text&gt;
              )}
            &lt;/TextInput&gt;
  </code></pre>
  
  <p>But this decision has a few minus. The first one it is not possible to style child component, I can not set left padding from the amount. And the second it is the focus of TextInput go after the icon. Can somebody help me please.
  <a href="https://i.stack.imgur.com/BnHGq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BnHGq.png" alt="enter image description here"></a></p>