Short manual showing how to code in the Vizwik visual programming language.

1. Vizwik Coding Manual
Learn Create Share

2. Vizwik is a tool that helps anyone create
mobile apps. Many apps can be created
without coding, but to get the full benefit of
Vizwik, coding is the best choice.
This manual documents the coding design
in Vizwik. You are not required to have any
previous knowledge of coding to learn.
Introduction

3. Structure of an App in Vizwik
DB
FB
How it looks What it does What it stores
View Script Data
App
Web
tap
get/set

4. The Vizwik programming language is a visual data flow
language that connects operations (boxes) with links
(lines) which are connected from outputs (circles) to
inputs (triangle).
Vizwik code is Visual Data Flow
0 to N Inputs
0 to N
Outputs
Operation
Link
name

5. Operations process data that flows through the links
from output to input. Operations execute once all its
inputs have a value.
Operation Execution
4 3
7

6. Scripts
0 to many
Inputs
0 or 1
Outputs
Reference
Name
The basic package of code in Vizwik is a Script which
contains operators. Scripts can be given names, and
can call each other. They have any number of inputs,
but only none or 1 output.

7. Operator Shape
Operator shapes allow you to identify their behavior
Operators with solid bars
are library calls.
Operators with arrows are
setters and getters of
values for data
Operators with a single
bar is a constant that
outputs a value

8. 1. Boolean: True | False
2. Number: 125 , 12.34
3. Text: This is some text
4. List: (,,,)
5. Object: { name : value, ... }
Basic Data Types
Vizwik supports 5 basic types of data.

9. Boolean
A boolean value can have only one of two values, either
true or false. Boolean values are useful for testing and
controlling a script.
operator that outputs
a boolean
Values for true and
false

10. Number Data Type
Numbers can be either whole, or have decimal values.
The Math Lib provides operators to work with numbers.
Whole Decimal

11. Text Data Type
Text is a collection of characters and numbers. The
Text Lib contains operators to work with text.

12. List Data Type & Syntax
A list is a collection of any basic data type between
braces () and separated by commas:
(a,Bob,E1A 5Y6) <- list of Text
(1,2,3) <- list of numbers
(true,false,true) <- list of boolean
(a,3,false,Bob,5) <- list of 3 basic data types
((1,2),(a,b),(1,3hb)) <- list of lists
(a,(1,2,a),2.35) <- list of numbers and list
(a,(b,(1,2))) <- list of text & list of text & list
() <- empty list

13. List Data Type
The List lib provides opers to work with lists.
Empty List

14. Object Data Type
Objects are collections of Properties that are named
value pairs.
object
name : value
property
name : value
age : 2
Object with 1 property
Example:
age : 2
Object with 2 properties
tag : Vizwik

15. Object Syntax
Object syntax in a value is defined in curly brackets {}.
Each property is a named value separated by a comma.
{} - empty object
{ ‘age’ : 2 } - object with property “age” with value 2
{ ‘name’ : ‘Vizwik’ } - object with property ‘name’ with value ‘Vizwik’
{ ‘name : ‘Vizwik’, ‘age’ : 2 } - object with 2 properties
Get a property from an object: prints Vizwik Set a property of an object: prints object

16. Object Data Type
Objects are collections of Properties defined in curly
brackets {}. Each property is a named value. The Object
Lib provides operations to work with objects
Creates empty object
Object properties can be
created at run-time
Object properties can also
be set and get based on the
name in the oper

17. Create an Operation
To create a library operator drag it from the Parts Panel
into your script.

18. Create an Operation in Script
Operations can also be directly created in a script by
double-clicking the script background and selecting
Library, then type the name of the operation to create.
1. double-click 3. Type name
2. Select

19. 1. Blocks
2. Conditional Block
3. List Loop Block
4. Number Loop Block
5. Call and Return
Control Flow
An app will eventually need to choose between two
different values to proceed, which is called Control
Flow. In Vizwik this is performed with the following:

20. Blocks
Blocks control groups of operations by defining the order
they execute.

21. Blocks
Blocks can have inputs and outputs that pass data in and
out of the block to its operations.

22. Blocks
Blocks can contain and control other blocks nested to
any depth.

23. Blocks
Sequential
Blocks
Blocks can be connected together with links to define
sequential ordering of operations.

