mirror of
https://github.com/zhigang1992/react-native-picker.git
synced 2026-01-12 22:50:37 +08:00
support react-native@0.26
This commit is contained in:
@@ -7,7 +7,9 @@ A Picker written in pure javascript for cross-platform support.
|
||||
|
||||
It was most likely an example of how to build a cross-platform Picker Component use [react-native-picker-android](https://github.com/beefe/react-native-picker-android).
|
||||
|
||||
Needs react-native >= 0.14.2
|
||||
###Warn
|
||||
if 0.14.2 <= react-native <=0.24 `npm install react-native-picker@2.0.5 --save`
|
||||
if 0.24 < react-native `npm install react-native-picker --save`
|
||||
|
||||
####Demo
|
||||
|
||||
|
||||
6
example/PickerTest/.buckconfig
Normal file
6
example/PickerTest/.buckconfig
Normal file
@@ -0,0 +1,6 @@
|
||||
|
||||
[android]
|
||||
target = Google Inc.:Google APIs:23
|
||||
|
||||
[maven_repositories]
|
||||
central = https://repo1.maven.org/maven2
|
||||
@@ -15,8 +15,6 @@
|
||||
# Ignore react and fbjs where there are overlaps, but don't ignore
|
||||
# anything that react-native relies on
|
||||
.*/node_modules/fbjs/lib/Map.js
|
||||
.*/node_modules/fbjs/lib/fetch.js
|
||||
.*/node_modules/fbjs/lib/ExecutionEnvironment.js
|
||||
.*/node_modules/fbjs/lib/ErrorUtils.js
|
||||
|
||||
# Flow has a built-in definition for the 'react' module which we prefer to use
|
||||
@@ -42,10 +40,36 @@
|
||||
# Ignore Website
|
||||
.*/website/.*
|
||||
|
||||
# Ignore generators
|
||||
.*/local-cli/generator.*
|
||||
|
||||
# Ignore BUCK generated folders
|
||||
.*\.buckd/
|
||||
|
||||
.*/node_modules/is-my-json-valid/test/.*\.json
|
||||
.*/node_modules/iconv-lite/encodings/tables/.*\.json
|
||||
.*/node_modules/y18n/test/.*\.json
|
||||
.*/node_modules/spdx-license-ids/spdx-license-ids.json
|
||||
.*/node_modules/spdx-exceptions/index.json
|
||||
.*/node_modules/resolve/test/subdirs/node_modules/a/b/c/x.json
|
||||
.*/node_modules/resolve/lib/core.json
|
||||
.*/node_modules/jsonparse/samplejson/.*\.json
|
||||
.*/node_modules/json5/test/.*\.json
|
||||
.*/node_modules/ua-parser-js/test/.*\.json
|
||||
.*/node_modules/builtin-modules/builtin-modules.json
|
||||
.*/node_modules/binary-extensions/binary-extensions.json
|
||||
.*/node_modules/url-regex/tlds.json
|
||||
.*/node_modules/joi/.*\.json
|
||||
.*/node_modules/isemail/.*\.json
|
||||
.*/node_modules/tr46/.*\.json
|
||||
|
||||
|
||||
[include]
|
||||
|
||||
[libs]
|
||||
node_modules/react-native/Libraries/react-native/react-native-interface.js
|
||||
node_modules/react-native/flow
|
||||
flow/
|
||||
|
||||
[options]
|
||||
module.system=haste
|
||||
@@ -56,15 +80,15 @@ esproposal.class_instance_fields=enable
|
||||
munge_underscores=true
|
||||
|
||||
module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
|
||||
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\)$' -> 'RelativeImageStub'
|
||||
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
|
||||
|
||||
suppress_type=$FlowIssue
|
||||
suppress_type=$FlowFixMe
|
||||
suppress_type=$FixMe
|
||||
|
||||
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-1]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
|
||||
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-1]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
|
||||
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-4]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
|
||||
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-4]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
|
||||
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
|
||||
|
||||
[version]
|
||||
0.21.0
|
||||
0.24.0
|
||||
|
||||
66
example/PickerTest/android/app/BUCK
Normal file
66
example/PickerTest/android/app/BUCK
Normal file
@@ -0,0 +1,66 @@
|
||||
import re
|
||||
|
||||
# To learn about Buck see [Docs](https://buckbuild.com/).
|
||||
# To run your application with Buck:
|
||||
# - install Buck
|
||||
# - `npm start` - to start the packager
|
||||
# - `cd android`
|
||||
# - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US`
|
||||
# - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck
|
||||
# - `buck install -r android/app` - compile, install and run application
|
||||
#
|
||||
|
||||
lib_deps = []
|
||||
for jarfile in glob(['libs/*.jar']):
|
||||
name = 'jars__' + re.sub(r'^.*/([^/]+)\.jar$', r'\1', jarfile)
|
||||
lib_deps.append(':' + name)
|
||||
prebuilt_jar(
|
||||
name = name,
|
||||
binary_jar = jarfile,
|
||||
)
|
||||
|
||||
for aarfile in glob(['libs/*.aar']):
|
||||
name = 'aars__' + re.sub(r'^.*/([^/]+)\.aar$', r'\1', aarfile)
|
||||
lib_deps.append(':' + name)
|
||||
android_prebuilt_aar(
|
||||
name = name,
|
||||
aar = aarfile,
|
||||
)
|
||||
|
||||
android_library(
|
||||
name = 'all-libs',
|
||||
exported_deps = lib_deps
|
||||
)
|
||||
|
||||
android_library(
|
||||
name = 'app-code',
|
||||
srcs = glob([
|
||||
'src/main/java/**/*.java',
|
||||
]),
|
||||
deps = [
|
||||
':all-libs',
|
||||
':build_config',
|
||||
':res',
|
||||
],
|
||||
)
|
||||
|
||||
android_build_config(
|
||||
name = 'build_config',
|
||||
package = 'com.pickertest',
|
||||
)
|
||||
|
||||
android_resource(
|
||||
name = 'res',
|
||||
res = 'src/main/res',
|
||||
package = 'com.pickertest',
|
||||
)
|
||||
|
||||
android_binary(
|
||||
name = 'app',
|
||||
package_type = 'debug',
|
||||
manifest = 'src/main/AndroidManifest.xml',
|
||||
keystore = '//android/keystores:debug',
|
||||
deps = [
|
||||
':app-code',
|
||||
],
|
||||
)
|
||||
@@ -9,7 +9,7 @@ import com.android.build.OutputFile
|
||||
* cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
|
||||
* bundle directly from the development server. Below you can see all the possible configurations
|
||||
* and their defaults. If you decide to add a configuration block, make sure to add it before the
|
||||
* `apply from: "react.gradle"` line.
|
||||
* `apply from: "../../node_modules/react-native/react.gradle"` line.
|
||||
*
|
||||
* project.ext.react = [
|
||||
* // the name of the generated asset file containing your JS bundle
|
||||
@@ -59,7 +59,7 @@ import com.android.build.OutputFile
|
||||
* ]
|
||||
*/
|
||||
|
||||
apply from: "react.gradle"
|
||||
apply from: "../../node_modules/react-native/react.gradle"
|
||||
|
||||
/**
|
||||
* Set this to true to create two separate APKs instead of one:
|
||||
@@ -124,3 +124,10 @@ dependencies {
|
||||
compile "com.android.support:appcompat-v7:23.0.1"
|
||||
compile "com.facebook.react:react-native:+" // From node_modules
|
||||
}
|
||||
|
||||
// Run this once to be able to run the application with BUCK
|
||||
// puts all compile dependencies into folder libs for BUCK to use
|
||||
task copyDownloadableDepsToLibs(type: Copy) {
|
||||
from configurations.compile
|
||||
into 'libs'
|
||||
}
|
||||
|
||||
@@ -61,7 +61,3 @@
|
||||
-dontwarn java.nio.file.*
|
||||
-dontwarn org.codehaus.mojo.animal_sniffer.IgnoreJRERequirement
|
||||
-dontwarn okio.**
|
||||
|
||||
# stetho
|
||||
|
||||
-dontwarn com.facebook.stetho.**
|
||||
|
||||
@@ -1,97 +0,0 @@
|
||||
import org.apache.tools.ant.taskdefs.condition.Os
|
||||
|
||||
def config = project.hasProperty("react") ? project.react : [];
|
||||
|
||||
def bundleAssetName = config.bundleAssetName ?: "index.android.bundle"
|
||||
def entryFile = config.entryFile ?: "index.android.js"
|
||||
|
||||
// because elvis operator
|
||||
def elvisFile(thing) {
|
||||
return thing ? file(thing) : null;
|
||||
}
|
||||
|
||||
def reactRoot = elvisFile(config.root) ?: file("../../")
|
||||
def inputExcludes = config.inputExcludes ?: ["android/**", "ios/**"]
|
||||
|
||||
void runBefore(String dependentTaskName, Task task) {
|
||||
Task dependentTask = tasks.findByPath(dependentTaskName);
|
||||
if (dependentTask != null) {
|
||||
dependentTask.dependsOn task
|
||||
}
|
||||
}
|
||||
|
||||
gradle.projectsEvaluated {
|
||||
// Grab all build types and product flavors
|
||||
def buildTypes = android.buildTypes.collect { type -> type.name }
|
||||
def productFlavors = android.productFlavors.collect { flavor -> flavor.name }
|
||||
|
||||
// When no product flavors defined, use empty
|
||||
if (!productFlavors) productFlavors.add('')
|
||||
|
||||
productFlavors.each { productFlavorName ->
|
||||
buildTypes.each { buildTypeName ->
|
||||
// Create variant and target names
|
||||
def targetName = "${productFlavorName.capitalize()}${buildTypeName.capitalize()}"
|
||||
def targetPath = productFlavorName ?
|
||||
"${productFlavorName}/${buildTypeName}" :
|
||||
"${buildTypeName}"
|
||||
|
||||
// React js bundle directories
|
||||
def jsBundleDirConfigName = "jsBundleDir${targetName}"
|
||||
def jsBundleDir = elvisFile(config."$jsBundleDirConfigName") ?:
|
||||
file("$buildDir/intermediates/assets/${targetPath}")
|
||||
|
||||
def resourcesDirConfigName = "resourcesDir${targetName}"
|
||||
def resourcesDir = elvisFile(config."${resourcesDirConfigName}") ?:
|
||||
file("$buildDir/intermediates/res/merged/${targetPath}")
|
||||
def jsBundleFile = file("$jsBundleDir/$bundleAssetName")
|
||||
|
||||
// Bundle task name for variant
|
||||
def bundleJsAndAssetsTaskName = "bundle${targetName}JsAndAssets"
|
||||
|
||||
def currentBundleTask = tasks.create(
|
||||
name: bundleJsAndAssetsTaskName,
|
||||
type: Exec) {
|
||||
group = "react"
|
||||
description = "bundle JS and assets for ${targetName}."
|
||||
|
||||
// Create dirs if they are not there (e.g. the "clean" task just ran)
|
||||
doFirst {
|
||||
jsBundleDir.mkdirs()
|
||||
resourcesDir.mkdirs()
|
||||
}
|
||||
|
||||
// Set up inputs and outputs so gradle can cache the result
|
||||
inputs.files fileTree(dir: reactRoot, excludes: inputExcludes)
|
||||
outputs.dir jsBundleDir
|
||||
outputs.dir resourcesDir
|
||||
|
||||
// Set up the call to the react-native cli
|
||||
workingDir reactRoot
|
||||
|
||||
// Set up dev mode
|
||||
def devEnabled = !targetName.toLowerCase().contains("release")
|
||||
if (Os.isFamily(Os.FAMILY_WINDOWS)) {
|
||||
commandLine "cmd", "/c", "react-native", "bundle", "--platform", "android", "--dev", "${devEnabled}",
|
||||
"--entry-file", entryFile, "--bundle-output", jsBundleFile, "--assets-dest", resourcesDir
|
||||
} else {
|
||||
commandLine "react-native", "bundle", "--platform", "android", "--dev", "${devEnabled}",
|
||||
"--entry-file", entryFile, "--bundle-output", jsBundleFile, "--assets-dest", resourcesDir
|
||||
}
|
||||
|
||||
enabled config."bundleIn${targetName}" ||
|
||||
config."bundleIn${buildTypeName.capitalize()}" ?:
|
||||
targetName.toLowerCase().contains("release")
|
||||
}
|
||||
|
||||
// Hook bundle${productFlavor}${buildType}JsAndAssets into the android build process
|
||||
currentBundleTask.dependsOn("merge${targetName}Resources")
|
||||
currentBundleTask.dependsOn("merge${targetName}Assets")
|
||||
|
||||
runBefore("processArmeabi-v7a${targetName}Resources", currentBundleTask)
|
||||
runBefore("processX86${targetName}Resources", currentBundleTask)
|
||||
runBefore("processUniversal${targetName}Resources", currentBundleTask)
|
||||
runBefore("process${targetName}Resources", currentBundleTask)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,14 @@
|
||||
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
package="com.pickertest">
|
||||
package="com.pickertest"
|
||||
android:versionCode="1"
|
||||
android:versionName="1.0">
|
||||
|
||||
<uses-permission android:name="android.permission.INTERNET" />
|
||||
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
|
||||
|
||||
<uses-sdk
|
||||
android:minSdkVersion="16"
|
||||
android:targetSdkVersion="22" />
|
||||
|
||||
<application
|
||||
android:allowBackup="true"
|
||||
|
||||
8
example/PickerTest/android/keystores/BUCK
Normal file
8
example/PickerTest/android/keystores/BUCK
Normal file
@@ -0,0 +1,8 @@
|
||||
keystore(
|
||||
name = 'debug',
|
||||
store = 'debug.keystore',
|
||||
properties = 'debug.keystore.properties',
|
||||
visibility = [
|
||||
'PUBLIC',
|
||||
],
|
||||
)
|
||||
@@ -0,0 +1,4 @@
|
||||
key.store=debug.keystore
|
||||
key.alias=androiddebugkey
|
||||
key.store.password=android
|
||||
key.alias.password=android
|
||||
@@ -3,90 +3,96 @@
|
||||
* https://github.com/facebook/react-native
|
||||
*/
|
||||
|
||||
import React, {
|
||||
View,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
Dimensions,
|
||||
Component,
|
||||
StyleSheet,
|
||||
AppRegistry
|
||||
import React, {Component} from 'react'
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
Dimensions,
|
||||
StyleSheet,
|
||||
AppRegistry
|
||||
} from 'react-native';
|
||||
|
||||
import Picker from 'react-native-picker';
|
||||
|
||||
function createDateData(){
|
||||
let date = {};
|
||||
for(let i=1950;i<2050;i++){
|
||||
let month = {};
|
||||
for(let j = 1;j<13;j++){
|
||||
let day = [];
|
||||
if(j === 2){
|
||||
for(let k=1;k<29;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else if(j in {1:1, 3:1, 5:1, 7:1, 8:1, 10:1, 12:1}){
|
||||
for(let k=1;k<32;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else{
|
||||
for(let k=1;k<31;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
month[j+'月'] = day;
|
||||
}
|
||||
date[i+'年'] = month;
|
||||
}
|
||||
return date;
|
||||
let date = {};
|
||||
for(let i=1950;i<2050;i++){
|
||||
let month = {};
|
||||
for(let j = 1;j<13;j++){
|
||||
let day = [];
|
||||
if(j === 2){
|
||||
for(let k=1;k<29;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else if(j in {1:1, 3:1, 5:1, 7:1, 8:1, 10:1, 12:1}){
|
||||
for(let k=1;k<32;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else{
|
||||
for(let k=1;k<31;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
month[j+'月'] = day;
|
||||
}
|
||||
date[i+'年'] = month;
|
||||
}
|
||||
return date;
|
||||
};
|
||||
|
||||
class PickerTest extends Component {
|
||||
_onPressHandle(){
|
||||
this.picker.toggle();
|
||||
}
|
||||
|
||||
render(){
|
||||
return (
|
||||
<View style={{height: Dimensions.get('window').height}}>
|
||||
<TouchableOpacity style={{marginTop: 20}} onPress={this._onPressHandle.bind(this)}>
|
||||
<Text>Click Me</Text>
|
||||
</TouchableOpacity>
|
||||
<Picker
|
||||
ref={picker => this.picker = picker}
|
||||
style={{height: 260}}
|
||||
showDuration={300}
|
||||
showMask={true}
|
||||
pickerData={createDateData()}
|
||||
selectedValue={['2015年', '12月', '12日']}
|
||||
onPickerDone={(pickedValue) => {
|
||||
console.log(pickedValue);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
constructor(props, context) {
|
||||
super(props, context);
|
||||
}
|
||||
|
||||
_onPressHandle() {
|
||||
this.picker.toggle();
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View style={{height: Dimensions.get('window').height}}>
|
||||
<TouchableOpacity style={{marginTop: 20}} onPress={this._onPressHandle.bind(this)}>
|
||||
<Text>Click Me</Text>
|
||||
</TouchableOpacity>
|
||||
<Picker
|
||||
ref={picker => this.picker = picker}
|
||||
style={{height: 260}}
|
||||
showDuration={300}
|
||||
showMask={true}
|
||||
pickerData={createDateData()}
|
||||
selectedValue={['2015年', '12月', '12日']}
|
||||
onPickerDone={(pickedValue) => {
|
||||
alert(JSON.stringify(pickedValue));
|
||||
console.log(pickedValue);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#F5FCFF',
|
||||
},
|
||||
welcome: {
|
||||
fontSize: 20,
|
||||
textAlign: 'center',
|
||||
margin: 10,
|
||||
},
|
||||
instructions: {
|
||||
textAlign: 'center',
|
||||
color: '#333333',
|
||||
marginBottom: 5,
|
||||
},
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#F5FCFF',
|
||||
},
|
||||
welcome: {
|
||||
fontSize: 20,
|
||||
textAlign: 'center',
|
||||
margin: 10,
|
||||
},
|
||||
instructions: {
|
||||
textAlign: 'center',
|
||||
color: '#333333',
|
||||
marginBottom: 5,
|
||||
},
|
||||
});
|
||||
|
||||
AppRegistry.registerComponent('PickerTest', () => PickerTest);
|
||||
|
||||
@@ -3,90 +3,96 @@
|
||||
* https://github.com/facebook/react-native
|
||||
*/
|
||||
|
||||
import React, {
|
||||
View,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
Dimensions,
|
||||
Component,
|
||||
StyleSheet,
|
||||
AppRegistry
|
||||
import React, {Component} from 'react'
|
||||
import {
|
||||
View,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
Dimensions,
|
||||
StyleSheet,
|
||||
AppRegistry
|
||||
} from 'react-native';
|
||||
|
||||
import Picker from 'react-native-picker';
|
||||
|
||||
function createDateData(){
|
||||
let date = {};
|
||||
for(let i=1950;i<2050;i++){
|
||||
let month = {};
|
||||
for(let j = 1;j<13;j++){
|
||||
let day = [];
|
||||
if(j === 2){
|
||||
for(let k=1;k<29;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else if(j in {1:1, 3:1, 5:1, 7:1, 8:1, 10:1, 12:1}){
|
||||
for(let k=1;k<32;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else{
|
||||
for(let k=1;k<31;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
month[j+'月'] = day;
|
||||
}
|
||||
date[i+'年'] = month;
|
||||
}
|
||||
return date;
|
||||
let date = {};
|
||||
for(let i=1950;i<2050;i++){
|
||||
let month = {};
|
||||
for(let j = 1;j<13;j++){
|
||||
let day = [];
|
||||
if(j === 2){
|
||||
for(let k=1;k<29;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else if(j in {1:1, 3:1, 5:1, 7:1, 8:1, 10:1, 12:1}){
|
||||
for(let k=1;k<32;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
else{
|
||||
for(let k=1;k<31;k++){
|
||||
day.push(k+'日');
|
||||
}
|
||||
}
|
||||
month[j+'月'] = day;
|
||||
}
|
||||
date[i+'年'] = month;
|
||||
}
|
||||
return date;
|
||||
};
|
||||
|
||||
class PickerTest extends Component {
|
||||
_onPressHandle(){
|
||||
this.picker.toggle();
|
||||
}
|
||||
|
||||
render(){
|
||||
return (
|
||||
<View style={{height: Dimensions.get('window').height}}>
|
||||
<TouchableOpacity style={{marginTop: 20}} onPress={this._onPressHandle.bind(this)}>
|
||||
<Text>Click Me</Text>
|
||||
</TouchableOpacity>
|
||||
<Picker
|
||||
ref={picker => this.picker = picker}
|
||||
style={{height: 260}}
|
||||
showMask={true}
|
||||
showDuration={300}
|
||||
pickerData={createDateData()}
|
||||
selectedValue={['2015年', '12月', '12日']}
|
||||
onPickerDone={(pickedValue) => {
|
||||
console.log(pickedValue);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
constructor(props, context) {
|
||||
super(props, context);
|
||||
}
|
||||
|
||||
_onPressHandle() {
|
||||
this.picker.toggle();
|
||||
}
|
||||
|
||||
render(){
|
||||
return (
|
||||
<View style={{height: Dimensions.get('window').height}}>
|
||||
<TouchableOpacity style={{marginTop: 20}} onPress={this._onPressHandle.bind(this)}>
|
||||
<Text>Click Me</Text>
|
||||
</TouchableOpacity>
|
||||
<Picker
|
||||
ref={picker => this.picker = picker}
|
||||
style={{height: 260}}
|
||||
showMask={true}
|
||||
showDuration={300}
|
||||
pickerData={createDateData()}
|
||||
selectedValue={['2015年', '12月', '12日']}
|
||||
onPickerDone={(pickedValue) => {
|
||||
alert(JSON.stringify(pickedValue));
|
||||
console.log(pickedValue);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#F5FCFF',
|
||||
},
|
||||
welcome: {
|
||||
fontSize: 20,
|
||||
textAlign: 'center',
|
||||
margin: 10,
|
||||
},
|
||||
instructions: {
|
||||
textAlign: 'center',
|
||||
color: '#333333',
|
||||
marginBottom: 5,
|
||||
},
|
||||
container: {
|
||||
flex: 1,
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#F5FCFF',
|
||||
},
|
||||
welcome: {
|
||||
fontSize: 20,
|
||||
textAlign: 'center',
|
||||
margin: 10,
|
||||
},
|
||||
instructions: {
|
||||
textAlign: 'center',
|
||||
color: '#333333',
|
||||
marginBottom: 5,
|
||||
},
|
||||
});
|
||||
|
||||
AppRegistry.registerComponent('PickerTest', () => PickerTest);
|
||||
|
||||
@@ -575,10 +575,6 @@
|
||||
isa = XCBuildConfiguration;
|
||||
buildSettings = {
|
||||
BUNDLE_LOADER = "$(TEST_HOST)";
|
||||
FRAMEWORK_SEARCH_PATHS = (
|
||||
"$(SDKROOT)/Developer/Library/Frameworks",
|
||||
"$(inherited)",
|
||||
);
|
||||
GCC_PREPROCESSOR_DEFINITIONS = (
|
||||
"DEBUG=1",
|
||||
"$(inherited)",
|
||||
@@ -596,10 +592,6 @@
|
||||
buildSettings = {
|
||||
BUNDLE_LOADER = "$(TEST_HOST)";
|
||||
COPY_PHASE_STRIP = NO;
|
||||
FRAMEWORK_SEARCH_PATHS = (
|
||||
"$(SDKROOT)/Developer/Library/Frameworks",
|
||||
"$(inherited)",
|
||||
);
|
||||
INFOPLIST_FILE = PickerTestTests/Info.plist;
|
||||
IPHONEOS_DEPLOYMENT_TARGET = 8.2;
|
||||
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
|
||||
@@ -620,7 +612,10 @@
|
||||
);
|
||||
INFOPLIST_FILE = "PickerTest/Info.plist";
|
||||
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
|
||||
OTHER_LDFLAGS = "-ObjC";
|
||||
OTHER_LDFLAGS = (
|
||||
"-ObjC",
|
||||
"-lc++",
|
||||
);
|
||||
PRODUCT_NAME = PickerTest;
|
||||
};
|
||||
name = Debug;
|
||||
@@ -636,7 +631,10 @@
|
||||
);
|
||||
INFOPLIST_FILE = "PickerTest/Info.plist";
|
||||
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
|
||||
OTHER_LDFLAGS = "-ObjC";
|
||||
OTHER_LDFLAGS = (
|
||||
"-ObjC",
|
||||
"-lc++",
|
||||
);
|
||||
PRODUCT_NAME = PickerTest;
|
||||
};
|
||||
name = Release;
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
#import "RCTLog.h"
|
||||
#import "RCTRootView.h"
|
||||
|
||||
#define TIMEOUT_SECONDS 240
|
||||
#define TIMEOUT_SECONDS 600
|
||||
#define TEXT_TO_LOOK_FOR @"Welcome to React Native!"
|
||||
|
||||
@interface PickerTestTests : XCTestCase
|
||||
|
||||
@@ -6,8 +6,8 @@
|
||||
"start": "node_modules/react-native/packager/packager.sh"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^0.14.7",
|
||||
"react-native": "^0.22.2",
|
||||
"react-native-picker": "^2.0.4"
|
||||
"react": "^15.0.2",
|
||||
"react-native": "^0.26.1",
|
||||
"react-native-picker": "^2.0.5"
|
||||
}
|
||||
}
|
||||
|
||||
5
index.js
5
index.js
@@ -1,9 +1,8 @@
|
||||
'use strict';
|
||||
|
||||
import React, {
|
||||
Component,
|
||||
import React, {Component, PropTypes} from 'react';
|
||||
import {
|
||||
StyleSheet,
|
||||
PropTypes,
|
||||
View,
|
||||
Text,
|
||||
Animated,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "react-native-picker",
|
||||
"version": "2.0.5",
|
||||
"version": "3.0.0",
|
||||
"description": "react-native-picker",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
@@ -19,7 +19,7 @@
|
||||
"email": "wenliang.web@gmail.com"
|
||||
},
|
||||
"dependencies": {
|
||||
"react-native-picker-android": "~0.3.8"
|
||||
"react-native-picker-android": "~1.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
|
||||
Reference in New Issue
Block a user