이 장에서는 Form의 상호관계를 좀 더 구체적으로 도식화하여 설명합니다.
표기법
Frame의 상호관계를 도식화할 때 사용하는 표기법을 설명합니다.
box
collection 상의 Item으로 실제 이름을 의미하지는 않습니다.
연결선
1:1 연결을 표기합니다. 원 모양의 연결 아이콘이 있는 부분이 Child가 됩니다.
1:N 연결을 표기합니다. 까마귀발(Crow's foot) 연결 아이콘이 있는 부분이 Child가 됩니다.
설명
아이템 간의 스크립트 문법은 연결선 위에 표기합니다.
Parents에서 Child로의 스크립트는 연결선 상단에 표기합니다.
Child에서 Parents로의 스크립트는 연결선 하단에 표기합니다.
위 표기는 다음을 의미합니다.
parent와 child가 1:N의 관계입니다.
parents.id스크립트로 child에 접근할 수 있습니다.parents.child[index]스크립트로 child에 접근할 수 있습니다.child.parent스크립트로 parent에 접근할 수 있습니다.
용어정의
용어 | 설명 |
|---|---|
element | component의 property, method, event를 통칭하여 component의 element라고 합니다. |
공통으로 사용하는 Syntax
'[', ']' 내에는 index 또는 'id'가 올 수 있습니다.
즉, this.all[0]과 this.all['btn0'] 둘 다 동일 component를 가리킬 수 있습니다.
Form
관계도
일반 Form인 경우
frame_tree_form
container component인 경우
frame_tree_form_div
Script 예시 화면
frame_tree_script_01
인덱스 순서는 dtset1, btn0, btn1, cmb0, div0, div1, bind1으로 가정합니다.
일반적인 폼에서 인덱스 순서는 Dataset이 가장 먼저 오고 나머지 컴포넌트는 배치된 순서대로 정해지며 Bind 오브젝트가 마지막에 지정됩니다.
한 form에서 같은 level에서만 id가 중복될 수 없다. 즉, btn0와 div0_btn0와 div2_btn은 동일 Level이 아니므로, 같은 id로 지정하여도 무방합니다.
component / invisible object / bind 의 Script 접근
this.classname == "frm0" this.name == "frm0"
// btn0으로의 접근 this.all["btn0"].name == "btn0" this.all[1].name == "btn0" this.btn0.name == "btn0" this.components[0].name == "btn0" this.components["btn0"].name == "btn0"
// dtset1으로의 접근 this.all["dtset1"].name == "dtset1" this.all[0].name == "dtset1" this.dtset1.name == "dtset1" this.objects[0].name == "dtset1" this.objects["dtset1"].name == "dtset1"
// component / invisible object / bind의 개수 this.all.length == 7 this.components.length == 5 //btn0, btn1, comb0, div0, div1 this.binds.length == 1
container component에 Script 접근
form을 연결하지 않은 container component도 동적으로 invisible object / bind를 가질 수 있습니다.
// div0내의 div0_btn0으로의 접근 this.div0.div0_btn0.name== "div0_btn0" this.div0.all[0].name == "div0_btn0" this.components[3].components[0].name == "div0_btn0"
// div2내의 div2_btn0으로의 접근 this.div0.div2.div2_btn0.name == "div2_btn0" this.all["div0"].all["div2"].all["div2_btn0"].name == "div2_btn0" this.components["div0"].components["div2"].components["div2_btn0"].name == "div2_btn0"
form을 연결한 container component에 Script 접근
// (frm1안의 script인 경우) frm1에 있는 btn0의 접근 this.name == "div1" this.btn0.name == "btn0" this.all["btn0"].name == "btn0"
// (frm0안의 script에서 접근할 경우) frm1에 있는 dtset1의 접근 this.name == "frm0" this.div1.btn0.name == "btn0" // "frm1"을 흡수한 "div1"으로만 접근할 수 있습니다.
parent의 Script 사용
this.div1.dtset2.parent.parent.classname == "frm0" this.div1.dtset2.parent.name == "div1" // frm1은 div1에 연결되면서 그 특성을 잃게 됩니다. this.div1.dtset2.parent.classname == undefined // frm1은 div1에 연결되면서 그 특성을 잃게 되어 classname이 존재하지 않게 됩니다. this.div1.dtset2.parent.name == "div1"
container component의 element사용
form을 연결한 container component는 form처럼 components, invisible object, bind (이하 element)를 가질 수 있습니다.
form을 연결하지 않은 container component는 invisible object, bind를 가질 수 없고 component만 가질 수 있습니다.
container 기능이 없는 component와 invisible object, bind는 element를 가질 수 없습니다.
container component는 연결된 form의 특성을 가집니다.
form script에서 this로 접근할 경우, 연결된 form 내부의 element뿐만 아니라 container component의 element에도 접근할 수 있습니다.
container component가 속한 form에 this.component_name으로 접근할 경우, 연결된 form의 모든 elements에 접근할 수 있습니다.
Application
관계도
frame_tree_application
form내의 component / bind / invisible object는 .getOwnerFrame()이나 .getOwnerForm()이 없습니다.
Script 예시 화면
frame_tree_script_application
application에서 form의 script 접근
// frm0로의 접근 (ChildFrame인 경우) application.mainframe.frame.form.name =="frm0" application.mframe0.frame.form.name == "frm0" application.mframe0.chdframe0.form.name == "frm0" application.all[0].all[0].form.name == "frm0" application.all["mframe0"].all["chdframe0"].form.name == "frm0" this.mainframe.frame.form.name == "frm0"
form에서 application의 script 접근
// frm0에서 application으로 접근 (ChildFrame인 경우) this.parent.name == "chdframe0" this.parent.parent.name == "mframe0" this.getOwnerFrame().getOwnerFrame().name == "mframe0" this.getOwnerFrame().getOwnerFrame().parent.mainframe.name == "mframe0"