Using Python inside Programming

Without Coding Technology (PWCT)

environment

Author : Mahmoud Samir Fayed (msfclipper@yahoo.com) – Last update (2013/12/09)

Introduction

In this article we are going to learn how to use Python inside Programming Without

Coding Technology (PWCT) environment through PythonPWCT.

Python is a free open source general purpose scripting language (known and widely used

by many programmers and software developers). Python is a text based programming

language where the programmer type text based instructions using the language syntax to

determine the function of the program and get the required results. Python is known as

easy to learn scripting language with powerful features like Multi-paradigm (Imperative,

Object-Oriented, Functional, etc), rich standard library and extension system using the C

programming language.

There are many tools and libraries for Python that can be used based on the application

domain to get the task done in short time, for example we can use a GUI framework like

wxPython, PyQt, PySide or PyGTK to create rich GUI applications, We can use a web

framework like Django, TurboGears, Zope2, or web2py to create web applications. What

ever the domain you may find python frameworks to help you in your task.

Programming Without Coding Technology is a free open source general purpose visual

programming system. Inside PWCT we can create programs using visual programming

without typing text based source code. This seems to be an attractive feature for novice

programmers, but PWCT is designed to take in mind some of the expert programmer

needs (Productivity and Customization). When we create applications using PWCT we

can see/edit the generated source code (optional). PWCT system contains more than one

visual programming language (HarbourPWCT, PythonPWCT, C#PWCT,

SupernovaPWCT & CPWCT). from the name of the visual language we can guess the

text based language that are used in the code generation process. PythonPWCT is a visual

programming language that generate the source code in the Python programming

language.

We will learn how to create our first application using PythonPWCT, how to see/edit the

generated source code and how to play with the environment to get more productivity and

get advantages from customization.

Background

You can get a quick background about PWCT from this article

Using the code

The next code is a very simple program written in Python. The first line print "Hello

World" message on the screen, then we have a For loop start from 0 to 9 using range(10),

inside this loop we print the loop variable (x) and before printing the variable value we

check if the variable value equal three, if this happens (must happen) we print the

message "this is number three".

print "Hello World"

for x in range ( 10 ):

if x == 3 :

print "This is number three"

print x

The program is just a test for the print command, for loop and if statement. This program

is text based (As we said before Python is a text based programming language).

Using PythonPWCT, the program representation (after create it using visual

programming step by step) will be as in the next figure

We see that inside the PWCT visual programming environment, the program

representation is done using a tree of steps, each node inside this tree have properties

(Type, Text & Color).

When we write Python code directly, we have only the Text and this text must follow the

Python Syntax rules but using the steps tree, the visual representation is a layer between

the programmer and the text based code. this layer gives as the ability to customize the

program representation without restriction from the Python language syntax. We have

the freedom to change the step text, we can write it using a natural language (English,

French, Arabic etc). we can keep it very short or too long or something in the middle

based on what we prefer, we can change the order and put keywords first or the data first.

You will see that the steps tree contains steps like (End of if statement) and (End of for

loop) and we know that the Python language don't use keywords to end a block. Using

the steps tree we can get this feature, also we can avoid it and remove these steps. This

decision is left for the programmer.

One of the ideas behind PWCT is to let the programmer control the process, the

programmer decide how the program representation looks, select the keywords that will

be used to create the program, control the generated source code, work with a team on the

same project where each programmer see the program in his own language without

confusing other programmers.

Now we will create this program step by step to see how we can do this at the practical

side

[1] Download PWCT, we will work using PWCT 1.9 (Art) Rev. 2013.10.15 , you don't

need to have Python, PWCT comes with Python 2.7

PWCT is a MS-Windows product, when you download the software you can install it

using the Setup program, you can determine the path of the installation, the default path

is C:\PWCT19

After installing PWCT, you will find Python in C:\PWCT19\SSBUILS\Python27 , but we

will not use Python directly, we will work through PWCT environment.

[2] After installing PWCT, we will get the environment shortcut, use it to run the PWCT

environment

[3] The PWCT environment looks as in the next figure, the default visual programming

language is HarbourPWCT, this visual language generate the source code in the Harbour

programming language, we will switch to PythonPWCT to generate the source code in

the Python programming language.

To change the active visual programming language, from the toolbar we have a

combobox where we can select the visual language. When you install PWCT you will

find HarbourPWCT, CPWCT, C#PWCT, PythonPWCT and SupernovaPWCT

