react native image editor Download react native image editor 소스 코드 다운로드

다운로드

@React-Native-Community/Image-Editor

React Native의 이미지 편집기 기본 모듈.

원래 React Native issue#23313 에서 추출되어 커뮤니티가 유지합니다.

yarn add @react-native-community/image-editor
# or
npm install @react-native-community/image-editor --save

npx pod-install

라이브러리 가져 오기로 시작하십시오.

 import ImageEditor from '@react-native-community/image-editor' ;

URI Param에 지정된 이미지를 자릅니다. URI가 원격 이미지를 가리키면 자동으로 다운로드됩니다. 이미지를로드/다운로드 할 수 없으면 약속이 거부됩니다.

자르기 프로세스가 성공하면 결과적인 자르기 이미지가 캐시 경로에 저장되고 약속으로 반환 된 CropResult 캐시 경로의 이미지를 가리킬 것입니다. 켈 캐시 경로에서 잘린 이미지를 완료하면 자른 이미지를 삭제해야합니다.

 ImageEditor . cropImage ( uri , cropData ) . then ( ( result ) => {
  console . log ( 'Cropped image uri:' , result . uri ) ;
} ) ;

이름	유형	설명
`offset`	`{ x: number, y: number }`	원래 이미지의 좌표 공간에 지정된 자른 이미지의 왼쪽 상단 코너
`size`	`{ width: number, height: number }`	자른 이미지의 크기 (치수)
`displaySize` (선택 과목)	`{ width: number, height: number }`	자른 이미지를 확장하려는 크기
`resizeMode` (선택 과목)	`'contain' \| 'cover' \| 'stretch' \| 'center'`	이미지를 스케일링 할 때 사용할 모드 크기 조정 (iOS 만, Android Resize Mode는 항상 `'cover'` , 웹 - 지원 없음) 기본값 : `'cover'`
`quality` (선택 과목)	`number`	`1.0` `0.0` 의 값 결과 이미지의 압축 수준을 지정합니다. `1` 압축 (최고 품질)과 `0` 최고 압축 (가장 낮은 품질)을 의미합니다. 기본값 : `0.9`
`format` (선택 과목)	`'jpeg' \| 'png' \| 'webp'`	결과 이미지의 형식. 기본값 : 제공된 이미지를 기반으로합니다. 값 결정이 불가능한 경우 `'jpeg'` 폴백으로 사용됩니다. `'webp'` iOS에서 지원하지 않습니다.
`includeBase64` (선택 과목)	`boolean`	Base64 형식의 그림 데이터도 `CropResult` 에 포함되어야하는지 여부를 나타냅니다. 기본값 : `false`
`headers` (선택 과목)	`object \| Headers`	원격 이미지에 대한 요청과 함께 전송할 HTTP 헤더를 나타내는 객체 또는 `Headers` 인터페이스.

이름	유형	설명
`uri`	`string`	이미지 파일의 경로 (예 : `'file:///data/user/0/.../image.jpg'` ) Web : `uri` 는 데이터 URI 문자열입니다 (예 `'data:image/jpeg;base64,/4AAQ...AQABAA'` )
`path`	`string`	이미지의 uri (예 : `'/data/user/0/.../image.jpg'` ) Web : `path` 는 Blob URL입니다 (예 : `'blob:https://example.com/43ff7a16...e46b1'` )
`name`	`string`	이미지 파일의 이름. (예 : `'image.jpg'` )
`width`	`number`	픽셀의 이미지의 너비
`height`	`number`	픽셀에서 이미지의 높이
`size`	`number`	바이트의 이미지의 크기
`type`	`string`	이미지의 마임 유형 ( `'image/jpeg'` , `'image/png'` , `'image/webp'` )
`base64` (선택 과목)	`string`	Base64- 인코딩 된 이미지 데이터 예 : `'/9j/4AAQSkZJRgABAQAAAQABAAD'` 예를 들어 `Image` 요소의 `source` 로 데이터 URI가 필요한 경우 `data:${type};base64,${base64}`