1import * as ImagePicker from 'expo-image-picker';
2import React from 'react';
3import { ScrollView, StyleSheet } from 'react-native';
4
5import ImagePickerAssetsList from './ImagePickerAssetsList';
6import FunctionDemo, {
7  FunctionDescription,
8  FunctionParameter,
9} from '../../components/FunctionDemo';
10
11const LAUNCH_PICKER_PARAMETERS: FunctionParameter[] = [
12  {
13    type: 'object',
14    name: 'options',
15    properties: [
16      {
17        name: 'mediaTypes',
18        type: 'enum',
19        values: [
20          { name: 'MediaTypeOptions.Images', value: ImagePicker.MediaTypeOptions.Images },
21          { name: 'MediaTypeOptions.Videos', value: ImagePicker.MediaTypeOptions.Videos },
22          { name: 'MediaTypeOptions.All', value: ImagePicker.MediaTypeOptions.All },
23        ],
24      },
25      { name: 'allowsEditing', type: 'boolean', initial: false },
26      {
27        name: 'aspect',
28        type: 'enum',
29        values: [
30          { name: '[4, 3]', value: [4, 3] },
31          { name: '[1, 1]', value: [1, 1] },
32          { name: '[1, 2]', value: [1, 2] },
33        ],
34        platforms: ['android'],
35      },
36      { name: 'quality', type: 'number', values: [0, 0.2, 0.7, 1.0] },
37      { name: 'exif', type: 'boolean', initial: false },
38      { name: 'base64', type: 'boolean', initial: false },
39      {
40        name: 'videoExportPreset',
41        type: 'enum',
42        platforms: ['ios'],
43        values: [
44          {
45            name: 'VideoExportPreset.Passthrough',
46            value: ImagePicker.VideoExportPreset.Passthrough,
47          },
48          {
49            name: 'VideoExportPreset.LowQuality',
50            value: ImagePicker.VideoExportPreset.LowQuality,
51          },
52          {
53            name: 'VideoExportPreset.MediumQuality',
54            value: ImagePicker.VideoExportPreset.MediumQuality,
55          },
56          {
57            name: 'VideoExportPreset.HighestQuality',
58            value: ImagePicker.VideoExportPreset.HighestQuality,
59          },
60          {
61            name: 'VideoExportPreset.H264_640x480',
62            value: ImagePicker.VideoExportPreset.H264_640x480,
63          },
64          {
65            name: 'VideoExportPreset.H264_960x540',
66            value: ImagePicker.VideoExportPreset.H264_960x540,
67          },
68          {
69            name: 'VideoExportPreset.H264_1280x720',
70            value: ImagePicker.VideoExportPreset.H264_1280x720,
71          },
72          {
73            name: 'VideoExportPreset.H264_1920x1080',
74            value: ImagePicker.VideoExportPreset.H264_1920x1080,
75          },
76          {
77            name: 'VideoExportPreset.H264_3840x2160',
78            value: ImagePicker.VideoExportPreset.H264_3840x2160,
79          },
80          {
81            name: 'VideoExportPreset.HEVC_1920x1080',
82            value: ImagePicker.VideoExportPreset.HEVC_1920x1080,
83          },
84          {
85            name: 'VideoExportPreset.HEVC_3840x2160',
86            value: ImagePicker.VideoExportPreset.HEVC_3840x2160,
87          },
88        ],
89      },
90      {
91        name: 'videoQuality',
92        type: 'enum',
93        platforms: ['ios'],
94        values: [
95          {
96            name: 'UIImagePickerControllerQualityType.High',
97            value: ImagePicker.UIImagePickerControllerQualityType.High,
98          },
99          {
100            name: 'UIImagePickerControllerQualityType.Medium',
101            value: ImagePicker.UIImagePickerControllerQualityType.Medium,
102          },
103          {
104            name: 'UIImagePickerControllerQualityType.Low',
105            value: ImagePicker.UIImagePickerControllerQualityType.Low,
106          },
107          {
108            name: 'UIImagePickerControllerQualityType.VGA640x480',
109            value: ImagePicker.UIImagePickerControllerQualityType.VGA640x480,
110          },
111          {
112            name: 'UIImagePickerControllerQualityType.IFrame960x540',
113            value: ImagePicker.UIImagePickerControllerQualityType.IFrame960x540,
114          },
115          {
116            name: 'UIImagePickerControllerQualityType.IFrame1280x720',
117            value: ImagePicker.UIImagePickerControllerQualityType.IFrame1280x720,
118          },
119        ],
120      },
121      {
122        name: 'allowsMultipleSelection',
123        type: 'boolean',
124        initial: false,
125      },
126      {
127        name: 'selectionLimit',
128        type: 'number',
129        values: [0, 1, 3],
130        platforms: ['ios', 'android'],
131      },
132      {
133        name: 'orderedSelection',
134        type: 'boolean',
135        initial: false,
136        platforms: ['ios'],
137      },
138      { name: 'videoMaxDuration', type: 'number', values: [0, 10, 60] },
139      {
140        name: 'presentationStyle',
141        type: 'enum',
142        platforms: ['ios'],
143        values: [
144          {
145            name: 'UIImagePickerPresentationStyle.FULL_SCREEN',
146            value: ImagePicker.UIImagePickerPresentationStyle.FULL_SCREEN,
147          },
148          {
149            name: 'UIImagePickerPresentationStyle.PAGE_SHEET',
150            value: ImagePicker.UIImagePickerPresentationStyle.PAGE_SHEET,
151          },
152          {
153            name: 'UIImagePickerPresentationStyle.FORM_SHEET',
154            value: ImagePicker.UIImagePickerPresentationStyle.FORM_SHEET,
155          },
156          {
157            name: 'UIImagePickerPresentationStyle.CURRENT_CONTEXT',
158            value: ImagePicker.UIImagePickerPresentationStyle.CURRENT_CONTEXT,
159          },
160          {
161            name: 'UIImagePickerPresentationStyle.OVER_FULL_SCREEN',
162            value: ImagePicker.UIImagePickerPresentationStyle.OVER_FULL_SCREEN,
163          },
164          {
165            name: 'UIImagePickerPresentationStyle.OVER_CURRENT_CONTEXT',
166            value: ImagePicker.UIImagePickerPresentationStyle.OVER_CURRENT_CONTEXT,
167          },
168          {
169            name: 'UIImagePickerPresentationStyle.POPOVER',
170            value: ImagePicker.UIImagePickerPresentationStyle.POPOVER,
171          },
172          {
173            name: 'UIImagePickerPresentationStyle.AUTOMATIC',
174            value: ImagePicker.UIImagePickerPresentationStyle.AUTOMATIC,
175          },
176        ],
177      },
178    ],
179  },
180];
181
182const FUNCTIONS_DESCRIPTIONS: FunctionDescription[] = [
183  {
184    name: 'requestMediaLibraryPermissionsAsync',
185    parameters: [{ name: 'writeOnly', type: 'boolean', initial: false }],
186    actions: (writeOnly: boolean) => ImagePicker.requestMediaLibraryPermissionsAsync(writeOnly),
187  },
188  {
189    name: 'getMediaLibraryPermissionsAsync',
190    parameters: [{ name: 'writeOnly', type: 'boolean', initial: false }],
191    actions: (writeOnly: boolean) => ImagePicker.getMediaLibraryPermissionsAsync(writeOnly),
192  },
193  {
194    name: 'requestCameraPermissionsAsync',
195    actions: () => ImagePicker.requestCameraPermissionsAsync(),
196  },
197  {
198    name: 'getCameraPermissionsAsync',
199    actions: () => ImagePicker.getCameraPermissionsAsync(),
200  },
201  {
202    name: 'launchImageLibraryAsync',
203    parameters: LAUNCH_PICKER_PARAMETERS,
204    actions: (options: ImagePicker.ImagePickerOptions) =>
205      ImagePicker.launchImageLibraryAsync(options),
206  },
207  {
208    name: 'launchCameraAsync',
209    parameters: LAUNCH_PICKER_PARAMETERS,
210    actions: (options: ImagePicker.ImagePickerOptions) => ImagePicker.launchCameraAsync(options),
211  },
212];
213
214function ImagePickerScreen() {
215  return (
216    <ScrollView contentContainerStyle={styles.container}>
217      {FUNCTIONS_DESCRIPTIONS.map((props, idx) => (
218        <FunctionDemo
219          key={idx}
220          namespace="ImagePicker"
221          {...props}
222          renderAdditionalResult={ImagePickerAssetsList}
223        />
224      ))}
225    </ScrollView>
226  );
227}
228
229ImagePickerScreen.navigationOptions = {
230  title: 'ImagePicker',
231};
232
233const styles = StyleSheet.create({
234  container: {
235    paddingHorizontal: 10,
236    justifyContent: 'center',
237  },
238});
239
240export default ImagePickerScreen;
241