mayank-patel / react-native-floating-labels Goto Github PK
View Code? Open in Web Editor NEWReact Native Floating Labels Library
Home Page: https://www.npmjs.com/package/react-native-floating-labels
License: MIT License
React Native Floating Labels Library
Home Page: https://www.npmjs.com/package/react-native-floating-labels
License: MIT License
Hello,
To use your package with expo web, can you change
module.exports = FloatingLabel;
to
export default FloatingLabel;
To solve that Warning accept the Pull Request from @daichi000
Hello Mayank,
Thanks for the library. I noticed that one cannot change the cursor color by using the selectionColor prop provided by TextInput. I have simply added that prop in #35
adding clear() method make better this library
I am getting the following warning.
Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.
* Move data fetching code or side effects to componentDidUpdate.
* If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://fb.me/react-derived-state
* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.
Please update the following components: FloatingLabel
How to make use of Ref for focus in this library
ViewPropTypes has been deprecated for React Native 0.68.0. They need to be imported from the 'deprecated-react-native-prop-types' library.
Otherwise there is a runtime error.
ViewPropTypes has been removed from React Native. Migrate to ViewPropTypes exported from 'deprecated-react-native-prop-types'.
Even after the prop being added in #35, the cursor's selection cooler is not working.
Thanks!
React Native 0.39.2
Android 7.1.1 & 6.0.1 & 5.1
IOS 10.2
My code
import FloatingLabel from 'react-native-floating-labels';
<FloatingLabel
labelStyle={styles.labelInput}
inputStyle={styles.input}
password={true}
onChangeText={(e) => EmployerData.password = e.trim().replace('+', encodeURIComponent('+'))}
style={[styles.formInput, styles.textfieldWithFloatingLabel, { marginTop: mainComponent.state.marginBetweenFields, borderColor: mainComponent.state.underlineColor }]}>Contraseña</FloatingLabel>
This code works properly on IOS but on Android the letters are not hiding,
I had test it on Android 7.1.1 (Nougat), 6.0.1 (Marshmallow), 5.1 (lollipop)
I am having issue with FloatingLabel
, whenever I use onChangeText
event, my floating label floats at his starting position when I write something. But it works perfectly when I don't use onChangeText
, onBlur
and other events. Please help!
<FloatingLabel
labelStyle={Styles.labelInput}
inputStyle={Styles.input}
style={Styles.formInput}
underlineColorAndroid="transparent"
secureTextEntry={true}
onChangeText={(password) => this.setState({password})}
>Password</FloatingLabel>
Styles:
labelInput: {
fontSize: 16,
},
formInput: {
borderBottomWidth: 1,
borderColor: '#e6e6e6',
},
input: {
fontSize: 14,
borderWidth: 0
}
I have installed this module but it is giving an error Cannot read property bool of undefined
Though the fonts are increasing proportionally the hight of the component does not. As a temporary fix I just pass the height for the text input 45 but it is not the best solution.
ref={(input)=>this.field_name = input}
or
ref="field_name"
not woking..
Hello, I've several floating labels in a view inside the Scrollview. The issue I face that the scrollview not works if the user scrolls while focusing a floating label. However the scrolls works fine in TextInput even if the focus is on it but not working in floating label. Could you please let me know how can I sort this issue out. As I've too many floating labels on page, so whenever user try to scroll the page putting finger on the label, the text inside that scrolls a little,but not the complete page
onSubmitEditing is not calling
How can I put a mask in the field?
Does this support secure text entry?
edit: sorry didn't see the password input field #mybad
props maxLength,numberOfLines,default values are not available
Hi,
I installed your package using npm install react-native-floating-labels --save
but my build fails and the error is unable to resolve module 'create-react-class in react-native-floating-labels\\index.js
.
any fix for this?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.