Programming Without Coding Technology (PWCT) - Center Window

35
PWCT 1.9 Art Documentation ( http://doublesvsoop.sourceforge.net ) 2006-2013, Mahmoud Fayed ( [email protected] ) _____________________________________________________________________________________ Table of contents 1 - Introduction 2 - Implementation steps 3 - Final Steps Tree 4 - Application during the runtime 1 - Introduction In this lesson we are going to create the Center Window sample. 2 - Implementation Steps Fig. (1) Goal Desginer - Steps Tree Select the step (The First Step) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Windows) 3 - Select the component (Define New Window) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define New Window) Note : Stop typing when you see the required component is selected

Transcript of Programming Without Coding Technology (PWCT) - Center Window

PWCT 1.9 Art Documentation ( http://doublesvsoop.sourceforge.net ) 2006-2013, Mahmoud Fayed ( [email protected] ) _____________________________________________________________________________________

Table of contents

1 - Introduction 2 - Implementation steps 3 - Final Steps Tree 4 - Application during the runtime

1 - Introduction

In this lesson we are going to create the Center Window sample.

2 - Implementation Steps

Fig. (1) Goal Desginer - Steps Tree

Select the step (The First Step) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Windows) 3 - Select the component (Define New Window) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define New Window) Note : Stop typing when you see the required component is selected

Fig. (2) Component Browser – Select the component (Define New Window)

After selecting the component click Ok or press ENTER

Fig. (3) Interaction page - Set the properties and enter the required data as in the image above

Fig. (4) Form Designer

Fig. (5) Goal Desginer - Steps Tree

Select the step (Window Controls) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Controls) 3 - Select the component (Label) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Label) Note : Stop typing when you see the required component is selected

Fig. (6) Component Browser – Select the component (Label)

After selecting the component click Ok or press ENTER

Fig. (7) Interaction page - Set the properties and enter the required data as in the image above

Fig. (8) Form Designer

Fig. (9) Goal Desginer - Steps Tree

Select the step (Window Controls) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Controls) 3 - Select the component (Button) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Button) Note : Stop typing when you see the required component is selected

Fig. (10) Component Browser – Select the component (Button)

After selecting the component click Ok or press ENTER

Fig. (11) Interaction page - Set the properties and enter the required data as in the image above

Fig. (12) Form Designer

Fig. (13) Goal Desginer - Steps Tree

Select the step (Window Controls) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Controls) 3 - Select the component (Label) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Label) Note : Stop typing when you see the required component is selected

Fig. (14) Component Browser – Select the component (Label)

After selecting the component click Ok or press ENTER

Fig. (15) Interaction page - Set the properties and enter the required data as in the image above

Fig. (16) Form Designer

Fig. (17) Goal Desginer - Steps Tree

Select the step (Window Controls) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Main Menu) 3 - Select the component (Define Main Menu) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define Main Menu) Note : Stop typing when you see the required component is selected

Fig. (18) Component Browser – Select the component (Define Main Menu)

After selecting the component click Ok or press ENTER

Fig. (19) Interaction page - Set the properties and enter the required data as in the image above

Fig. (20) Goal Desginer - Steps Tree

Select the step (MENU POPUPS) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Main Menu) 3 - Select the component (Define POPUP) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define POPUP) Note : Stop typing when you see the required component is selected

Fig. (21) Component Browser – Select the component (Define POPUP)

After selecting the component click Ok or press ENTER

Fig. (22) Interaction page - Set the properties and enter the required data as in the image above

Fig. (23) Goal Desginer - Steps Tree

Select the step (POPUP ITEMS) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Main Menu) 3 - Select the component (Define Item) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define Item) Note : Stop typing when you see the required component is selected

Fig. (24) Component Browser – Select the component (Define Item)

After selecting the component click Ok or press ENTER

Fig. (25) Interaction page - Set the properties and enter the required data as in the image above

Fig. (26) Goal Desginer - Steps Tree

Select the step (POPUP ITEMS) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Main Menu) 3 - Select the component (Define Item) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define Item) Note : Stop typing when you see the required component is selected

Fig. (27) Component Browser – Select the component (Define Item)

After selecting the component click Ok or press ENTER

Fig. (28) Interaction page - Set the properties and enter the required data as in the image above

Fig. (29) Goal Desginer - Steps Tree

Select the step (proc) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Structure Programming) 3 - Select the component (Define Procedure) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define Procedure) Note : Stop typing when you see the required component is selected

Fig. (30) Component Browser – Select the component (Define Procedure)

After selecting the component click Ok or press ENTER

Fig. (31) Interaction page - Set the properties and enter the required data as in the image above

Fig. (32) Goal Desginer - Steps Tree

Select the step (Button Events) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Events) 3 - Select the component (Button Events) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Button Events) Note : Stop typing when you see the required component is selected

