OptionChoose.js
2.87 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
import React from "react"
import {View, StyleSheet, Text, Image, TouchableWithoutFeedback, TouchableOpacity} from "react-native"
import {line} from "./AddChildrenTask";
import ImagePicker from 'react-native-image-crop-picker';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'flex-end',
backgroundColor: "rgba(0,0,0,0.5)"
},
content: {
paddingHorizontal: 10,
paddingBottom: 10,
},
chooseView: {
height: 158,
backgroundColor: 'white',
borderRadius: 8,
overflow: 'hidden',
marginBottom: 10,
},
titleView: {
borderTopLeftRadius: 8,
borderTopRightRadius: 8,
height: 45,
borderBottomWidth: line,
borderBottomColor: "#999999",
alignItems: 'center',
justifyContent: 'center',
},
title: {
color: "#999999",
fontSize: 14,
},
library: {
height: 57,
borderBottomWidth: line,
borderBottomColor: "#999999",
alignItems: 'center',
justifyContent: 'center',
},
text: {
fontSize: 16,
color: "#0071ff"
},
cameraView: {
flex: 1,
borderBottomLeftRadius: 8,
borderBottomRightRadius: 8,
alignItems: 'center',
justifyContent: 'center',
},
cancelView: {
height: 55,
alignItems: 'center',
justifyContent: 'center',
borderRadius: 8,
backgroundColor: 'white',
overflow: 'hidden'
}
})
export default class OptionChoose extends React.Component {
back = () => {
const {navigation} = this.props
navigation.goBack()
}
openLibrary = async () => {
try{
const data = await ImagePicker.openPicker({
multiple: true,
compressImageQuality:0.1
})
console.log(data)
const {state,goBack}=this.props.navigation
state.params.onChange(data)
// data.map(v=>state.params.onChange(v.sourceURL))
goBack()
}catch (e){
console.log(e)
}
}
openCamera = async () => {
try{
const data = await ImagePicker.openCamera({compressImageQuality:0.1})
console.log(data)
const {state,goBack}=this.props.navigation
state.params.onChange(data)
goBack()
}catch(e){
console.log(e)
}
}
render() {
return (
<TouchableWithoutFeedback onPress={this.back}>
<View style={styles.container}>
<TouchableWithoutFeedback>
<View style={styles.content}>
<View style={styles.chooseView}>
<TouchableOpacity style={styles.titleView}>
<Text style={styles.title}>添加文件</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.library} onPress={this.openLibrary}>
<Text style={styles.text}>照片库</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.cameraView} onPress={this.openCamera}>
<Text style={styles.text}>相机</Text>
</TouchableOpacity>
</View>
<TouchableOpacity style={styles.cancelView} onPress={this.back}>
<Text style={styles.text}>取消</Text>
</TouchableOpacity>
</View>
</TouchableWithoutFeedback>
</View>
</TouchableWithoutFeedback>
)
}
}