What is available to be used at XLATFORM by making the component or object as the user wants is Customized Object.

What is Customized Object?

To explain Customized Object easily, it is like that by using Binary Object provided at XPLATFORM, the users develop themselves the function that they want and it can be used equally with Binary Object.

The followings are the kind of the Customized Object provided at XPLATFORM:

User Object
Composite Component
Form Inheritance

When Customized Object which is developed and used at XPLATFORM is made to the schematic in brief, it is as follows: Or it is directly developed at UX-Studio, registered to TypeDefinition and used.

What is Binary Object?

Binary Object is the all the object provided at XPLATFORM. This object is divided into Visible Object and Invisible Object as follows:

Visible Object is used with the term of component at XPLATFORM and object is used to call all the objects provided at XPLATFORM.

Invisible Object is the name for convenience to distinguish the part which does not have the visual properties among Objects. In general, object means all the objects including component and especially, when it is distinguished from component, the term of invisible object is used.

Relationship between Customized Object and Binary Object

To describe the relationship between Customized Object and Binary object, it is as follows:

The Relationship between User Object and Binary object

User Object has the inheritance relationship with Binary Object. Therefore, User Object has basically all of the functions that Binary Object has. Definitely, all of the Binary Object can’t be inherited. Except the object that is declared as Final, all the other objects can be inherited. (For the reference, the object list whose inheritance is possible is provided at wizard of UX-Studio.) And XPLATFORM supports only the single inheritance. Therefore, User Object is also possible for the single inheritance.

The Relationship between Composite Component and Binary object

Composite Component is Customized Component that many User Objects and Binary Objects are combined.

Binary Object at Form Inheritance

Form Inheritance is composed by receiving Form as inheritance. There is not specific limitation to receive form as inheritance. In other words, form which is composed with Binary object, User Object, Composite Component is inherited and then by adding Binary object, user object, composite component, form can be re-composed.

Comparison of Customized Objects

	User Object	Composite Component	Form Inheritance
Target for use	object, User Object, Composite Component that are defined at XPLATFORM	Among the objects that are registered at TypeDefinition, the ones whose type is not UserForm	Among the objects that are registered at TypeDefinition, the ones whose type is UserForm
TypeDefinition Registration	O	O	O
Design Change	O	X	X
Toolbar Registration Possibility	O	O	X

O is possible and X is impossible.
Target for use: User Object – the target that can inherit object
Composite Component – the object that can compose Composite Component
Form Inheritance – the target that can receive form as inheritance
TypeDefinition registration: whether to register to TypeDefinition or not
Design change: whether the target can be changed or not at design (For the details, refer to each concept.)
Toolbar registration: whether icon is registered or nor at UX-Studio Toolbar

Invalid use of a member variable and new operator and how to solve it.

A new operator is used to create a new object and a constructor is called to initialize the object.

By using a new, you can create a new object as a member variable for your user class. Unlike your intention, however, the new object will act as a global static variable if the new is applied simultaneously with a class declaration.

Accordingly, you must use a new in the constructor of your user class to declare a member variable and create an object of this variable.

Composite Component

Since User Object doesn’t support multi inheritances, it is impossible for itself to make the wanted Object by binding multi Objects. Here, XPLATFORM provides the function which can make one component by binding multi Objects, which is Composite Component.

Concept of Composite Component

Composite Component is to make the component by using the object that is possible to be used at XPLATFORM. The basic concept that Composite Component has is as follows:

It has a Form.
It uses the method to save to Composite Component by adding the objects required for one Form. Definitely, Composite Component can be made by implementing the necessary function just with the invisible objects (socket, dataset, etc) or script but it can be made only by putting on Form and by saving.

It is used by registering at UX-Studio Toolbar.
Like Binary component, Composite Component is used by registering at the tool bar of UX-Studio. Therefore, multi Composite Components can be put on one screen. Each component can be used by dividing into ID. Definitely, in order to use by registering at Toolbar, it is possible by registering at TypeDefinition.

Design change is impossible.
If Composite Component is intended to use like Binary Component, object and script in it can’t be changed after it is registered. In other words, at the design, the position of the button in Composite Component or the value for style Property is impossible to change. But it is possible for script at Runtime.
As follows, in case of dragging the mouse after putting two Composite Components on the form, it will be known that the components inside of composite Component are not selected. Or since the inside components are not selected, the applicable property can’t be changed.

Making File of Composite Component

Composite Component can be made with the same method to make Form. But it can be used only by registering the made form at TypeDefinition.

Registering at Composite Component TypeDefinition

In order to use the Composite Component developed by the developer at XPLATFORM like Binary Component, it must be registered at TypeDefinition and its method is as follows:

Stage 1. Popping up the Edit TypeDefinition windows 
First, double click TypeDefinition at Project Explorer of UX-Studio or click the right mouse and select the edit.

Stage 2. Popping up the Add Object windows 
Click the Add button at Objects of the Edit TypeDefinition windows.

Stage 3. Selecting Object Type 
Select Composite among Types at the Add Object windows.

