개요

PopupDiv는 하나의 화면에 여러개의 부분화면을 구성할 때 사용하는 컴포넌트입니다.

PopupDiv로 구성하게 되면 주 화면과 독립적 또는 연계하여 화면을 구성할 수 있습니다.
Div 컴포넌트와 비슷하나 PopupDiv 는 포커스를 잃게 되면 자동으로 사라지게 됩니다.

지원 환경

- PopupDiv는 화면의 구성을 수월하게 하고, 화면을 분할해서, Form에 대한 재사용성을 높일 수있습니다.
  그러나 PopupDiv의 단계수가 늘어나게 되면, 화면의 구성이 느려지게 되고, 초기화 시간을 길게 만듭니다.

- PopupDiv를 사용할 때에는 2~3단계정도의 깊이로 사용하는 것이 효율적입니다.
  1개의 화면에 대해 2~3단계의 PopupDiv가 다수있는 쪽이 4~5단계의 PopupDiv를 사용하는 것보다 화면 구성이 빠릅니다.

컴포넌트 구조

컴포넌트, 내부 컨텐츠 크기

PopupDiv 컴포넌트의 크기를 결정하는 기준입니다.

Basic Key Action

생성자

PopupDiv.init( strName, vLeft, vTop , vWidth, vHeight [, vRight, vBottom, [vMinWidth, [vMaxWidth, [vMinHeight, [vMaxHeight]]]]] )

var objComp = new PopupDiv();

objComp.init( "PopupDiv00", 30, 120, 196, 46 );
objComp.init( "PopupDiv00", 30, 120, 196, 46, null, null );
objComp.init( "PopupDiv00", null, null, 300, "400px", "80%", 300 );
objComp.init( "PopupDiv00", 0, 0, 200, 100, null, null, 300, 500, 200, 500 );
objComp.init( "PopupDiv00", "PopupDiv22:10", 300, null, null, "PopupDiv33:10", "20%", 300, 500, 200, 500 );

// Create Object  
var objPopupDiv = new PopupDiv();  
objPopupDiv.init("PopupDiv", 30, 120, 196, 46, null, null);
objPopupDiv.init("PopupDiv", null, null, 300, "400px", "80%", 300);
or
var objPopupDiv = new PopupDiv("PopupDiv", 30, 120, 196, 46, null, null);
var objPopupDiv = new PopupDiv("PopupDiv", null, null, 300, "400px", "80%", 300);
 
// Add Object to Parent Form  
this.addChild("PopupDiv", objPopupDiv); 
 
// Insert Object to Parent Form  
this.insertChild(1, "PopupDiv", objPopupDiv); 
 
// Remove Object form Parent Form  
this.removeChild("PopupDiv"); 
 
// Show Object  
objPopupDiv.show(); 
 
// Destroy Object  
objPopupDiv.destroy(); 
objPopupDiv = null;

Status

속성

async

PopupDiv 의 url 속성값을 동적으로 변경 시 연결된 Form 의 로딩방식을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.async[= bAsync]

문법 설정

bAsync ::= 'true' | 'false'

this.PopupDiv00.async = false;

참고

- async 속성값을 설정하지 않으면 true 로 적용됩니다.

- PopupDiv 를 포함한 Form 이 최초 로딩될 때 PopupDiv 에 url 속성으로 연결된 Form 은 async 속성값에 관계없이 항상 동기(Sync)방식으로 로딩됩니다.

- PopupDiv 에 연결된 Form 내부에서 PopupDiv 의 url 속성을 변경 시 async 속성값이 false 일 경우 오동작 할 수 있습니다.
   async 속성값이 false 이면 PopupDiv 의 url 속성을 변경하는 즉시 새로운 Form 이 로드되고 기존 Form이 제거되므로
   스크립트가 끝나기 전에 해당 오브젝트가 제거되서 문제가 발생할 수 있습니다.

- async 속성값이 true 일 때 url 속성을 변경한 위치 이후의 스크립트 수행 기준은 PopupDiv 에 연결된 Form 의 캐시여부에 따라 달라집니다.
   Form 이 넥사크로가 관리하는 캐시에서 로드될 경우는 Form 의 로드가 완료된 이후에 나머지 스크립트가 수행됩니다.
   Form 이 서버 또는 브라우저 캐시에서 로드될 경우는 Form 의 로드와 관계없이 나머지 스크립트가 수행됩니다.

background

PopupDiv 의 배경 영역을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.background[= strbackground]

문법 설정

strBackground ::= [<bg-image> | <linear-gradient>] [<background-origin> [<background-clip>]] [<background-color>]

<bg-image> ::= 'none' | <imageurl> [<repeat-style>] [<position>]
   <imageurl> ::= 'URL(' <Theme-Image> | <Web-Image> ')'
   <repeat-style> ::= 'repeat-x' | 'repeat-y' | 'repeat' | 'no-repeat'
   <position> ::= <horizontal-position> <vertical-position> ['/' <background-size>]
      <horizontal-position> ::= 'left' | 'center' | 'right' | <pos-percentage> '%'
      <vertical-position> ::= 'top' | 'center' | 'bottom' | <pos-percentage> '%'
      <background-size> ::= 'auto' | 'cover' | 'contain' | (<length> 'px' | <percentage> '%') {1,2}