24. Conditional Block
Match
A block can be used to conditionally execute operations
based on the value of an input passed to a Match operation.

25. Conditional Block
2nd of 2 cases1st of 2 cases
Navigate
between
cases
A conditional block contains 1 or more Cases, or sub-blocks
of operations, in a block. If the value of a match is the same
as its input, the Case executes, else execute the next case.
Execute this first Case
if Match is true
Else execute the
second Case

26. List Loop Block
Loop Input
List of numbers
A List Loop Block will execute its operations for each
element in the list provided on its first input (...).

27. List Loop Block
Looped Value
Inputs can be Looped into pairs that pass the value of
the output back to the input on the next loop iteration.

28. Numeric Loop Block
A block can be executed a number of times based on the
count value on the first input. The Match defines the End
test value.
Count
End Test

29. Numeric Loop Block
A numeric loop can either increment (+) or decrement (-) the
Count based on the icon of the Count output. This can be
changed by a single click in the output icon.
Loop Decrement
(-)
Increment (+)

30. Calling a Script
Calling
Script
Calls Script
A script can call another script with the Call operator which
is set to the name of the called script. The inputs to the Call
are passed to the called script as inputs.

31. Normal Return
Normal Return
A call to a script is followed by a return in which the called
script’s outputs are provided to the Call operator.

32. Return Operator
Return Operator
A script can also return from any block using the Return
operator whose input is the value passed back to the Call
operator. This allows the script to return before it completes.

33. Global Values
Values that need to exist between scripts can be stored in
Global values using the Global Set and Get operators. A
value for a Global must first be set before it can be get.

34. Expression Operator
To simplify the use of math expressions use the Expression
Operator. Type the expression in the label and names will
automatically appear as inputs in the order they appear in
the expression. Only a single output is provided.
Supported Functions:
Math: *-/+
Modulo: %
Power: ^
sin(),cos(),tan()
sqrt()
exp()
abs()
min()
max()
floor()
ceil()
random()
log()
PI
E

35. Code Example: Hello World
Hello World is the simplest example of a program in Vizwik.
The Print operation outputs a value the Simulator console.

36. Code Example: Math
Add two numbers, 4 and 3, then divide by 4 and print the
square root of the result...

37. Code Example: List
Create an empty list, add numbers 3 and 45 to the list, then
concatenate another list (1,2,3) to the first list and print out
the new list sorted and it’s length...

38. Code Example: Object
Create a new object, add properties for first and last name,
age, and print out the first name...

39. Code Example: Blocks
Print a first and last name of an object, making sure the first
name is printed first.
This approach is
incorrect since
last_name may be
printed before first
name because
nothing prevents
the lower print to
execute first.
Here the blocks
define a strict
ordering of the
print operations
making sure
the first_name
is printed
before the
second_name
incorrect correct

40. Code Example: List Loop
Sum the elements of a list for only types that are of number
and print the result.

41. Code Example: Numeric Loop
Print a list of all the even numbers between 0 and 100...

42. Code Example: Call & Return
Call a script that divides 100 by a number provided, and
returns an error if the number is zero.

43. Code Example: Factorial
Write a script that calculates the factorial function n! For
example, 6! = 6x5x4x3x2x1 = 720
If the input
to the
function is
0, we return
the value 1
Else, we call
the Factorial
script
recursively
with n-1, and
multiply the
returned value
with the input
value until we
return from the
script to return
the answer.

44. Code Example: Quicksort
Use the quicksort algorithm to sort a list…
First, we partition a list into two lists whose values are larger or smaller than an
input value.
Case 1:2 Case 2:2

45. Code Example: Quicksort
Use the quicksort algorithm to sort a list…
Second, we grab the pivot from the head of the input list and partition the list into
two smaller lists and recursively sort these by calling quicksort, followed by
collecting their outputs, and merging back into the sorted list...
If the length
of the input
list is zero,
return a new
empty list.
Else, sort the
list

46. Vizwik Support
Web: www.vizwik.com
Mobile: m.vizwik.com
Blog: blog.vizwik.com
SlideShare: www.slideshare.net/agoramobile
Facebook: www.facebook.com/vizwik
Twitter: www.twitter.com/agoramobile
YouTube: www.youtube.com/user/vizwik
Email: info@vizwik.com