react-native-text-input-layout
Simple React Native Android module to use Android's Text Input Layout inside your app.
This module uses the native TextInputLayout component of the Design Support Library to create a floating label, as described on Material Design, like this
More info: http://developer.android.com/reference/android/support/design/widget/TextInputLayout.html and http://www.google.com.br/design/spec/components/text-fields.html#text-fields-labels
Installation
npm install react-native-text-input-layout --save
Add it to your android project
- In
android/settings.gradle
...include ':react-native-text-input-layout'project(':react-native-text-input-layout').projectDir = new File(settingsDir, '../node_modules/react-native-text-input-layout')
- In
android/app/build.gradle
...dependencies { ... compile project(':RNTextInputLayout')}
- Register Module (in MainActivity.java)
// <--- import
Example
'use strict'; ; ; { superprops; thisstate = } { return <View style=stylescontainer> <TextInputLayout> <TextInput style=stylestextInput placeholder='Name' /> </TextInputLayout> <TextInputLayout> <TextInput style=stylestextInput placeholder='Password' secureTextEntry=true /> </TextInputLayout> </View> ; } var styles = container: flex: 1 textInput: backgroundColor: 'transparent' color: 'blue' paddingLeft: 0 fontSize: 20 moduleexports = Example;
License
MIT