<linear-gradient> ::= 'linear-gradient(' [<angle> , ] <color-stop> ')'
   <angle> ::= 'to left' | 'to right' | 'to top' | 'to bottom' | 'to left top' | 'to left bottom' | 'to right top' | 'to right bottom'
   <color-stop> ::= <startcolor-stop> [<listcolor-stop>] <endcolor-stop>
      <startcolor-stop> ::= <color> [<percentage>'%']
      <endcolor-stop> ::= <color> [<percentage>'%']
      <listcolor-stop> ::= <color> [<percentage>'%"] [,<listcolor-stop>]*
         <color> ::= <NamedColor> | <NumericColor>

<background-origin> ::= 'border-box' | 'padding-box'
<background-clip> ::= 'border-box' | 'padding-box'
<background-color> ::= <NamedColor> | <NumericColor>

* XCSS
background : #ffffaa;
background : "URL('./images/smiley.gif')" no-repeat center center #ffffaa;
background : "URL('./images/smiley.gif')" no-repeat center center /auto #ffffaa;
background : "URL('./images/smiley.gif')" no-repeat center center /15px 15% #ffffaa;
background : linear-gradient( red , blue , yellow );
background : linear-gradient( #FF0000 , rgb(0,0,255) , rgb(255,255,0));
background : "URL('./images/smiley.gif')" border-box border-box #ffffaa;

* Script ( normal property )
this.PopupDiv00.background = "#ffffaa";
this.PopupDiv00.background = ""URL('./images/smiley.gif')" no-repeat center center #ffffaa";
this.PopupDiv00.background = ""URL('./images/smiley.gif')" no-repeat center center /auto #ffffaa";
this.PopupDiv00.background = ""URL('./images/smiley.gif')" no-repeat center center /15px 15% #ffffaa";
this.PopupDiv00.background = "linear-gradient( red , blue , yellow )";
this.PopupDiv00.background = "linear-gradient( #FF0000 , rgb(0,0,255) , rgb(255,255,0))";
this.PopupDiv00.background = ""URL('./images/smiley.gif')" border-box border-box #ffffaa";

참고

- background 속성값을 설정하지 않으면 undefined 가 설정되고, "transparent" 로 동작합니다.

- TypeDefinition 영역의 Services 에 정의된 사용자 Prefix 는 테마 또는 XCSS 에서 이미지경로로 사용할 수 없습니다.
   사용자 Prefix 는 스크립트 또는 넥사크로 스튜디오에서 속성값으로 설정 시 사용할 수 있습니다.

- 배경의 기준영역과 표시영역은 <background-origin>, <background-clip> 값으로 각각 설정합니다.

- 배경 이미지를 중앙에 위치시키려면 <position> 값을 "center" 또는 "center center" 로 설정하여야 합니다.

- 배경이미지와 배경색을 모두 설정하면 배경색 위에 이미지가 표시됩니다.
   그라데이션과 배경색을 모두 설정하면 배경색 위에 그라데이션이 표시됩니다.

- 그라데이션과 배경이미지를 동시에 설정할 수 없습니다.
   두 값을 동시에 설정 시 오동작이 발생할 수 있습니다.

border-radius

PopupDiv 의 모서리 모양을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.borderRadius[= strborderradius]

문법 설정

strborderradius ::= <horizontal-radius>{4} ['/' <vertical-radius>{4}]

* XCSS
border-radius : 10px;
border-radius : 5px 6px 10px / 5px 10px;

* Script ( normal property )
this.PopupDiv00.borderRadius = "10px";
this.PopupDiv00.borderRadius = "5px 6px 10px / 5px 10px";

참고

- border-radius 속성값을 설정하지 않으면 undefined 가 설정되고, "0px" 로 동작합니다. 

- 스크립트로 접근 시 속성명은 "borderRadius" 를 사용해야 합니다.

- <horizontal-radius>와 <vertical-radius>는 "/" 문자로 구분하여 입력합니다.

- Calendar, Combo 와 같이 하위 컨트롤이 존재하는 컴포넌트는 하위컨트롤에도 border-radius 속성을 설정해야 정상적으로 모서리가 표시됩니다.


◆ NRE 제약

- border-radius 속성을 설정하면 모든 테두리가 같은 색으로 적용됩니다.
   -nexa-border 속성에서 top 에 적용된 색이 모든 테두리에 적용됩니다.

bottom

PopupDiv 을(를) 표시하기 위한 하단 좌표값을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.bottom[= nBottom]

문법 설정

nBottom ::= [<strCompID> ':'] <nVal> ['px' | '%' | 'em' | 'rem']

this.PopupDiv00.bottom = 10; 
this.PopupDiv00.bottom = "10px"; 
this.PopupDiv00.bottom = "10%"; 
this.PopupDiv00.bottom = "Button00:10px"; 
this.PopupDiv00.bottom = "Button00:10%";

참고

- 좌표값에 단위를 생략할 경우 pixel 값으로 적용됩니다.

- 좌표값에 기준 컴포넌트 또는 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

◆ 기준 컴포넌트 설정 시 유의할 점

- 속성값을 기준 컴포넌트(<strCompID>)를 참조하도록 설정한 경우 다음 사항을 유의해주세요.

스크립트로 속성값에 설정한 기준 컴포넌트 값(<strCompID>)을 변경하는 경우 유효한 컴포넌트 값이 아니면(잘못된 컴포넌트 id, 부모 또는 stepindex가 다른 컴포넌트) 기준 컴포넌트 값은 무시하고 부모를 기준으로 좌표값(<nVal>)을 적용합니다.
스크립트로 기준 컴포넌트의 크기나 위치 속성값을 변경되는 경우(속성값에 영향을 주는 메소드 실행으로 인한 변경 포함) 변경된 속성값이 기준 컴포넌트를 참조하는 컴포넌트에 바로 반영되지 않습니다.
예를 들어 Button01 컴포넌트의 left 속성값이 "Button00:10px"인 경우 스크립트로 Button00 컴포넌트의 right 속성값이 변경하더라도 Button01 컴포넌트의 위치는 변경되지 않습니다.
기준 컴포넌트의 크기나 위치 속성값이 변경된 것을 기준 컴포넌트를 참조하는 컴포넌트에 반영하려면 스크립트에서 기준 컴포넌트의 크기나 위치 속성값 변경 후 Form 오브젝트의 resetScroll 메소드를 실행해주어야 합니다.

box-shadow

PopupDiv 에 그림자 효과를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.boxShadow[= strbshadow]

문법 설정

strbshadow ::= 'none' | [<inset>] <offset> [<blur>'px'] [<spread>'px'] [<color>]

<offset> ::= <horizontal>'px' <vertical>'px'
<color> ::= <NamedColor> | <NumericColor>

* XCSS
box-shadow : 10px 10px 10px #888888;
box-shadow : inset 10px 10px 10px 5px #888888

* Script ( normal property )
this.PopupDiv00.boxShadow  = "10px 10px 10px #888888";
this.PopupDiv00.boxShadow  = "inset 10px 10px 10px 5px #888888";

참고

- box-shadow 속성값을 설정하지 않으면 undefined 가 설정되고, "none" 으로 동작합니다.

- 스크립트로 접근 시 속성명은 "boxShadow" 를 사용해야 합니다.

- <blur> 값을 크게 설정하면 시스템 자원 요구량이 많아져 성능 저하의 원인이 됩니다.

- <inset>, <spread> 값은 NRE를 지원하지 않습니다. 
  넥사크로 스튜디오 디자인 창에서도 속성값 설정 시 변경된 디자인을 확인할 수 없습니다.


◆ web runtime environment 제약

- XCSS 를 사용하지 않고 rgba(), hsl(), hsla() 메소드를 속성에 직접 설정할 경우 브라우저 버전에 따라 적용되지 않을 수 있습니다.

color

PopupDiv 에 표시되는 텍스트의 색상을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.color[= strcolor]

문법 설정

strcolor ::= <NamedColor> | <NumericColor>

* XCSS
color : #999999;
color : rgb ( 255, 0, 0 );
color : red;

* Script ( normal property )
this.PopupDiv00.color = "#999999";
this.PopupDiv00.color = "rgb(255,0,0)";
this.PopupDiv00.color = "red";

참고

- color 속성값을 설정하지 않으면 undefined 가 설정되고, "#000000" 으로 동작합니다.


◆ web runtime environment 제약

- XCSS 를 사용하지 않고 rgba(), hsl(), hsla() 메소드를 속성에 직접 설정할 경우 브라우저 버전에 따라 적용되지 않을 수 있습니다.

cssclass

PopupDiv 의 Style 을 XCSS 파일에 정의된 class 로 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.cssclass[= strcssclass]

문법 설정

strcssclass ::= <ClassName> [ , &ltClassName> ]*

this.PopupDiv00.cssclass = "TestClass"; 
this.PopupDiv00.cssclass = "TestClass,TestClass2";

참고

- XCSS 에 정의된 ".classname" 형식에서 "." 를 제외하고 "classname" 만 설정합니다.

- Style 에 적용되는 방식은 XCSS Attribute 지정과 동일하게 XCSS 내의 순서대로 적용됩니다.

- Status 를 적용하고자 할 경우는 "classname" 에 Status 를 붙여서 사용합니다.

- ',' 를 사용하여 class 를 다중으로 지정하게 되면 class 가 중첩되어 적용됩니다.
   중첩된 class 의 내용에 중복이 있다면 XCSS 내의 순서상 마지막으로 기술된 것이 적용됩니다.


◆ web runtime environment 제약

- web runtime environment 는 cssclass 명의 첫문자가 숫자일 경우 속성값이 적용되지 않으므로 주의하여야 합니다.

cursor

PopupDiv 영역에서 표시될 마우스 포인터의 종류를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.cursor[= strCursor]

문법 설정

strCursor ::= 'none' | 'auto' | 'default' | 'copy' | 'crosshair' | 'help' | 'move' | 'not-allowed' | 'pointer' | 'progress' | 'text' | 'wait' | 'ew-resize' | 'e-resize' | 'w-resize' | 'ns-resize' | 'n-resize' | 's-resize' | 'nesw-resize' | 'ne-resize' | 'sw-resize' | 'nwse-resize' | 'nw-resize' | 'se-resize'

* XCSS
cursor : default;

* Script ( normal property )
this.PopupDiv00.cursor = "default";

참고

- cursor 속성값을 설정하지 않으면 undefined 가 설정되고 "auto" 로 동작합니다.

- disable 상태인 서브컨트롤이 있는 컴포넌트의 경우 마우스 포인터는 서브컨트롤 영역에서
   서브컨트롤의 disable status값이 적용되지 않고, 컴포넌트의 enable status 설정값이 적용됩니다.
   서브컨트롤과 컴포넌트가 모두 disable 상태일 때는 parent 의 enable status 설정값이 적용됩니다.

enable

PopupDiv 의 사용가능 여부를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.enable[= benable]

문법 설정

benable ::= 'true' | 'false'

this.PopupDiv00.enable = true; 
this.PopupDiv00.enable = false;

참고

- enable 속성값을 설정하지 않으면 true 로 적용됩니다.

- enable 속성값이 false 이면 컴포넌트가 화면에 표시되지만 포커스나 입력을 받을 수 없습니다.

- Div 와 같은 컨테이너 컴포넌트의 enable 속성값을 false 로 설정하면 자식 컴포넌트도 모두 Disable 됩니다.

enableevent

PopupDiv 에서 이벤트를 발생시킬지 여부를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.enableevent[= bEvent]

문법 설정

bEvent ::= 'true' | 'false'

this.PopupDiv00.enableevent = true;  

this.PopupDiv00.enableevent = false;

참고

- enableevent 속성을 false 로 설정하면 이벤트 발생으로 인한 처리속도 지연과 화면 깜빡임을 방지할 수 있습니다.

font

PopupDiv 에서 사용하는 폰트를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.font[= strfont]

문법 설정

strfont ::= [<font-style>] [<font-weight>] <font-size> ['/'<line-height>] <font-family>

<font-style> ::= 'normal' | 'italic'
<font-weight> ::= 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900'
<font-size> ::= <nSize> 'px'|'pt'|'em'|'rem'
<line-height> ::= 'normal' | <nValue> | <nPixel>'px' | <nPercent>'%'
<font-family> ::= <font-name> [',' <font-name>]*

* XCSS
font : bold 12pt/30px arial, sans-serif;

* Script ( normal property )
this.PopupDiv00.font = "bold 12pt/30px arial, sans-serif";

참고

- font 속성값을 설정하지 않으면 undefined 가 설정되고, "12pt/normal Verdana" 로 동작합니다.

- font 속성의 폰트 크기가 변경되면 <line-height> 에 적용된 값에 따라 줄간격이 변경될 수 있습니다.

- <font-weight> 를 수치로 설정 시 "400" 값이 일반적인 굵기로 적용되고, "700" 값이 "bold" 로 적용됩니다.
   폰트에 수치값에 해당하는 폰트굵기가 없다면 "400" 과 "700" 중 가까운 값으로 표시됩니다.

- UserFont 사용 시 환경별로 지원하는 포맷정보는 "Appendix > Supported UserFont" 항목을 참고하세요.


◆ WRE 제약

- -nexa-text-align 속성값이 "right" 일 때 font 속성에 "italic" 을 설정하면 마지막 텍스트의 기울어진 부분이 잘려서 표시될 수 있습니다.
   웹브라우저에서 텍스트영역을 일반글자 기준으로 처리한 후 기울임을 적용하면서 발생하는 문제입니다.

form

PopupDiv에서 모든 오브젝트가 등록된 Form을 갖는 읽기전용 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.form

문법 설정

this.PopupDiv00.form.Button00.click();

참고

- PopupDiv 내부에 정의된 컴포넌트에 접근하기 위해서는 form 속성을 사용하여야 합니다.

- url 속성을 사용하여 연결된 Form의 변수, 함수, 컴포넌트에 접근할 때도 form 속성을 사용하여야 합니다.

formscrollbarbarminsize

PopupDiv 의 내부 Form 에 표시되는 스크롤바의 트랙바(TrackBar) 최소크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbarbarminsize[= nSize]

문법 설정

this.PopupDiv00.formscrollbarbarminsize = 20;

참고

- formscrollbarbarminsize 속성값을 설정하지 않으면 undefined 가 설정되고 트랙바 크기에 맞는 적당한 값으로 동작합니다.

- formscrollbartrackbarsize 속성값이 설정되어 있으면 formscrollbarbarminsize 속성값은 무시됩니다.

- Form 의 크기 또는 내부 컨텐츠 변경에 의해 트랙바의 크기가 자동변경될 때 formscrollbarbarminsize 속성값 미만으로 작아지지 않습니다.

- 트랙바가 표시되는 영역보다 formscrollbarbarminsize 속성값을 크게 설정해도 트랙바는 표시영역까지만 표현됩니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollbarbarminsize 속성보다 formscrollbarbarminsize 속성이 우선 적용됩니다.

formscrollbarbaroutsize

PopupDiv 의 내부 Form 에 표시되는 스크롤바에서 트랙바(TrackBar)가 사라지는 기준 크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbarbaroutsize[= nSize]

문법 설정

this.PopupDiv00.formscrollbarbaroutsize = 50;

참고

- formscrollbarbaroutsize 속성값을 설정하지 않으면 undefined 가 설정되고 스크롤바 크기에 맞는 적당한 값으로 동작합니다.

- PopupDiv 의 크기가 변경되어 스크롤바가 줄어들 때 트랙바를 표시할 공간이 formscrollbarbaroutsize 속성값보다 작아지면 트랙바를 표시하지 않습니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollbarbaroutsize 속성보다 formscrollbarbaroutsize 속성이 우선 적용됩니다.

formscrollbardecbuttonsize

PopupDiv 에서 내부 Form 에 표시되는 스크롤바의 감소 버튼(DecButton) 크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbardecbuttonsize[= nSize]

문법 설정

this.PopupDiv00.formscrollbardecbuttonsize = 30;

참고

- formscrollbardecbuttonsize 속성값은 수직/수평 스크롤바에 동일하게 적용됩니다.

- 수직스크롤바의 감소 버튼(DecButton) 높이는 formscrollbardecbuttonsize 속성으로 설정하고 너비는 formscrollbarsize 속성으로 설정합니다.

- 수평스크롤바의 감소 버튼(DecButton) 너비는 formscrollbardecbuttonsize 속성으로 설정하고 높이는 formscrollbarsize 속성으로 설정합니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollbardecbuttonsize 속성보다 formscrollbardecbuttonsize 속성이 우선 적용됩니다.

formscrollbarincbuttonsize

PopupDiv 에서 내부 Form 에 표시되는 스크롤바의 증가 버튼(IncButton) 크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbarincbuttonsize[= nSize]

문법 설정

this.PopupDiv00.formscrollbarincbuttonsize = 30;

참고

- formscrollbarincbuttonsize 속성값은 수직/수평 스크롤바에 동일하게 적용됩니다.

- 수직스크롤바의 증가 버튼(IncButton) 높이는 formscrollbarincbuttonsize 속성으로 설정하고 너비는 formscrollbarsize 속성으로 설정합니다.

- 수평스크롤바의 증가 버튼(IncButton) 너비는 formscrollbarincbuttonsize 속성으로 설정하고 높이는 formscrollbarsize 속성으로 설정합니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollbarincbuttonsize 속성보다 formscrollbarincbuttonsize 속성이 우선 적용됩니다.

formscrollbarsize

PopupDiv 에서 내부 Form 에 표시되는 스크롤바의 크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbarsize[= nSize]

문법 설정

this.PopupDiv00.formscrollbarsize = 30;

참고

- formscrollbarsize 속성값은 수직스크롤바의 너비와 수평스크롤바의 높이에 동일하게 적용됩니다.

- formscrollbarsize 속성값을 변경하면 수평스크롤바 내부버튼의 높이와 수직스크롤바 내부버튼의 너비가 동일하게 변경됩니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollbarsize 속성보다 formscrollbarsize 속성이 우선 적용됩니다.

formscrollbartrackbarsize

PopupDiv 의 내부 Form 에 표시되는 스크롤바의 트랙바(TrackBar) 크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbartrackbarsize[= nSize]

문법 설정

this.PopupDiv00.formscrollbartrackbarsize = 20;

참고

- formscrollbartrackbarsize 속성값을 설정하지 않으면 undefined 가 설정되고 -1 로 동작합니다.

- formscrollbartrackbarsize 속성을 설정하면 내부 컨텐츠와 관계없이 트랙바 크기가 고정되어 표시됩니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollbartrackbarsize 속성보다 formscrollbartrackbarsize 속성이 우선 적용됩니다.

formscrollbartype

PopupDiv 에서 내부 Form 에 스크롤바가 표시되는 형식을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollbartype[= strBartype]

문법 설정

strBartype ::= <scrolltype> | <pairtype>

<scrolltype> ::= <desktype> | <mobiletype>
<pairtype> ::= <desktype> ' ' <desktype> | <mobiletype> ' ' <mobiletype>

<desktype> ::= 'default' | 'none' | 'fixed' | 'auto'
<mobiletype> ::= 'default' | 'none' | 'indicator' | 'autoindicator'

this.PopupDiv00.formscrollbartype = "none"; 
this.PopupDiv00.formscrollbartype = "default autoindicator"; 
this.PopupDiv00.formscrollbartype = "auto fixed"; 
this.PopupDiv00.formscrollbartype = "indicator none";

참고

- formscrollbartype 속성값을 설정하지 않으면 "default" 로 적용됩니다.

- 데스크탑에 적용되는 값과 모바일에 적용되는 값을 함께 설정할 수 있지만 권장하지 않습니다.
   ex) this.PopupDiv00.formscrollbartype = "fixed autoindicator";

- url 속성으로 기존에 작성된 Form 을 연결 시 연결된 Form 의 scrollbartype 속성보다 formscrollbartype 속성이 우선 적용됩니다.

formscrollindicatorsize

PopupDiv 에서 내부 Form 에 표시되는 스크롤 인디케이터바의 크기를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrollindicatorsize[= nSize]

문법 설정

this.PopupDiv00.formscrollindicatorsize = 30;

참고

- formscrollindicatorsize 속성값은 수직스크롤바의 너비와 수평스크롤바의 높이에 동일하게 적용됩니다.

- PopupDiv 에 스크롤 인디케이터바가 아닌 스크롤바가 표시될 경우 formscrollbarsize 속성으로 크기를 설정하여야 합니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrollindicatorsize 속성보다 formscrollindicatorsize 속성이 우선 적용됩니다.

formscrolltype

PopupDiv 의 내부 Form 에서 사용되는 스크롤의 종류를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.formscrolltype[= enumType]

문법 설정

enumType ::= 'none' | 'both' | 'vertical' | 'horizontal'

this.PopupDiv00.formscrolltype = "vertical";

참고

- formscrolltype 속성값을 설정하지 않으면 "both" 로 적용됩니다.

- PopupDiv 의 내부 Form 에서 사용되는 스크롤에 대한 자세한 설정은 formscrollbartype 속성을 사용하여야 합니다.

- url 속성으로 기존에 작성된 Form 과 연결 시 연결된 Form 의 scrolltype 속성보다 formscrolltype 속성이 우선 적용됩니다.

height

PopupDiv 을(를) 표시하기 위한 높이를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.height[= nHeight]

문법 설정

nHeight ::= [<strCompID> ':'] <nVal> ['px' | '%' | 'em' | 'rem']

this.PopupDiv00.height = 10; 
this.PopupDiv00.height = "10px"; 
this.PopupDiv00.height = 10%"; 
this.PopupDiv00.height = Button00:10%";

참고

- 높이값에 단위를 생략할 경우 pixel 값으로 적용됩니다.

- 높이값에 기준 컴포넌트 또는 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

◆ 기준 컴포넌트 설정 시 유의할 점

- 속성값을 기준 컴포넌트(<strCompID>)를 참조하도록 설정한 경우 다음 사항을 유의해주세요.

스크립트로 속성값에 설정한 기준 컴포넌트 값(<strCompID>)을 변경하는 경우 유효한 컴포넌트 값이 아니면(잘못된 컴포넌트 id, 부모 또는 stepindex가 다른 컴포넌트) 기준 컴포넌트 값은 무시하고 부모를 기준으로 좌표값(<nVal>)을 적용합니다.
스크립트로 기준 컴포넌트의 크기나 위치 속성값을 변경되는 경우(속성값에 영향을 주는 메소드 실행으로 인한 변경 포함) 변경된 속성값이 기준 컴포넌트를 참조하는 컴포넌트에 바로 반영되지 않습니다.
예를 들어 Button01 컴포넌트의 left 속성값이 "Button00:10px"인 경우 스크립트로 Button00 컴포넌트의 right 속성값이 변경하더라도 Button01 컴포넌트의 위치는 변경되지 않습니다.
기준 컴포넌트의 크기나 위치 속성값이 변경된 것을 기준 컴포넌트를 참조하는 컴포넌트에 반영하려면 스크립트에서 기준 컴포넌트의 크기나 위치 속성값 변경 후 Form 오브젝트의 resetScroll 메소드를 실행해주어야 합니다.

hotkey

PopupDiv 의 기본 액션을 수행하기 위한 단축키를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.hotkey[= strHotkey]

문법 설정

this.PopupDiv00.hotkey = "G"; 
this.PopupDiv00.hotkey = "CTRL+A"; 
this.PopupDiv00.hotkey = "CTRL+ALT+X";

참고

(1) 컴포넌트 기본 액션

hotkey 속성값 설정 시 컴포넌트의 기본 액션이 수행됩니다. 컴포넌트 기본 액션은 다음과 같습니다.
- onclick : Button, CheckBox
- 포커스 이동 (접근성 설정 시) : GroupBox, Static
- onsetfocus : 나머지 Frame 오브젝트 및 컴포넌트
* GroupBox, Static 컴포넌트는 접근성 설정 환경이 아닌 경우 hotkey 속성은 처리되지 않습니다.

(2) 예외 조건

(2-1) 같은 hotkey 속성값을 가진 컴포넌트가 있을 때
Form 내에 같은 hotkey 속성값을 가진 컴포넌트가 2개 이상 있는 경우 components 속성 인덱스 순서에 따라 먼저 생성된 컴포넌트의 hotkey 속성만 처리됩니다.

(2-2) 단축키가 설정된 입력장치를 사용할 때
단축키 설정 기능이 있는 입력장치를 사용하는 경우 입력장치에서 설정된 단축키와 같은 값을 hotkey 속성값으로 설정하면 hotkey 속성은 처리되지 않습니다.
예를 들어 "CTRL+M" 키 입력을 ENTER 키 입력으로 변환해 처리하는 키보드를 사용한다면 hotkey 속성값을 "CTRL+M"으로 설정하고 해당 키를 입력해도 기본 액션이 수행되지 않습니다.

(2-3) 상위 프레임 또는 Form이 활성화되지 않았을 때
hotkey 속성은 상위 프레임 또는 Form이 활성화된 경우에만 동작합니다. 

(2-4) enable 속성값이 false 일 때
컴포넌트의 enable 속성값이 false이면 hotkey 속성은 처리되지 않습니다.

(2-5) hotkeycolumn 속성값을 설정했을 때
Menu 컴포넌트의 hotkey 속성값과 hotkeycolumn 속성값을 같은 속성값으로 설정하면 hotkeycolumn 속성은 처리되지 않습니다.

활용 예제

• 특정 키 입력 시 onclick 이벤트 처리하기

id

PopupDiv의 고유 식별자를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.id

문법 설정

참고

-  addChild나 insertChild 메소드를 사용하여 컴포넌트를 등록할때 parent 가 자식컴포넌트를 구별하기 위한 고유한 key값입니다.

- 속성명이나 메소드명과 같은 예약어를 id 속성값으로 설정할 경우 오류가 발생할 수 있습니다.

- 컴포넌트의 속성은 아니지만 편의를 위하여 넥사크로 스튜디오에서 설정할 수 있는 기능이 제공됩니다.

- name 속성은 사용자가 지정한 컴포넌트의 이름으로 논리적으로 중복이 가능합니다.

- 넥사크로 스튜디오에서 컴포넌트를 생성하거나 id 값을 설정하면 name 속성에 동일한 값이 설정됩니다.

initvalueid

PopupDiv 에 적용될 InitValue 의 ID 를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.initvalueid[= strValueID]

문법 설정

참고

- PopupDiv 가 화면에 표시된 후에는 속성값을 설정하거나 변경 할 수 없습니다.
   PopupDiv 를 동적으로 생성 시 show() 메소드 실행 전에 속성값을 설정하여야 합니다.

- Screen 별로 Environment 의 initvaluefileid 속성을 각각 설정하면 Screen 에 따라 다른 초기값을 설정할 수 있습니다.

- InitValueDefinition 영역에 한 개 이상의 InitValue 파일을 정의할 수 있고,
   InitValue 파일에는 컴포넌트별로 여러개의 초기값 정의를 할 수 있습니다.

left

PopupDiv 을(를) 표시하기 위한 좌측 좌표값을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.left[= nLeft]

문법 설정

nLeft ::= [<strCompID> ':'] <nVal> ['px' | '%' | 'em' | 'rem']

this.PopupDiv00.left = 10; 
this.PopupDiv00.left = "10px"; 
this.PopupDiv00.left = "10%"; 
this.PopupDiv00.left = "Button00:10px"; 
this.PopupDiv00.left = "Button00:10%";

참고

- 좌표값에 단위를 생략할 경우 pixel 값으로 적용됩니다.

- 좌표값에 기준 컴포넌트 또는 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

◆ 기준 컴포넌트 설정 시 유의할 점

- 속성값을 기준 컴포넌트(<strCompID>)를 참조하도록 설정한 경우 다음 사항을 유의해주세요.

스크립트로 속성값에 설정한 기준 컴포넌트 값(<strCompID>)을 변경하는 경우 유효한 컴포넌트 값이 아니면(잘못된 컴포넌트 id, 부모 또는 stepindex가 다른 컴포넌트) 기준 컴포넌트 값은 무시하고 부모를 기준으로 좌표값(<nVal>)을 적용합니다.
스크립트로 기준 컴포넌트의 크기나 위치 속성값을 변경되는 경우(속성값에 영향을 주는 메소드 실행으로 인한 변경 포함) 변경된 속성값이 기준 컴포넌트를 참조하는 컴포넌트에 바로 반영되지 않습니다.
예를 들어 Button01 컴포넌트의 left 속성값이 "Button00:10px"인 경우 스크립트로 Button00 컴포넌트의 right 속성값이 변경하더라도 Button01 컴포넌트의 위치는 변경되지 않습니다.
기준 컴포넌트의 크기나 위치 속성값이 변경된 것을 기준 컴포넌트를 참조하는 컴포넌트에 반영하려면 스크립트에서 기준 컴포넌트의 크기나 위치 속성값 변경 후 Form 오브젝트의 resetScroll 메소드를 실행해주어야 합니다.

letter-spacing

PopupDiv 에 표시되는 문자의 간격(자간)을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.letterSpacing[= strspace]

문법 설정

strspace ::= 'normal' | <nVal> ['px']

* XCSS
letter-spacing : 2px ;

* Script ( normal property )
this.PopupDiv00.letterSpacing = "2px";

참고

- letter-spacing 속성값을 설정하지 않으면 undefined 가 설정되고, "normal" 로 동작합니다.

- 스크립트로 접근 시 속성명은 "letterSpacing"을 사용해야 합니다.

maxheight

PopupDiv 이(가) 화면에 표시되는 최대 높이를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.maxheight[= nMaxHeight]

문법 설정

nMaxHeight ::= <nVal> ['px']

this.PopupDiv00.maxheight = 20; 
this.PopupDiv00.maxheight = "20px";

참고

- height 속성값이 maxheight 보다 크면 화면에 표시되는 PopupDiv 의 높이는 maxheight 속성값으로 적용됩니다.
  표시되는 높이만 적용되고 height 속성값은 변경되지 않습니다.

- maxheight 속성값에 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

- maxheight 속성값을 minheight 속성값보다 작게 설정하면 minheight 속성값이 maxheight 속성값으로 설정됩니다.

- Position 관련 속성(left, top 등)에 기준컴포넌트를 설정하여 PopupDiv 의 높이가 상대적으로 설정될 경우에도 적용되는 속성입니다.
   maxheight > height > top(상대값) > bottom(상대값) > top(절대값) > bottom(절대값) 순서로 설정값이 적용됩니다.
   이 때, height, top, bottom 값 중 먼저 2개가 설정되면 나머지는 무시됩니다.

- fittocontents 속성이 있는 컴포넌트는 속성값에 의해 높이가 자동 설정될 때도 적용되는 속성입니다.

maxwidth

PopupDiv 이(가) 화면에 표시되는 최대 너비를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.maxwidth[= nMaxWidth]

문법 설정

nMaxWidth ::= <nVal> ['px']

this.PopupDiv00.maxwidth = 20; 
this.PopupDiv00.maxwidth = "20px";

참고

- width 속성값이 maxwidth 보다 크면 화면에 표시되는 PopupDiv 의 너비는 maxwidth 속성값으로 적용됩니다.
  표시되는 너비만 적용되고 width 속성값은 변경되지 않습니다.

- maxwidth 속성값에 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

- maxwidth 속성값을 minwidth 속성값보다 작게 설정하면 minwidth 속성값이 maxwidth 속성값으로 설정됩니다.

- Position 관련 속성(left, top 등)에 기준컴포넌트를 설정하여 PopupDiv 의 너비가 상대적으로 설정될 경우에도 적용되는 속성입니다.
   maxwidth > width > left(상대값) > right(상대값) > left(절대값) > right(절대값) 순서로 설정값이 적용됩니다.
   이 때, width, left, right 값 중 먼저 2개가 설정되면 나머지는 무시됩니다.

- fittocontents 속성이 있는 컴포넌트는 속성값에 의해 너비가 자동 설정될 때도 적용되는 속성입니다.

minheight

PopupDiv 이(가) 화면에 표시되는 최소 높이를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.minheight[= nMinHeight]

문법 설정

nMinHeight ::= <nVal> ['px']

this.PopupDiv00.minheight = 20; 
this.PopupDiv00.minheight = "20px";

참고

- height 속성값이 minheight 보다 작다면 화면에 표시되는 PopupDiv 의 높이는 minheight 속성값으로 적용됩니다.
  표시되는 높이만 적용되고 height 속성값은 변경되지 않습니다.

- minheight 속성값에 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

- minheight 속성값을 maxheight 속성값보다 크게 설정하면 maxheight 속성값이 minheight 속성값으로 설정됩니다.

- Position 관련 속성(left, top 등)에 기준컴포넌트를 설정하여 PopupDiv 의 높이가 상대적으로 설정될 경우에도 적용되는 속성입니다.
   minheight > height > top(상대값) > bottom(상대값) > top(절대값) > bottom(절대값) 순서로 설정값이 적용됩니다.
   이 때, height, top, bottom 값 중 먼저 2개가 설정되면 나머지는 무시됩니다.

- fittocontents 속성이 있는 컴포넌트는 속성값에 의해 높이가 자동 설정될 때도 적용되는 속성입니다.

minwidth

PopupDiv 이(가) 화면에 표시되는 최소 너비를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.minwidth[= nMinWidth]

문법 설정

nMinWidth ::= <nVal> ['px']

this.PopupDiv00.minwidth = 20; 
this.PopupDiv00.minwidth = "20px";

참고

- width 속성값이 minwidth 보다 작으면 화면에 표시되는 PopupDiv 의 너비는 minwidth 속성값으로 적용됩니다.
  표시되는 너비만 적용되고 width 속성값은 변경되지 않습니다.

- minwidth 속성값에 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

- minwidth 속성값을 maxwidth 속성값보다 크게 설정하면 maxwidth 속성값이 minwidth 속성값으로 설정됩니다.

- Position 관련 속성(left, top 등)에 기준컴포넌트를 설정하여 PopupDiv 의 너비가 상대적으로 설정될 경우에도 적용되는 속성입니다.
   minwidth > width > left(상대값) > right(상대값) > left(절대값) > right(절대값) 순서로 설정값이 적용됩니다.
   이 때, width, left, right 값 중 먼저 2개가 설정되면 나머지는 무시됩니다.

- fittocontents 속성이 있는 컴포넌트는 속성값에 의해 너비가 자동 설정될 때도 적용되는 속성입니다.

name

PopupDiv 의 이름을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.name[= strName]

문법 설정

참고

- name 속성은 사용자가 지정한 컴포넌트의 이름으로 논리적으로 중복이 가능합니다.

- 넥사크로 스튜디오에서 컴포넌트를 생성하거나 id 값을 설정하면 name 속성에 동일한 값이 설정됩니다.

-nexa-border

PopupDiv 의 테두리를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.border[= strborder]

문법 설정

strborder ::= <line-width> <line-style> <color> [,<line-width> <line-style> <color>]{3}

<line-width> ::= 'thin' | 'medium' | 'thick' | <nWidth> 'px'
<line-style> ::= 'none' | 'hidden' | 'dotted' | 'dashed' | 'solid' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'
<color> ::= <NamedColor> | <NumericColor>

1회 입력 : top/right/bottom/left 에 모두 적용됩니다.
2회 입력 : top/bottom, right/left 에 첫번째 값부터 각각 적용됩니다.
3회 입력 : top, right/left, bottom 에 첫번째 값부터 각각 적용됩니다.
4회 입력 : top, right, bottom, left 에 첫번째 값부터 각각 적용됩니다.

* 2회~4회 입력은 border-radius 속성값이 설정되지 않은 경우만 적용됩니다.

* XCSS
-nexa-border : 1px solid #999999;
-nexa-border : 1px solid #999999, 1px solid #999999, 1px solid #999999, 1px solid #999999;

* Script ( normal property )
this.PopupDiv00.border = "1px solid #999999";
this.PopupDiv00.border = "1px solid #999999, 1px solid #999999, 1px solid #999999, 1px solid #999999";

참고

- -nexa-border 속성값을 설정하지 않으면 undefined 가 설정되고, "medium none #999999" 로 동작합니다.

- <line-style> 이 "double" 일 때 두 줄을 다른 색으로 설정할 수 없습니다.
   <color> 에 설정된 색이 두 줄에 모두 적용됩니다.

- 스크립트로 접근 시 속성명은 "border"를 사용해야 합니다.


◆ Nexacro Runtime Environment 제약

- 각 테두리의 색상이나 두께를 다르게 설정했을 경우 top > right > bottom > left 순으로 겹쳐서 표시됩니다.

- <line-style> 에 "double","groove","ridge","inset","outset" 값을 설정해도 적용되지 않습니다.

- <line-width> 에 "thin","medium","thick" 값을 설정해도 적용되지 않습니다.


◆ Web Runtime Environment 제약

- 각 테두리의 색상이나 두께를 다르게 설정했을 경우 웹브라우저에 따라 테두리가 겹쳐지는 순서가 다르게 처리될 수 있습니다.

- 각 테두리의 색상이나 두께를 다르게 설정했을 경우 border-radius 속성값이 설정되어 있으면 
   두께는 각 테두리 별로 따로 적용되고, 색상은 top 에 설정된 색이 적용됩니다.

- 각 테두리의 색상이나 두께를 다르게 설정했을 경우 border-radius 속성값이 설정되어 있어도
   일부 브라우저는 각 테두리의 색상이나 두께가 각각 적용됩니다.

- XCSS 를 사용하지 않고 rgba(), hsl(), hsla() 메소드를 속성에 직접 설정할 경우 브라우저 버전에 따라 적용되지 않을 수 있습니다.

-nexa-edge

PopupDiv 의 테두리(Border) 안쪽에 표시될 Edge 이미지를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.edge[= stredge]

문법 설정

stredge ::= 'none' | <image> [<fixedwidth>'px' <fixedheight>'px']

<image> ::= 'URL("' <Theme-Image> | <Web-Image> '")'

* XCSS
-nexa-edge : "URL('./images/border.png')" 5px 5px;

* Script ( normal property )
this.PopupDiv00.edge = "URL('./images/border.png')" 5px 5px;

참고

- -nexa-edge 속성값을 설정하지 않으면 undefined 가 설정되고, "none" 으로 동작합니다.

- 스크립트로 접근 시 속성명은 "edge" 를 사용해야 합니다.

- PopupDiv 내부에 테두리 형태로 이미지를 표시하고자 할 때 사용하는 속성입니다.

- -nexa-edge 속성값을 설정하면 이미지의 상/하/좌/우 일정 영역(<fixedwidth>,<fixedheight> 값)을 고정하고 안쪽 사각형 영역을 Stretch 하여 처리합니다.

- background 속성에 의해 배경색 또는 이미지가 설정되어 있어도 -nexa-edge 속성에 설정된 이미지가 제일 위에 표시됩니다.

- TypeDefinition 영역의 Services 에 정의된 사용자 Prefix 는 테마 또는 XCSS 에서 이미지경로로 사용할 수 없습니다.
   사용자 Prefix 는 스크립트 또는 넥사크로 스튜디오에서 속성값으로 설정 시 사용할 수 있습니다.


◆ WRE 제약

- <fixedwidth>,<fixedheight> 값이 이미지 사이즈의 1/2 을 초과할 경우 브라우저별로 보이는 형태가 다를 수 있습니다.

- CSS3 스펙을 지원하지 않는 브라우저 버전에서는 정상적으로 표시되지 않을 수 있습니다.

-nexa-rtl-background-image

PopupDiv 의 rtl 속성이 true 로 적용될 때 배경에 표시될 이미지를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.-nexa-rtl-background-image

문법 설정

strRtlBgImage ::= "URL(' " <Theme-Image> | <Web-Image> " ')"

* XCSS
-nexa-rtl-background-image : URL("http://localhost/Test.jpg");
-nexa-rtl-background-image : URL("theme://images/Test.jpg");

참고

- rtl 속성에 의해 표시기준이 변경되면 반전된 이미지를 적용하려 할 때 사용하는 속성입니다.

- XCSS 에서만 설정할 수 있는 속성으로 스크립트로 값을 변경할 수 없습니다.
   XCSS 에 -nexa-rtl-background-image 속성값을 설정하지 않으면 background 속성에 설정된 이미지가 적용됩니다.

- TypeDefinition 영역의 Services 에 정의된 사용자 Prefix 는 테마 또는 XCSS 에서 이미지경로로 사용할 수 없습니다.

- 배경이미지가 적용되는 영역은 컴포넌트의 클라이언트 영역입니다.

- background 속성에 배경색이 설정되어 있을 경우 배경색 위에 이미지가 표시됩니다.

- 그라데이션과 배경이미지를 동시에 설정할 수 없습니다.
   background 속성에 그라데이션이 설정되어 있을 경우 오동작이 발생할 수 있습니다.

-nexa-rtl-edge-image

PopupDiv 의 rtl 속성이 true 로 적용될 때 테두리(Border) 안쪽에 표시될 Edge 이미지를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.-nexa-rtl-edge-image

문법 설정

strRtlEgImage ::= "URL(' " <Theme-Image> | <Web-Image> " ')"

* XCSS
-nexa-rtl-edge-image : URL("http://localhost/Test.jpg");
-nexa-rtl-edge-image : URL("theme://images/Test.jpg")

참고

- rtl 속성에 의해 표시기준이 변경되면 반전된 이미지를 적용하려 할 때 사용하는 속성입니다.

- XCSS 에서만 설정할 수 있는 속성으로 스크립트로 값을 변경할 수 없습니다.
   XCSS 에 -nexa-rtl-edge-image 속성값을 설정하지 않으면 -nexa-edge 속성에 설정된 이미지가 적용됩니다.

- TypeDefinition 영역의 Services 에 정의된 사용자 Prefix 는 테마 또는 XCSS 에서 이미지경로로 사용할 수 없습니다.

- 배경이미지가 적용되는 영역은 컴포넌트의 클라이언트 영역입니다.

- background 또는 -nexa-rtl-background-image 속성에 의해 배경색 또는 이미지가 설정되어 있어도 -nexa-rtl-edge-image 속성에 설정된 이미지가 제일 위에 표시됩니다.


◆ web runtime environment 제약

- CSS3 스펙을 지원하지 않는 브라우저 버전에서는 정상적으로 표시되지 않을 수 있습니다.

opacity

PopupDiv 영역의 투명도를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.opacity[= stropacity]

문법 설정

* XCSS
opacity : 0.8;
opacity : 80%;

* Script ( normal property )
this.PopupDiv00.opacity = "0.8";
this.PopupDiv00.opacity = 0.8;
this.PopupDiv00.opacity = "80%";

참고

- opacity 속성값을 설정하지 않으면 undefined 가 설정되고, 1 로 동작합니다.

- Div 와 같이 자식 컴포넌트를 가질 수 있는 컴포넌트에 opacity 속성을 적용하면 자식 컴포넌트도 함께 적용됩니다.

- 부모와 자식 컴포넌트에 각각 opacity 속성이 설정되어 있으면 자식 컴포넌트의 투명도는 부모의 투명도에 추가적으로 적용됩니다.
   예를 들어 부모의 opacity가 0.5 이고 자식의 opacity가 0.4 이면 결과적으로 자식 컴포넌트는 0.2 의 투명도가 적용됩니다.

parent

PopupDiv 의 부모 오브젝트를 갖는 읽기전용 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.parent

문법 설정

var objParent = this.PopupDiv00.parent;

참고

- parent 속성은 일반적으로 컴포넌트가 속한 Form을 갖습니다.

- PopupDiv 이(가) Div 와 같은 컨테이너 컴포넌트에 자식으로 존재한다면 parent 속성은 해당 컨테이너 컴포넌트를 갖습니다.

- Calendar 와 같이 서브컨트롤이 존재하는 컴포넌트에서 서브컨트롤의 parent 속성은 해당 컴포넌트를 갖습니다.

returnvalue

PopupDiv 의 closePopup() 메소드 실행 시 인수로 전달된 값을 갖는 읽기전용 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.returnvalue

문법 설정

this.PopupDiv00.closePopup( "return value" );
var strRtn = this.PopupDiv00.returnvalue;

참고

- closePopup() 메소드를 사용하여 PopupDiv 를 닫지 않았다면 returnvalue 속성값은 빈값으로 설정됩니다.

- PopupDiv 가 화면에 표시될 때 returnvalue 속성값이 초기화 됩니다.

- trackPopup() 또는 trackPopupByComponent() 메소드 실행 시 콜백함수를 설정했다면  PopupDiv 가 닫힐 때 콜백함수에 returnvalue 값을 전달합니다.

right

PopupDiv 를 표시하기 위한 우측 좌표값을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.right[= nRight]

문법 설정

nRight ::= [<strCompID> ':'] <nVal> ['px' | '%' | 'em' | 'rem']

this.PopupDiv00.right = 10; 
this.PopupDiv00.right = "10px"; 
this.PopupDiv00.right = "10%"; 
this.PopupDiv00.right = "Button00:10px"; 
this.PopupDiv00.right = "Button00:10%";

참고

- 좌표값에 단위를 생략할 경우 pixel 값으로 적용됩니다.

- 좌표값에 기준 컴포넌트 또는 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

◆ 기준 컴포넌트 설정 시 유의할 점

- 속성값을 기준 컴포넌트(<strCompID>)를 참조하도록 설정한 경우 다음 사항을 유의해주세요.

스크립트로 속성값에 설정한 기준 컴포넌트 값(<strCompID>)을 변경하는 경우 유효한 컴포넌트 값이 아니면(잘못된 컴포넌트 id, 부모 또는 stepindex가 다른 컴포넌트) 기준 컴포넌트 값은 무시하고 부모를 기준으로 좌표값(<nVal>)을 적용합니다.
스크립트로 기준 컴포넌트의 크기나 위치 속성값을 변경되는 경우(속성값에 영향을 주는 메소드 실행으로 인한 변경 포함) 변경된 속성값이 기준 컴포넌트를 참조하는 컴포넌트에 바로 반영되지 않습니다.
예를 들어 Button01 컴포넌트의 left 속성값이 "Button00:10px"인 경우 스크립트로 Button00 컴포넌트의 right 속성값이 변경하더라도 Button01 컴포넌트의 위치는 변경되지 않습니다.
기준 컴포넌트의 크기나 위치 속성값이 변경된 것을 기준 컴포넌트를 참조하는 컴포넌트에 반영하려면 스크립트에서 기준 컴포넌트의 크기나 위치 속성값 변경 후 Form 오브젝트의 resetScroll 메소드를 실행해주어야 합니다.

rtl

PopupDiv 에서 내부 컨텐츠 또는 컴포넌트의 표시 기준을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.rtl

문법 설정

bRtl ::= undefined | 'true' | 'false'

var vRtl = this.PopupDiv00.rtl;

참고

- 넥사크로 스튜디오에서만 값을 설정할 수 있고, 실행중에는 수정할 수 없는 속성입니다.

- 아랍권 같이 화면의 표시기준이 오른쪽인 환경에서 컨텐츠의 표시 기준을 변경하기 위해 설정하는 속성입니다.

- PopupDiv 부터 Environment 까지 상위의 모든 rtl 속성값이 undefined 이면
   Environment 의 locale 속성에 설정된 국가 및 언어 설정값을 기준으로 rtl 속성이 적용됩니다.
   Environment 의 locale 속성값을 설정하지 않았을 경우 시스템의 국가 및 언어 설정값이 적용됩니다.

text

PopupDiv 에 내부 컴포넌트가 없을 때 화면에 표시될 텍스트를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.text[= strText]

문법 설정

this.PopupDiv00.text = "Empty Form";

tooltiptext

PopupDiv 에 마우스 포인터를 올려 놓았을 때 표시되는 풍선도움말을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.tooltiptext[= strToolTipText]

문법 설정

this.PopupDiv00.tooltiptext = "This is ToolTip Text"; this.PopupDiv00.tooltiptext = "";          // 풍선 도움말이 표시되지 않습니다. 

this.PopupDiv00.tooltiptext = null;        // 상위 컴포넌트의 풍선 도움말이 표시됩니다.

참고

- tooltiptext 속성값을 설정하지 않으면 undefined 로 적용됩니다.

- 마우스 포인터가 PopupDiv 영역 위에서 일정시간 움직이지 않으면 풍선도움말이 표시됩니다.

- 풍선도움말이 표시된 상태에서 tooltiptext 속성값을 변경하면 풍선도움말이 사라집니다.


◆ Desktop WRE 제약

- 풍선도움말은 브라우저의 기능을 활용하므로 브라우저 사양에 따라 스타일에 차이가 있을 수 있습니다.
   NRE는 Chrome 의 스타일과 동일하게 적용됩니다.

tooltiptype

PopupDiv 에서 풍선도움말이 표시될 위치와 방식을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.tooltiptype[= enumTooltipType]

문법 설정

enumTooltipType ::= 'default' | 'hover' | 'inplace' | 'default,mouseleave' | 'hover,mouseleave' | 'inplace,mouseleave'

this.PopupDiv00.tooltiptype = "hover";

참고

- tooltiptype 속성값을 설정하지 않으면 "default" 로 적용됩니다.

- 마우스 포인터가 PopupDiv 영역 위에서 일정시간 움직이지 않으면 풍선도움말이 표시됩니다.

- 풍선도움말이 표시된 상태에서 tooltiptext 속성값을 변경하면 tooltiptype 속성값에 관계없이 풍선도움말이 사라집니다.

- 표시되었다가 사라진 풍선도움말은 마우스 포인터가 PopupDiv 영역을 나갔다가 들어오면 다시 표시됩니다.

- 마우스 포인터가 PopupDiv 영역에서 벗어나면 풍선도움말이 사라집니다.

- 풍선도움말의 크기는 풍선도움말에 표시되는 텍스트의 길이와 크기에 맞춰 자동으로 조정됩니다.

- 풍선도움말에 표시되는 텍스트의 글꼴과 크기는 변경하실 수 없습니다.

top

PopupDiv 을(를) 표시하기 위한 상단 좌표값을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.top[= nTop]

문법 설정

nTop ::= [<strCompID> ':'] <nVal> ['px' | '%' | 'em' | 'rem']

this.PopupDiv00.top = 10; 
this.PopupDiv00.top = "10px"; 
this.PopupDiv00.top = "10%"; 
this.PopupDiv00.top = "Button00:10px"; 
this.PopupDiv00.top = "Button00:10%";

참고

- 좌표값에 단위를 생략할 경우 pixel 값으로 적용됩니다.

- 좌표값에 기준 컴포넌트 또는 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

◆ 기준 컴포넌트 설정 시 유의할 점

- 속성값을 기준 컴포넌트(<strCompID>)를 참조하도록 설정한 경우 다음 사항을 유의해주세요.

스크립트로 속성값에 설정한 기준 컴포넌트 값(<strCompID>)을 변경하는 경우 유효한 컴포넌트 값이 아니면(잘못된 컴포넌트 id, 부모 또는 stepindex가 다른 컴포넌트) 기준 컴포넌트 값은 무시하고 부모를 기준으로 좌표값(<nVal>)을 적용합니다.
스크립트로 기준 컴포넌트의 크기나 위치 속성값을 변경되는 경우(속성값에 영향을 주는 메소드 실행으로 인한 변경 포함) 변경된 속성값이 기준 컴포넌트를 참조하는 컴포넌트에 바로 반영되지 않습니다.
예를 들어 Button01 컴포넌트의 left 속성값이 "Button00:10px"인 경우 스크립트로 Button00 컴포넌트의 right 속성값이 변경하더라도 Button01 컴포넌트의 위치는 변경되지 않습니다.
기준 컴포넌트의 크기나 위치 속성값이 변경된 것을 기준 컴포넌트를 참조하는 컴포넌트에 반영하려면 스크립트에서 기준 컴포넌트의 크기나 위치 속성값 변경 후 Form 오브젝트의 resetScroll 메소드를 실행해주어야 합니다.

url

PopupDiv 에 Form 을 연결하여 표시할 때 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.url[= strUrl]

문법 설정

strUrl ::= <absolute-url> | <relative-url>

this.PopupDiv00.url = "http://localhost:8080/Prj/Base/temp00.xfdl.js";     // 절대경로

this.PopupDiv00.url = "../Base/temp00.xfdl";                                        // 상대경로
this.PopupDiv00.url = "Base::temp00.xfdl";                                           // TypeDefinition의 Services 경로

참고

- 기존에 작성된 Form 을 PopupDiv 에 연결할 때 사용하는 속성입니다.

- PopupDiv 의 위치와 크기는 연결된 Form 의 크기와 관계없이 유지됩니다.

- PopupDiv 에 연결된 Form 내부에서 PopupDiv 의 url 속성을 변경 시 async 속성값이 false 일 경우 오동작 할 수 있습니다.
   async 속성값이 false 이면 PopupDiv 의 url 속성을 변경하는 즉시 새로운 Form 이 로드되고,
   기존 Form 이 제거되므로 스크립트가 끝나기 전에 해당 오브젝트가 제거되서 발생하는 문제입니다.
 
- PopupDiv 에 연결된 Form 내부에서 PopupDiv 의 url 속성을 변경하면 변경 시점 이후의 스크립트는 수행되지 않습니다.

- PopupDiv 가 속한 Form 과 상위 Form 들은 url 속성에 설정하여 연결 할 수 없습니다.

visible

PopupDiv 의 화면 표시여부에 따라 자동으로 설정되는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.visible[= bVisible]

문법 설정

bVisible ::= 'true' | 'false'

참고

- PopupDiv 의 화면 표시 여부는 isPopup() 메소드로 확인하는 것을 권장합니다.

- trackPopup() 또는 trackPopupByComponent() 메소드를 실행하여 PopupDiv가 화면에 표시되면 visible 속성값은 "true"로 설정됩니다.

- closePopup() 메소드를 실행하여 PopupDiv 가 화면에서 닫히면 visible 속성값은 "false"로 설정됩니다.

- visible 속성값이 "false"이면 컴포넌트가 화면에 표시되지 않고, 포커스를 받을 수 없으므로 입력이나 사용이 불가능합니다.

- visible 속성값이 "false"이면 내부 컴포넌트도 함께 화면에 표시되지 않습니다.

- visible 속성값이 "false"이어도 컴포넌트는 존재하기 때문에 스크립트로 제어가 가능합니다.

- 넥사크로 스튜디오에서는 visible 속성값을 'false'로 설정해도 디자인화면에서 사라지지 않습니다.

width

PopupDiv 을(를) 표시하기 위한 너비를 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.width[= nWidth]

문법 설정

nWidth ::= [<strCompID> ':'] <nVal> ['px' | '%' | 'em' | 'rem']

this.PopupDiv00.width = 10; this.PopupDiv00.width = "10px"; 
this.PopupDiv00.width = "10%"; 
this.PopupDiv00.width = "Button00:10%";

참고

- 너비값에 단위를 생략할 경우 pixel 값으로 적용됩니다.

- 너비값에 기준 컴포넌트 또는 단위문자를 포함할 경우 문자열 형태로 설정하여야 합니다.

◆ 기준 컴포넌트 설정 시 유의할 점

- 속성값을 기준 컴포넌트(<strCompID>)를 참조하도록 설정한 경우 다음 사항을 유의해주세요.

스크립트로 속성값에 설정한 기준 컴포넌트 값(<strCompID>)을 변경하는 경우 유효한 컴포넌트 값이 아니면(잘못된 컴포넌트 id, 부모 또는 stepindex가 다른 컴포넌트) 기준 컴포넌트 값은 무시하고 부모를 기준으로 좌표값(<nVal>)을 적용합니다.
스크립트로 기준 컴포넌트의 크기나 위치 속성값을 변경되는 경우(속성값에 영향을 주는 메소드 실행으로 인한 변경 포함) 변경된 속성값이 기준 컴포넌트를 참조하는 컴포넌트에 바로 반영되지 않습니다.
예를 들어 Button01 컴포넌트의 left 속성값이 "Button00:10px"인 경우 스크립트로 Button00 컴포넌트의 right 속성값이 변경하더라도 Button01 컴포넌트의 위치는 변경되지 않습니다.
기준 컴포넌트의 크기나 위치 속성값이 변경된 것을 기준 컴포넌트를 참조하는 컴포넌트에 반영하려면 스크립트에서 기준 컴포넌트의 크기나 위치 속성값 변경 후 Form 오브젝트의 resetScroll 메소드를 실행해주어야 합니다.

word-spacing

PopupDiv 에 표시되는 텍스트의 단어 사이 간격을 설정하는 속성입니다.

지원 환경

속성 타입

문법

PopupDiv.wordSpacing[= strwordspacing]

문법 설정

strWordSpacing ::= 'normal' | <nVal>'px'

* XCSS
word-spacing : 30px;

* Script ( normal property )
this.PopupDiv00.wordSpacing = "30px";

참고

- word-spacing 속성값을 설정하지 않으면 undefined 가 설정되고, "normal" 로 동작합니다.

- 스크립트로 접근 시 속성명은 "wordSpacing"을 사용해야 합니다.

메서드

addChild

스크립트에서 동적으로 생성한 컴포넌트를 PopupDiv 의 자식 컴포넌트로 추가하는 메소드입니다.

지원 환경

문법

PopupDiv.addChild( strChildID, objComp )

파라미터

var nIndex = this.PopupDiv00.addChild( "Button00", Button00 );

반환

참고

- addChild() 메소드는 Frame 과 컨테이너 컴포넌트에서만 제공합니다.

- 스크립트에서 동적으로 생성한 컴포넌트만 추가할 수 있습니다.
  동적으로 생성한 컴포넌트가 아닌 경우 오동작이 발생할 수 있습니다.

- 자식 컴포넌트의 세부 속성은 addChild() 메소드로 자식 컴포넌트를 추가 후 설정해야 합니다.

- 자식 컴포넌트로 추가된 컴포넌트를 화면에 표시하기 위해서는 show() 메소드를 사용해야 합니다.

- 추가된 컴포넌트에 의해 부모 컴포넌트의 스크롤바가 갱신되야 할 때는 resetScroll() 메소드를 사용해야 합니다.
  추가된 컴포넌트에 의해 스크롤바가 자동으로 갱신되지 않습니다.

- 동적으로 추가된 컴포넌트를 제거하기 위해서는 removeChild() 메소드를 사용해야 합니다.

- removeChild() 메소드로 제거된 컴포넌트를 완전히 삭제하기 위해서는 destroy() 메소드를 사용해야 합니다.

- Div, PopupDiv, Tabpagecontrol 에서 제공하는  addChild() 메소드는 form 컨트롤에 자식 컴포넌트를 추가합니다.
   this.Div00.addChild("mysubbutton", Button00);
  수행 시  this.Div00.form.Button00  로  접근 가능합니다.

addEvent

PopupDiv 에 특정 이벤트를 선언하여 추가하는 메소드입니다.

지원 환경

문법

PopupDiv.addEvent( strEventID )

파라미터

var bResult = this.PopupDiv00.addEvent( "onmove" );

반환

참고

- Composite Component 와 같은 사용자 컴포넌트에 특정 이벤트를 추가할 때 사용하는 메소드입니다.

- PopupDiv 에서 특정 이벤트를 제거하려면 removeEvent() 메소드를 사용하여야 합니다.

addEventHandler

PopupDiv 의 특정 이벤트에 핸들러 함수를 추가하는 메소드입니다.

지원 환경

문법

PopupDiv.addEventHandler( strEventID, objFunc, objTarget )

파라미터

this.PopupDiv00_onmove = function( obj:nexacro.PopupDiv,  e:nexacro.MoveEventInfo) { // 수행할 스크립트 };
var nIndex = this.PopupDiv00.addEventHandler( "onmove", this.PopupDiv00_onmove, this);

반환

addEventHandlerLookup

함수를 검색하여 PopupDiv 의 특정 이벤트에 핸들러 함수로 추가하는 메소드입니다.

지원 환경

문법

PopupDiv.addEventHandlerLookup( strEventID, strFunc, objTarget )

파라미터

this.PopupDiv00_onmove = function( obj:nexacro.PopupDiv,  e:nexacro.MoveEventInfo) { // 수행할 스크립트 };
var nIndex = this.PopupDiv00.addEventHandlerLookup( "onmove", "PopupDiv00_onmove", this);

반환

참고

- strFunc 이름의 함수를 objTarget 영역부터 상위로 올라가며 검색합니다.
  검색된 함수가 있다면 이벤트에 핸들러 함수로 추가합니다.

clearEventHandler

특정 이벤트에 등록된 핸들러 함수를 모두 제거하는 메소드입니다.

지원 환경