3
0

Text.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import React from 'react';
  2. import Module from '../lib/Module';
  3. import {StyleSheet ,TextInput, View, Text } from 'react-native';
  4. import Types from '../lib/Types';
  5. export default class TextComp extends Module {
  6. constructor(props) {
  7. super(props);
  8. this.state = {
  9. text: props.text || ""
  10. }
  11. }
  12. display() {
  13. let { container , text } = this.props.style || ""
  14. let {
  15. color,
  16. fontSize
  17. } = this.props;
  18. return (
  19. <View style={container || defaultStyle.container}>
  20. <TextInput
  21. style={{...(text || defaultStyle.text), color, fontSize}}
  22. onChangeText={(text) => this.setState({
  23. text
  24. })}
  25. value={this.state.text || 'Default Text'}/>
  26. {this.props.children}
  27. </View>)
  28. }
  29. }
  30. const defaultStyle = StyleSheet.create({
  31. container:{
  32. //border: 0.5px solid #E4E4E4;
  33. borderWidth:0.5,
  34. borderColor:'#E4E4E4',
  35. backgroundColor:'#FFFFFF'
  36. },
  37. text:{
  38. color:'#707070',
  39. textAlign:'center',
  40. font:8,
  41. opacity:0.8
  42. /*
  43. text-align: left;
  44. font: Compact Thin 8px/10px SF Display;
  45. letter-spacing: 0;
  46. color: #707070;
  47. opacity: 0.3;
  48. */
  49. }
  50. })
  51. TextComp.Inputs = {
  52. color: new Types.Text(),
  53. fontSize: new Types.Integer().default(22)
  54. }