1# 通过系统相机拍照和录像(ArkTS)
2
3应用可调用CameraPicker拍摄照片或录制视频，无需申请相机权限。
4CameraPicker的相机交互界面由系统提供，在用户点击拍摄和确认按钮后，调用CameraPicker的应用获取对应的照片或者视频。
5
6应用开发者如果只是需要获取即时拍摄的照片或者视频，则可以使用CameraPicker能力来轻松实现。
7
8由于照片的拍摄和确认都是由用户进行主动确认，因此应用开发者可以不用申请操作相机的相关权限。
9
10## 约束与限制
11
12在应用调试时，开发者需在release模式下调用系统相机（CameraPicker）。
13
14由于系统限制了debug模式下不允许调试release应用，在debug模式下调用系统相机，将导致异常。
15
16## 开发步骤
17
18详细的API说明请参考[CameraPicker API参考](../../reference/apis-camera-kit/js-apis-cameraPicker.md)。
19
201. 导入相关接口，导入方法如下。
21   ```ts
22   import { camera, cameraPicker as picker } from '@kit.CameraKit'
23   import { fileIo, fileUri } from '@kit.CoreFileKit'
24   ```
25
262. 配置[PickerProfile](../../reference/apis-camera-kit/js-apis-cameraPicker.md#pickerprofile)。
27
28   > **说明：**
29   >
30   > PickerProfile的saveUri为可选参数，如果未配置该项，拍摄的照片和视频默认存入媒体库中。
31   >
32   > 如果不想将照片和视频存入媒体库，请自行配置应用沙箱内的文件路径。
33   > 应用沙箱内的这个文件必须是一个存在的、可写的文件。这个文件的uri传入picker接口之后，相当于应用给系统相机授权该文件的读写权限。系统相机在拍摄结束之后，会对此文件进行覆盖写入。
34
35   ```ts
36   let pathDir = getContext().filesDir;
37   let fileName = `${new Date().getTime()}`
38   let filePath = pathDir + `/${fileName}.tmp`
39   fileIo.createRandomAccessFileSync(filePath, fileIo.OpenMode.CREATE);
40
41   let uri = fileUri.getUriFromPath(filePath);
42   let pickerProfile: picker.PickerProfile = {
43     cameraPosition: camera.CameraPosition.CAMERA_POSITION_BACK,
44     saveUri: uri
45   };
46   ```
47
483. 调用picker拍摄接口获取拍摄的结果。
49   ```ts
50   let result: picker.PickerResult =
51     await picker.pick(getContext(), [picker.PickerMediaType.PHOTO, picker.PickerMediaType.VIDEO],
52       pickerProfile);
53   console.info(`picker resultCode: ${result.resultCode},resultUri: ${result.resultUri},mediaType: ${result.mediaType}`);
54   ```
55
56## 完整示例
57   ```ts
58   import { camera, cameraPicker as picker } from '@kit.CameraKit'
59   import { fileIo, fileUri } from '@kit.CoreFileKit'
60
61   @Entry
62   @Component
63   struct Index {
64     @State imgSrc: string = '';
65     @State videoSrc: string = '';
66
67     build() {
68       RelativeContainer() {
69         Column() {
70           Image(this.imgSrc).width(200).height(200).backgroundColor(Color.Black).margin(5);
71           Video({ src: this.videoSrc}).width(200).height(200).autoPlay(true);
72           Button("Test Picker Photo&Video").fontSize(20)
73             .fontWeight(FontWeight.Bold)
74             .onClick(async () => {
75               let pathDir = getContext().filesDir;
76               let fileName = `${new Date().getTime()}`
77               let filePath = pathDir + `/${fileName}.tmp`
78               fileIo.createRandomAccessFileSync(filePath, fileIo.OpenMode.CREATE);
79
80               let uri = fileUri.getUriFromPath(filePath);
81               let pickerProfile: picker.PickerProfile = {
82                 cameraPosition: camera.CameraPosition.CAMERA_POSITION_BACK,
83                 saveUri: uri
84               };
85               let result: picker.PickerResult =
86                 await picker.pick(getContext(), [picker.PickerMediaType.PHOTO, picker.PickerMediaType.VIDEO],
87                   pickerProfile);
88               console.info(`picker resultCode: ${result.resultCode},resultUri: ${result.resultUri},mediaType: ${result.mediaType}`);
89               if (result.resultCode == 0) {
90                 if (result.mediaType === picker.PickerMediaType.PHOTO) {
91                   this.imgSrc = result.resultUri;
92                 } else {
93                   this.videoSrc = result.resultUri;
94                 }
95               }
96             }).margin(5);
97
98         }.alignRules({
99           center: { anchor: '__container__', align: VerticalAlign.Center },
100           middle: { anchor: '__container__', align: HorizontalAlign.Center }
101         });
102       }
103       .height('100%')
104       .width('100%')
105     }
106   }
107   ```