개요
이미지를 처리하기 위해 제공되는 오브젝트입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
- src 속성을 사용하여 로딩된 이미지는 크기정보를 속성으로 얻을수 있습니다. - Base64 로 인코딩된 이미지 정보를 처리할 수 있는 메소드를 제공합니다.
속성
height
Image 오브젝트의 src 속성에 로드된 이미지의 높이값을 갖는 읽기전용 속성입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
속성 타입
☐ Enum | ☐ Expr | ☐ Control | ☑ Hidden | ☑ ReadOnly | ☐ Bind | ☐ Collection | ☐ StringResource |
참고
- src 속성값이 설정된 후 정상적으로 이미지가 로드되면 height 속성값이 자동으로 설정됩니다.
src
Image 오브젝트에 로드 할 이미지 파일의 위치 경로를 설정하는 속성입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
속성 타입
☐ Enum | ☐ Expr | ☐ Control | ☐ Hidden | ☐ ReadOnly | ☐ Bind | ☐ Collection | ☐ StringResource |
문법 설정
strImgpath ::= 'URL(' <theme-Image> | <web-Image> | <absolute-image> | <relative-image> ')' | ||
var objImg = new nexacro.Image(); objImg.src = "URL('theme://images/V13_logo.png')"; // 테마 이미지 objImg.src = "URL('http://www.tobesoft.com/images/gnb/btn_h1.gif')"; // 웹 이미지 objImg.src = "URL('file://C:\\xplatform_logo.gif')"; // 절대경로 이미지 objImg.src = "URL('Base::test.jpg')"; // TypeDefinition Prefix 이미지 objImg.src = "URL('./test.jpg')"; // 상대경로 이미지 | ||
<theme-Image> | 테마에 정의된 이미지를 "theme://images/이미지명" 형식으로 설정합니다. 테마에 해당 이미지가 등록되어 있어야 합니다. | |
|---|---|---|
<web-Image> | 웹의 이미지를 "http://경로/이미지명", "https://경로/이미지명" 형식으로 설정합니다. 웹에 접근 가능한 환경이어야 합니다. | |
<absolute-image> | 로컬에 정의된 이미지를 "file://절대경로" 형식으로 설정합니다. 또는 TypeDefinition 영역의 Services 에 정의된 Prefix를 사용한 형식으로 설정합니다. | |
<relative-image> | 폼의 위치를 기준으로 한 상대경로를 사용하여 설정합니다. | |
참고
- 이미지 데이터 전체를 로드하지 않고 이미지 파일에 대한 핸들을 관리합니다.
width
Image 오브젝트의 src 속성에 로드된 이미지의 너비값을 갖는 읽기전용 속성입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
속성 타입
☐ Enum | ☐ Expr | ☐ Control | ☑ Hidden | ☑ ReadOnly | ☐ Bind | ☐ Collection | ☐ StringResource |
참고
- src 속성값이 설정된 후 정상적으로 이미지가 로드되면 width 속성값이 자동으로 설정됩니다.
메서드
getBase64String
Image 오브젝트에 저장된 Base64 인코딩 데이터를 반환하는 메소드입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
문법
Image.getBase64String([bOnlydata]);
파라미터
Parameters | Type | Description | |
|---|---|---|---|
bOnlydata | Boolean | false: Data URI 형태로 반환 true: Data URI 형태 중 Base64 인코딩 데이터만 반환 값을 설정하지 않으면 false로 설정됩니다. | |
var strBase64 = objImg.getBase64String(); // data:image/png;base64,iVBORw0KGgoAAAA.... var strBase64 = objImg.getBase64String(true); // iVBORw0KGgoAAAA.... | |||
반환
Type | Description |
|---|---|
String | Image 오브젝트에 저장된 Base64 데이터를 반환합니다. |
참고
- src 속성에 설정된 이미지정보와 별개로 Image 오브젝트에 저장된 Base64 인코딩 데이터를 반환합니다. - src 속성에 설정된 이미지를 Base64 인코딩 데이터로 반환하는 메소드가 아닙니다. setBase64String 메소드를 실행해 저장했거나 Sketch 컴포넌트의 value 속성 등에 저장된 Base64 데이터를 반환하는 메소드입니다.
setBase64String
Image 오브젝트에 Base64 로 인코딩 된 데이터를 저장하는 메소드입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
문법
Image.setBase64String(strBase64);
파라미터
Parameters | Type | Description | |
|---|---|---|---|
strBase64 | String | Base64 로 인코딩 된 이미지 데이터를 설정합니다. | |
참고
- Image 오브젝트의 src 속성에 설정된 이미지정보와 별개로 Base64 인코딩 데이터를 저장하는 메소드입니다.
이벤트
onerror
src 속성에 설정한 이미지 로드에 실패했을때 발생하는 이벤트입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
문법
onerror(obj:nexacro.Image,e:nexacro.ErrorEventInfo);
파라미터
Parameters | Type | Description | |
|---|---|---|---|
obj | Image | Event가 발생한 Object. | |
e | Event Object. | ||
onload
src 속성에 설정한 이미지 로드에 성공했을때 발생하는 이벤트입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
문법
onload(obj:nexacro.Image,e:nexacro.LoadEventInfo);
파라미터
Parameters | Type | Description | |
|---|---|---|---|
obj | Image | Event가 발생한 Object. | |
e | Event Object. | ||
참고
- 이미지 데이터를 로드하지 않고 이미지 파일에 대한 핸들을 관리합니다.