React-native make a text input box component

I'm back again!

As the company's projects have been doing recently, and more urgent. Now the project has been iterative to the third phase, can slow down ...

Today in the company to listen to the front-end said that the project was originally done with react-native (last October), but to do half of the discovery pit too much, halfway to give up, so let us Android and iOS re-development ...

As a very fond of this technology, I mean quite a lot of disobedience.

So I plan to use my spare time to do an identical out, anyway interface I have (hehe)

To tell the truth, has been using Android for development recently, and the time is not well-off, react-native a little rusty.

Okay, nonsense, don't say, today in the login interface, I found that the login registration text box style is a kind of, if one of the write, it will appear to be a bit troublesome, so I simply encapsulated a textinput this component

Is the effect I put on the login screen.

Code:

1Import React, {Component} from ' React ';2 3 Import {4 Text,5 TextInput,6 View,7 Proptypes,8 StyleSheet,9 toastandroidTen} from ' React-native ' One  A class Textinputlogin extends Component { -Static Proptypes = { - name:React.PropTypes.string, the txtHide:React.PropTypes.string, - Ispassword:React.PropTypes.bool -       } -  +Static Defaultprops = { -Name: ' Names ', +Txthide: ' Content ', AIspassword:false, at     } - Constructor (props) { - Super (props) -          This. State = { -Txtvalue: "", -         } in     } - render () { to         var{style, name, Txthide, Ispassword} = This. Props +         return( -<view style={styles.container,style}> the<view style={styles.txtborder}> *<text style={styles.txtname}>{name}</text> $<TextInputPanax NotoginsengUnderlinecolorandroid = {' Transparent '} -style={Styles.textinput} themultiline={false} +Placeholder={txthide} Apassword={Ispassword} theonchangetext={(text) = { +                              This. SetState ({ - Txtvalue:text $                             }) $                         }} -value={ This. State.txtvalue} -/> the</View> -</View>Wuyi         ) the     } - GetValue () { Wu         return  This. State.txtvalue -     } About } $  -Const STYLES =stylesheet.create ({ - container: { -Flex:1, AAlignitems: ' Center ', +Flexdirection: ' Row ' the     }, - Txtborder: { $Height:50, theFlex:1, theBorderwidth:1, theBorderColor: ' #51A7F9 ', theMarginleft:50, -Marginright:50, inBorderradius:25, theFlexdirection: ' Row ' the     }, About txtname: { theHeight:20, theWidth:40, theMarginleft:20, +Fontsize:15, -Margintop:15, theColor: ' #51A7F9 ',BayiMarginright:10, theFontsize:14 the     }, - textInput: { -Height:50, thewidth:200 the     } the }) the  -Module.exports = Textinputlogin;

React-native make a text input box component