Stage 4. Selecting the Composite Component file
Select the Composite Component file to add by popping up the Extern File windows through the url finding button at the Add Object windows and then push the OK button. Now the Object is added.

Using Composite Component

At Form, Composite Component can be used with its id as binary Object and User Object are used. In other words, in case that Composite Component id is compositeForm00, by approaching to compositeForm00 with script, the functions and variables made at the applicable Composite Component can be used. Also, the Objects at Composite Component can be used by approaching.

The followings are the examples which are used in chase that the id of Composite Component is compositeForm00:

// approach to the functions and variables declared at Composite Component
compositeForm00.myTrace(compositeForm00.strCompositeForm); 
// onclick event occurs at the button in Composite Component
compositeForm00.Button00.onclick.fireEvent(obj, e); 
// change the property of the button in Composite Component
compositeForm00.Button00.text = "oh~"; 
compositeForm00.Button00.style.gradation = "linear 0,0 white 100,100 black";
// execute the button move method in Composite Component
compositeForm00.Button00.move(374, 20);

Example of Composite Component

The screen with Grid bound at Dataset and Edit 2 is composed as follows:

Script is implemented as follows:

var strCompositeForm = "CompositeForm";

function Button00_onclick(obj:Button, e:ClickEventInfo)
{
	alert(Dataset00.rowcount);
	myTrace("Button00_onclick");
}

function myTrace(val)
{
	trace("my trace : " + val);
}

In other words, the applicable handler is implemented by putting one function (strCompositeForm) and one variable (myTrace) at the form and registering handler at button.

After registering the made form at TypeDefinition to the composite and putting on the form, it can be designed as follows:

The above screen is made by putting two composite components and designating the one the gradation at background.

Script is made as follows:

function Button00_onclick(obj:Button, e:ClickEventInfo)
{
	compositeForm00.myTrace(compositeForm00.Button00.text);
	compositeForm00.Button00.onclick.fireEvent(obj, e);
	alert("^^");
}

function compositeForm00_onclick(obj:compositeForm02, e:ClickEventInfo)
{
	trace("compositeForm00_onclick");
	for (x in e)
		trace(x + " : " + e[x]);

	trace("object ");
	for (y in obj)
		trace(y + " : " + obj[y]);
}

function Button01_onclick(obj:Button, e:ClickEventInfo)
{
	compositeForm00.Button00.text = "oh~";
	compositeForm00.Button00.style.gradation = "linear 0,0 white 100,100 black";
}

function Button02_onclick(obj:Button, e:ClickEventInfo)
{
	compositeForm00.Button00.move(374, 20);
	trace(compositeForm00.strCompositeForm);
}

For the description of Script, refer to “Chapter 10.2.4.”- Using Composite Component.

Form Inheritance

Form Inheritance is the one which can make the new Form by receiving the already made Form as inheritance and adding the other Objects.

Concept of Form Inheritance

In order to describe the concept of Form Inheritance, the form that gives inheritance is described as parent form and the one that receives inheritance is described as child form.

Draw parent form with the basis of the coordinates 0,0 of the child form.
In case that there is UI at parent form, draw the components of parent form with the basis of the coordinates 0,0 (basis of top and left) of child form.

At the source of Child form, the name of the information about parent form is just stated as follows but actually it doesn’t contain any information.

<?xml version="1.0" encoding="utf-8"?>
<FDL version="1.0">
	<TypeDefinition url="..\..\default_typedef.xml"/>
	<Form id="childForm03" classname="childForm03" inheritanceid="baseForm01" 
		cachelevel="" position="absolute 0 0 1024 768" version="" 
		titletext="New Form">
		<Layout>
			<Button id="Button02" position="absolute 407 37 527 87" 
				taborder="0" text="Button02"/>
		</Layout>
	</Form>
</FDL>

Registration of TypeDefinition
In order to receive Form as inheritance, it must be registered at TypeDefinition. It is not registered at Toolbar like User Object and Composite Component. When it makes the form, just designate the form to receive inheritance.

Impossibility to correct Parent Form
The object and script of Parent form can’t be corrected. In other words, at design, it is impossible for the button position in parent form or the style to be changed. But changing to script is possible at Runtime.
As follows, in case of dragging the mouse after receiving form as inheritance, it will be known that the components inside of parent form are not selected. Or since the inside components are not selected, the applicable property can’t be changed.

Registering Form at TypeDefinition

In order the form made by the developer to receive inheritance and to use, it must be registered TypeDefinition. When User Object and Composite Component are registered at TypeDefinition, icon occurs with the applicable component id at the toolbar of UX-Studio의 toolbar but since Form is not Object, icon doesn’t occur at the toolbar.

The way to register at TypeDefinition is as follows:

Stage 1. Popping up the Edit TypeDefinition windows 
Double click TypeDefinition at Project Explorer of UX-Studio or click the right mouse and then select the edit.

Stage 2. Popping up the Add Object windows 
Click the Add button at Objects of the Edit TypeDefinition windows.

Stage 3. Selecting Type 
Select the UserForm among Types at the Add Object windows.