(WebPWCT still under development ).

[4] When we select PythonPWCT, we can start developing our application, from the file

menu select new, then select the template "PWCT Application - Main Goal" then

determine the project file name, for example ( Lesson1.ssf ) and you can put the project

file in a folder to see the project files in one place.

In the start, when we create Lesson1.ssf we will have two files inside the application

folder (Lesson1.ssf & Lesson1.fpt) these files will be used for storing information about

the visual source of the program

When we run the program we will get Lesson1.py (the Python program file).

Inside PWCT environment, the default active window is the "Goal Designer" window,

inside the visual programming world of PWCT, you can conside the Goal Designer as the

tool that will replace your code editor when you write the code directly. You can call the

Goal Designer as the Visual Editor of the program.

This visual editor can work in two modes, The first mode is "Syntax Directed Editor"

mode, where you create the program and the editor put restrictions about what you can do

to avoid the errors (Syntax Errors, here in visual programming a syntax error is an error

that happens when you put a component in an incorrect location). The second mode is

"Free Editor + VPL Compiler" where the Syntax Directed Editor is off and you have the

freedom to make errors then you can use the VPL (Visual Programming Language)

compiler to discover these errors. The default mode is the first mode "Syntax Directed

Editor is ON".

[5] The active step in the step tree is called "The First Step", the step type is a comment,

we have two types of steps inside the step tree, the first is a comment and the other step is

instruction where each step of type instruction hide a block of the generated code.

The step text "The First Step" can be changed by the programmer using the edit button

[6] Now we will go forward towards creating our program, at first we want to print

"Hello World" message on the screen, to do this we will generate a new step inside the

step tree.

The process of adding new generated steps in the steps tree is called "Interaction", to start

new interaction process, we click on the interact button, or we can press CTRL+T

Another method instead of clicking on the button or pressing CTRL+T we can start the

interaction process by typing the required component name. for example we want to

generate a step that print text on the screen. the component that can be used to do this is

called "Print Text", we can start the interaction processing by typing the first letter in the

component name, in this situation the first letter is "P" so we can just press "P".

[7] When we start new interaction process, we get the components browser window. You

can consider the components browser as a "Toolbox". We have the Domain Tree and

each item in the Domain Tree contains list of components. We can explore the

components using the mouse and we can quickly select a component using the keyboard

through the interactive search process.

Now we have the domain "Console" and we are going to use the component "Print Text

in New Line".

When we select a component we can click Ok to use it, or we can press "ENTER"

We can press "ESC" or click on Cancel to end the interaction process without doing

anything.

[8] When we select a component using the components browser, we will get the

"Interaction Using Transporter" window. this window is a date-entry form where we

enter the data to the component. the name "Transporter" is just another name replacement

for "component" inside PWCT. this name comes because the component get data from

the programmer then transport this data two times, one time for the visual representation

of the program "steps tree" and another time for the generated source code.

In the interaction page we will type the text "Hello World" then we can click on the Ok

button or we can press CTRL+W.

We can use the same component more than one time by clicking on the Again button or

by pressing CTRL+A.

This component is very simple, the component do one function (print text) and contains

one interaction page, other components may do more than one function and may contails

more than one interaction page.

[9] When we enter the required data to the component then click on OK, we come back

to the Goal Designer window, but this time we see a new step is generated in the steps

tree

To run the program use the button "!" from the toolbar or press CTRL+R

To see the generated source code after running the program, see the file Lesson1.py in the

application folder.

To see the generated source code behind a step, select the step then click on the "Step

Code" button

[10] Now we will continue creating our program, select the first step then start new

interaction process, at this time we will select the "For Loop" component.

In the interaction page, we will see that the component contains default values, these

values are the values that we need in our program so we will not change anything

We will get the next steps tree, and the active step will be the step "Start Here", from this

step we can start new interaction process.

[11] We will use the "IF Statement" component to check the for loop variable value.

The if statement component will ask us to enter the conditon, we wil type x==3

After using the IF Statement component, we will get the next steps tree

[12] We can use the component "Print Text" from the step "Start Here" inside the IF Step

and from the Step "Start Here" inside the For step to get the final steps tree of our

program

Now we can run the program (CTRL+R) and we can look at the generated source code

(Lesson1.py)

The next figure is a screen shot for the program during the runtime.

In the next figure we see the file Lesson1.py opened using Python IDE.

Now we will create another application, this time we will create a GUI application

At first we will create new project (Lesson2.SSF)