Fig. (33) Component Browser – Select the component (Button Events)

After selecting the component click Ok or press ENTER

Fig. (34) Interaction page - Set the properties and enter the required data as in the image above

Fig. (35) Goal Desginer - Steps Tree

Select the step (Start Here) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Windows) 3 - Select the component (Window Class) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Window Class) Note : Stop typing when you see the required component is selected

Fig. (36) Component Browser – Select the component (Window Class)

After selecting the component click Ok or press ENTER

Fig. (37) Interaction page - Set the properties and enter the required data as in the image above

Fig. (38) Interaction page - Set the properties and enter the required data as in the image above

Fig. (39) Interaction page - Set the properties and enter the required data as in the image above

Fig. (40) Goal Desginer - Steps Tree

Select the step (Window Controls) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Controls) 3 - Select the component (Image) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Image) Note : Stop typing when you see the required component is selected

Fig. (41) Component Browser – Select the component (Image)

After selecting the component click Ok or press ENTER

Fig. (42) Interaction page - Set the properties and enter the required data as in the image above

Fig. (43) Form Designer

Fig. (44) Goal Desginer - Steps Tree

Select the step (Window Controls) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Controls) 3 - Select the component (Button) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Button) Note : Stop typing when you see the required component is selected

Fig. (45) Component Browser – Select the component (Button)

After selecting the component click Ok or press ENTER

Fig. (46) Interaction page - Set the properties and enter the required data as in the image above

Fig. (47) Form Designer

Fig. (48) Goal Desginer - Steps Tree

Select the step (proc) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Structure Programming) 3 - Select the component (Define Procedure) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Define Procedure) Note : Stop typing when you see the required component is selected

Fig. (49) Component Browser – Select the component (Define Procedure)

After selecting the component click Ok or press ENTER

Fig. (50) Interaction page - Set the properties and enter the required data as in the image above

Fig. (51) Goal Desginer - Steps Tree

Select the step (Button Events) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Events) 3 - Select the component (Button Events) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Button Events) Note : Stop typing when you see the required component is selected

Fig. (52) Component Browser – Select the component (Button Events)

After selecting the component click Ok or press ENTER

Fig. (53) Interaction page - Set the properties and enter the required data as in the image above

Fig. (54) Goal Desginer - Steps Tree

Select the step (Start Here) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Windows) 3 - Select the component (Window Class) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Window Class) Note : Stop typing when you see the required component is selected

Fig. (55) Component Browser – Select the component (Window Class)

After selecting the component click Ok or press ENTER

Fig. (56) Interaction page - Set the properties and enter the required data as in the image above

Fig. (57) Interaction page - Set the properties and enter the required data as in the image above

Fig. (58) Interaction page - Set the properties and enter the required data as in the image above

Fig. (59) Goal Desginer - Steps Tree

Select the step (Window Properties) We will start now new interaction process to generate new steps to our steps tree. The slow way (Using Mouse): 1 - Click Interact to open the components browser 2 - Select the domain (Windows) 3 - Select the component (Window Class) The fast way (Using Keyboard shortcuts): 1 - Get the component using its name by typing (Window Class) Note : Stop typing when you see the required component is selected

Fig. (60) Component Browser – Select the component (Window Class)

After selecting the component click Ok or press ENTER

Fig. (61) Interaction page - Set the properties and enter the required data as in the image above

Fig. (62) Interaction page - Set the properties and enter the required data as in the image above

Fig. (63) Interaction page - Set the properties and enter the required data as in the image above

Fig. (64) Form Designer

Fig. (65) Goal Desginer - Final Steps Tree

3 - Final Steps Tree

The First Step Define New Window ( win1 ) , Title : "Center Window" Window Events Window Properties win1.Center ( ) Window Controls Define Label ( lbl1 ) , Caption : "The First Application using PWCT" Label Events Label Properties Define New Button ( btn1 ) , Caption : "Ok" Button Events Event: ON CLICK : Action Sameh() Button Properties Define Label ( lbl2 ) , Caption : "mr sameh" Label Events Label Properties START OF MAIN MENU

MENU POPUPS DEFINE POPUP "Sameh" POPUP ITEMS Define ITEM ( "About Application" ) NAME About

SEPARATOR Define ITEM ( "Exit" ) END OF POPUP END OF MAIN MENU Define New Image ( image1 ) , Image : "logo.jpg" Events Properties Define New Button ( btn2 ) , Caption : "Center Window" Button Events Event: ON CLICK : Action Sameh2() Button Properties End Of Window Activate window proc Define Procedure Sameh Start Here win1.Release ( ) End of Procedure Define Procedure Sameh2 Start Here win1.Center ( ) End of Procedure

4 - Application during the runtime

Fig. (66) Application during the runtime

Fig. (67) Application during the runtime

Fig. (68) Application during the runtime