Stage 4. Selection of the Form file
Select the form intended to add by popping up Extern File windows through the url finding button at the Add Object windows. Press the OK button and then objects are added.

Making the Form File by Receiving Inheritance

It is made by designating the form to receive inheritance when the Form is made. The details are as follows:

Stage 1. Popping up the Create New Form Wizard windows 
Select the New of Toolbar at UX-Studio or select at Menu (File > New > Item > Form).

Selection at Menu

Selection of the New of Toolbar

Stage 2. Designating the Form name and path 
At the Create New Form Wizard windows, designate the Form name at the Name and the path at the Location and then push the Next button.

Stage 3. Designating the form to receive inheritance
At Inheritance FDL, designate the form to receive inheritance and then push the Next.

As a reference, the list of Inheritance FDL has only for UserForm whose Object type is TypeDefinition.

Stage 4. Designating the form size 
Designate the size of the form intended to be made.
Input the horizontal length of the form at Width and the vertical length of at Height.

Stage 5. Setting whether Widget form is designated or not
When developed with Widget, check “A form for creating a widget”. Without checking the other forms, press the OK button.

Using the form which receivs inheritance

At Child form, not only the functions and variables of parent form but also the objects at parent form are approachable. The way to approach is the same as that to approach the object, function and variable in the child form. If there is an overridden function at child form, call the one at the child form. When the one at the parent form is called with force, it can be approached with the reserved word which is called as super.

Function Override

If the function at Parent is intended to re-define at the child, make it with the same name at the parent. It is similar to the principle to call the function which is at the last in case that there are many functions with the same name at ECMAScript spec3. Also, at ECMAScript spec3, even though the parameter of the function is different, they are recognized as the same and only the last function is recognized. In other words, the function overload is not supported. For a reference, in order to use the function overload, it must be done by using arguments.

The example which implements the overload by using arguments.length

function myOverload () 
{
	if(arguments.length == 1) {
		return(arguments[0] + 10);
	} else if (arguments.length == 2) {
		return(arguments[0] * arguments[1]);
	}
}

alert(myOverload(10)); // 20
alert(myOverload(10, 10)); // 100

Example of Form Inheritance

The form that gives the animation effect at Image is made as follows:

It is a very simple form like when the Run button is pushed, the image with the automobile shape moves forward and when the init button is pushed, it returns to the original position. In order to implement the Animation function, the PropertyAnimation object is put on the form and the position x value is changed.

The source is as follows:

<?xml version="1.0" encoding="utf-8"?>
<FDL version="1.0">
	<TypeDefinition url="..\default_typedef.xml"/>
	<Form id="parentForm" classname="parentForm" inheritanceid="" cachelevel="" 
		position="absolute 0 0 1024 768" version="" titletext="New Form">
		<Layout>
			<ImageViewer id="ImageViewer00" taborder="0" text="ImageViewer00" 
				image="URL('images::intro_image01.png')" 
				position="absolute 10 80 640 196"/>
			<Button id="Button00" taborder="1" text="Run" 
				position="absolute 483 32 560 58" 
				style="clickeffect:PropertyAnimation00;"/>
			<Button id="Button01" taborder="2" 
				position="absolute 566 32 643 58" text="init" 
				onclick="Button01_onclick"/>
		</Layout>
		<Objects>
			<PropertyAnimation id="PropertyAnimation00" starttime="0" 
				targetcomp="ImageViewer00" interpolation="Interpolation.bounceOut" 
				fromvalue="10" duration="3000" targetprop="position.x" 
				tovalue="400" endingmode="current"/>
		</Objects>
	</Form>
</FDL>

Script is as follows:

function Button01_onclick(obj:Button, e:ClickEventInfo)
{
	ImageViewer00.move(10, 80);
}

For the detailed description about Animation, refer to “Chapter 5 – the Animation function”.

In order to receive form implemented as above in inheritance, register it at TypeDefinition.

With receipt of the form registered at TypeDefinition in inheritance, the child form is made as follows:

Since the Child form is inherited from parent, without the Animation object, its mage moves forward by pushing the Run button as the same as that at parent form. And in order to add the function which makes Animation stopped in the middle of the process, The Animation Stop Code is added with adding the Stop button.

The source is as follows:

<?xml version="1.0" encoding="utf-8"?>
<FDL version="1.0">
	<TypeDefinition url="..\default_typedef.xml"/>
	<Form id="childForm" classname="childForm" inheritanceid="parentForm" 
		cachelevel="" position="absolute 0 0 1024 768" version="" 
		titletext="New Form">
		<Layout>
			<Button id="Button03" taborder="1" text="stop" 
				onclick="Button03_onclick" position="absolute 648 31 711 58"/>
		</Layout>
		<Objects/>
	</Form>
</FDL>

And the script is as follows:

function Button03_onclick(obj:Button, e:ClickEventInfo)
{
	PropertyAnimation00.stop();
}

If you look at the source of Child form, you can see that it states the name of the inherited form file to inheritanceid and that it has only the button which is added newly. Also, you can see that the function is added and it approaches PropertyAnimation00 which is the object and doesn’t exist at the child form to the script and makes Animation stopped.