diff --git a/app/pickerHandle/handle.js b/app/pickerHandle/handle.js index aa43d7a..edc363e 100644 --- a/app/pickerHandle/handle.js +++ b/app/pickerHandle/handle.js @@ -1,7 +1,7 @@ /** * 依赖引用 */ -import React, {Component,PropTypes} from 'react'; +import React, {Component} from 'react'; import { View, Text, @@ -16,6 +16,7 @@ import { Modal, Image, } from 'react-native'; +import PropTypes from 'prop-types'; import styles from './handleStyle'; @@ -56,13 +57,6 @@ class Handle extends Component { render(){ return ( - {this.props.confirmChose();}}> - {this.props.confirmBtnText} - - - {this.props.pickerName} - {this.props.cancelChose(false, 'cancel'); }}> {this.props.cancelBtnText} + + {this.props.pickerName} + + {this.props.confirmChose();}}> + {this.props.confirmBtnText} + ); }} diff --git a/app/pickerHandle/handleStyle.js b/app/pickerHandle/handleStyle.js index e8c20c8..1557d18 100644 --- a/app/pickerHandle/handleStyle.js +++ b/app/pickerHandle/handleStyle.js @@ -16,7 +16,7 @@ let styles = StyleSheet.create({ justifyContent: 'center' }, confirmBtnStyle:{ - textAlign:'left', + textAlign:'right', paddingLeft:20, paddingRight:20, fontSize: 18 @@ -35,7 +35,7 @@ let styles = StyleSheet.create({ alignItems: 'center' }, cancelBtnStyle: { - textAlign:'right', + textAlign:'left', paddingLeft:20, paddingRight:20, fontSize: 18 diff --git a/app/pickerLogic/basicPicker.js b/app/pickerLogic/basicPicker.js index 837ffeb..0292d87 100644 --- a/app/pickerLogic/basicPicker.js +++ b/app/pickerLogic/basicPicker.js @@ -1,9 +1,10 @@ /** * 依赖引用 */ -import React, {Component,PropTypes} from 'react'; +import React, {Component} from 'react'; import { View, + ViewPropTypes, Text, Dimensions, Animated, @@ -13,6 +14,7 @@ import { Modal, Image, } from 'react-native'; +import PropTypes from 'prop-types'; import Pickroll from './basicRoll'; import {styles} from './pickerStyle'; import InputOuter from '../pickerTrigger/outer'; @@ -49,13 +51,13 @@ class BasicPicker extends Component { //确认按钮样式 confirmBtnStyle: Text.propTypes.style, //输入框样式 - inputStyle: View.propTypes.style, + inputStyle: ViewPropTypes.style, //滚轮头部样式 - navStyle: View.propTypes.style, + navStyle: ViewPropTypes.style, //输入框内部字体样式 textStyle: Text.propTypes.style, //右边下拉按钮的样式 - iconStyle: View.propTypes.style, + iconStyle: ViewPropTypes.style, //picker的名称 pickerName: PropTypes.string, //输入框内部文字初始值 @@ -73,7 +75,9 @@ class BasicPicker extends Component { //icon name iconName: PropTypes.string, //icon size - iconSize: PropTypes.number + iconSize: PropTypes.number, + //icon source + iconSource: PropTypes.oneOfType([PropTypes.number, PropTypes.object]), }; /** @@ -125,7 +129,8 @@ class BasicPicker extends Component { */ _confirmChose(){ this.props.data.map((item,index) =>{ - this.str = this.str + this.props.data[index][this.select.selectedValue[index]].name; + const keys = Object.keys(this.props.data[index]); + this.str = this.str + keys[keys.indexOf(this.select.selectedValue[0])]; }); this. _setModalVisible(false,'confirm'); return this.str; @@ -245,7 +250,8 @@ class BasicPicker extends Component { ))) } @@ -263,6 +269,7 @@ class BasicPicker extends Component { iconName={this.props.iconName} onPress={this._setEventBegin} iconStyle={this.props.iconStyle} + iconSource={this.props.iconSource} enable={this.props.enable} placeholder={this.props.inputValue}/> @@ -274,7 +281,7 @@ BasicPicker.defaultProps = { visible: false, enable: true, inputValue: 'please chose', - confirmBtnText: '确定', - cancelBtnText: '取消' + confirmBtnText: 'Done', + cancelBtnText: 'Cancel' }; export default BasicPicker; diff --git a/app/pickerLogic/basicRoll.js b/app/pickerLogic/basicRoll.js index f82eefb..6e96b9e 100644 --- a/app/pickerLogic/basicRoll.js +++ b/app/pickerLogic/basicRoll.js @@ -1,13 +1,15 @@ /** * 依赖引入 */ -import React, { Component, PropTypes } from 'react'; +import React, { Component } from 'react'; import { View, + ViewPropTypes, Text, Animated, ScrollView } from 'react-native'; +import PropTypes from 'prop-types'; import {rollStyles} from './pickerStyle'; /** @@ -29,7 +31,7 @@ class Pickroll extends Component { //选择的值的位置 selectIndex: PropTypes.number, //整个picker的样式 - pickerStyle: View.propTypes.style, + pickerStyle: ViewPropTypes.style, //单轮每个格子的样式 itemAndroidStyle: Text.propTypes.style }; @@ -46,7 +48,7 @@ class Pickroll extends Component { /** * 状态初始化 * @param props {object} 继承的属性 - * @returns {{selectedIndex: number, items: Array, pickerStyle:View.propTypes.style, itemStyle:View.propTypes.style, onValueChange: func}} + * @returns {{selectedIndex: number, items: Array, pickerStyle: ViewPropTypes.style, itemStyle: View.propTypes.style, onValueChange: func}} * @private */ @@ -187,7 +189,7 @@ class Pickroll extends Component { this.items = []; Object.keys(this.props.data).map((child,index) =>{ child === this.props.selectedValue && (this.selectedIndex = index); - this.items.push({value: child, label: this.props.data[child].name}); + this.items.push({value: child, label: typeof this.props.data[child].name === 'function' ? this.props.data[child].name() : this.props.data[child].name}); }); this.moveDy = 0; this.fingerLeft = false; diff --git a/app/pickerLogic/cascadePicker.js b/app/pickerLogic/cascadePicker.js index 94c2d3f..615ac47 100644 --- a/app/pickerLogic/cascadePicker.js +++ b/app/pickerLogic/cascadePicker.js @@ -1,9 +1,10 @@ /** * 依赖引用 */ -import React, { Component, PropTypes} from 'react'; +import React, { Component} from 'react'; import { View, + ViewPropTypes, Text, Dimensions, Animated, @@ -14,6 +15,7 @@ import { ActivityIndicator, Image } from 'react-native'; +import PropTypes from 'prop-types'; import Pickroll from './cascadeRoll'; import {styles} from './pickerStyle'; import InputOuter from '../pickerTrigger/outer'; @@ -50,13 +52,13 @@ class CascadePicker extends Component { //确认按钮样式 confirmBtnStyle: Text.propTypes.style, //输入框样式 - inputStyle: View.propTypes.style, + inputStyle: ViewPropTypes.style, //滚轮头部样式 - navStyle: View.propTypes.style, + navStyle: ViewPropTypes.style, //输入框内部字体样式 textStyle: Text.propTypes.style, //右边下拉按钮的样式 - iconStyle: View.propTypes.style, + iconStyle: ViewPropTypes.style, //picker的名称 pickerName: PropTypes.string, //输入框内部文字初始值 diff --git a/app/pickerLogic/cascadeRoll.js b/app/pickerLogic/cascadeRoll.js index a871a34..9d47058 100644 --- a/app/pickerLogic/cascadeRoll.js +++ b/app/pickerLogic/cascadeRoll.js @@ -1,13 +1,15 @@ /** * 依赖引入 */ -import React, { Component, PropTypes } from 'react'; +import React, { Component } from 'react'; import { View, + ViewPropTypes, Text, Animated, ScrollView } from 'react-native'; +import PropTypes from 'prop-types'; import {rollStyles} from './pickerStyle'; /** @@ -29,7 +31,7 @@ class Pickroll extends Component { //选择的值的位置 selectIndex: PropTypes.number, //整个picker的样式 - pickerStyle: View.propTypes.style, + pickerStyle: ViewPropTypes, //单轮每个格子的样式 itemAndroidStyle: Text.propTypes.style }; diff --git a/app/pickerTrigger/outer.js b/app/pickerTrigger/outer.js index 7d7f0d5..6a97b57 100644 --- a/app/pickerTrigger/outer.js +++ b/app/pickerTrigger/outer.js @@ -1,7 +1,7 @@ /** * 依赖引用 */ -import React, {Component,PropTypes} from 'react'; +import React, {Component} from 'react'; import { View, Text, @@ -16,8 +16,8 @@ import { Modal, Image, } from 'react-native'; +import PropTypes from 'prop-types'; import styles from './outerStyle'; -import Icon from 'react-native-vector-icons/Entypo'; /** @@ -31,7 +31,8 @@ class InputOuter extends Component { */ static propTypes = { //传递的数据 - data: PropTypes.array + data: PropTypes.array, + iconSource: PropTypes.oneOfType([PropTypes.number, PropTypes.object]), }; /** @@ -52,15 +53,20 @@ class InputOuter extends Component { render(){ return ( {this.props.onPress();}}> - + {this.props.placeholder} - - {/* */} + {this.props.iconSource ? + + : + null + } ); diff --git a/app/pickerTrigger/outerStyle.js b/app/pickerTrigger/outerStyle.js index 6f56200..c6bb06f 100644 --- a/app/pickerTrigger/outerStyle.js +++ b/app/pickerTrigger/outerStyle.js @@ -21,7 +21,6 @@ let styles = StyleSheet.create({ justifyContent: 'center', height: 40, backgroundColor: '#fff', - borderRadius: 3 }, textInput:{ flex: 1, diff --git a/package.json b/package.json index a3b3a77..8c70082 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "coverage": "cat ./coverage/lcov.info | coveralls" }, "dependencies": { + "prop-types": "^15.6.0", "react-native-vector-icons": "^4.0.0" }, "peerDependencies": {