From the first step we will start new interaction process, select the domain "Window"

then the component "Window", we can do this quickly by typing "w" from the steps tree.

When we use the window component, we will get the next interaction page, enter the

window title "PythonPWCT" then press CTRL+W

In this interaction page we see more options, we can determine the window properties,

window name and window type.

We can select the window type from the listbox

After entering the data to the component, we get the next steps tree

We can open the Form Designer, using the form designer button or by pressinf CRTL+F

Using the form designer window we can quickly design the user interface

We can add new controls, select one or more of controls, set the position, font and colors

To add new controls to the window, you can add it using interaction process from the

steps tree or using "Add control" button from the form designer.

To change the backcolor of the window, you can use the "Back color" button.

We will add a Label control to our window, then we will set the font size of this control

using the Font dialog

From the interaction page, set the label caption to "Welcome"

After adding the label control to the window, click on the Font button to set the font size

We will add a button to our window, when the user click on this button, the application

will be closed.

We will set the checkbox Comman status to be True (ON) and we will type the command

function to be master.quit

Using the form designer we will set the position of the label and the button. we will set

the label color and the button color and backcolor

The next figure presents the final steps tree of our program

We can press CTRL+R to run the program, and we can see the generated source code in

the file Lesson2.py

The next figure is a screen shot for the application during the runtime.

The next figure is a screen shot for the generated source code (Lesson2.py) opened using

Python IDE

Points of Interest

We learned how to see the generated source code (written in Python) behind the program

or behind one step, you will notice that when you see the generated code behind a step

that the generated code is read only (you can't modify it). this is just be cause the Syntax

Directed Editor is ON, if you want to modify the generated code just set the Syntax

Direct Editor OFF and you can do that but this is not a good practice unless you want to

do quick somthing for test.

When you create a step as comment, you can (if you want) add a block of code behind

this step.

The advantage from using PWCT environment is Productivity and Customization, you

can work faster using the keyboard shorutcuts and you can use the mouse to explore the

environment when you forget somthing, and you can use customization to set the

environment options that let you be more productive.

In this section of our article i will talk about some of PWCT features that let you

customize the environment

[1] You can change the component name

To change a component name, from the menubar select "Domain Tree" then "Reinstall

component"

You will get the next window

from the "Reinstall component" window, you can select any component and change the

component name in the domain tree.

Using this feature you can rename components names then you can quickly find these

components using the components browser by typing the component name in the search

line.

[2] You can change the generated steps names and the generated source code

When you reinstall a component, you can open this component by clicking on the button

"Open"

This will move you to the transporter designer window. inside this window the

component is created and can be modifed

From the transporter designer, you will see the interaction pages that are used by the

component

You can open the interaction page using the interaction designer, you can modify the

data-entry forms

You can set the default values, resize controls and set colors

Using the transporter designer, in the Code Mask section, you can modify the script that

controls the steps generation process and the code generation process

PWCT environment contains a scripting language (domain-specific) for writing the code

mask script. this language contains simple commands that can be use to control the

process of generating steps and code.

[3] You can select steps colors, Show/Hide steps based on what you are doing

From the goal designer window, you can click on the Steps Colors button to get a

window to select the steps colors

An important feature in this window is that you can hide some steps based on the step

type, for example you can hide steps of type Generated (Leaf), you can do this by

selecting "Read Mode" from the styles or by setting the font color as the back color to the

White color.

Doing this with PythonPWCT will hide steps like (End of IF Statement) and (End of For

Loop)

When we apply this feature to the first application created in this article, we will get the

next steps tree

[4] The Time Dimension

One of the advantages of PWCT environment is that you can use the time dimension. In

the Goal Designer environment you have the time slider where you can move along the

application constuction process, move to a point in the past then you can run the program

at this point

Also you can play the program as movie (step by step) to learn how to create the

program.

During playing the program as movie you can ask PWCT to document the program, this

way the documentation of PWCT samples is generated and avaiable online

(documentation is written by PWCT).

For more information about this point, you can read this article

History

PWCT started as a research project in Dec. 2005, the first version released in 2008, the

latest release released in 2013. Unlike many visual programming languages that are

developed for novice programmers, PWCT is designed for novice and expert programmer

who is looking for productivity and customization.

As any programming tool you need to try PWCT then decide for yourself if it is useful or

not. I hope that some Python programmers will find that PythonPWCT is useful for them

and they will like this article as an introduction to PythonPWCT.