Vizwik Coding Manual
Learn Create Share
Vizwik is a tool that helps anyone create
mobile apps. Many apps can be created
without coding, but to get the full benefi...
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
The Vizwik programming language is a visual data flow
language that connects operations (boxes) with links
(lines) which a...
Operations process data that flows through the links
from output to input. Operations execute once all its
inputs have a v...
Scripts
0 to many
Inputs
0 or 1
Outputs
Reference
Name
The basic package of code in Vizwik is a Script which
contains oper...
Operator Shape
Operator shapes allow you to identify their behavior
Operators with solid bars
are library calls.
Operators...
1. Boolean: True | False
2. Number: 125 , 12.34
3. Text: This is some text
4. List: (,,,)
5. Object: { name : value, ... }...
Boolean
A boolean value can have only one of two values, either
true or false. Boolean values are useful for testing and
c...
Number Data Type
Numbers can be either whole, or have decimal values.
The Math Lib provides operators to work with numbers...
Text Data Type
Text is a collection of characters and numbers. The
Text Lib contains operators to work with text.
List Data Type & Syntax
A list is a collection of any basic data type between
braces () and separated by commas:
(a,Bob,E1...
List Data Type
The List lib provides opers to work with lists.
Empty List
Object Data Type
Objects are collections of Properties that are named
value pairs.
object
name : value
property
name : val...
Object Syntax
Object syntax in a value is defined in curly brackets {}.
Each property is a named value separated by a comm...
Object Data Type
Objects are collections of Properties defined in curly
brackets {}. Each property is a named value. The O...
Create an Operation
To create a library operator drag it from the Parts Panel
into your script.
Create an Operation in Script
Operations can also be directly created in a script by
double-clicking the script background...
1. Blocks
2. Conditional Block
3. List Loop Block
4. Number Loop Block
5. Call and Return
Control Flow
An app will eventua...
Blocks
Blocks control groups of operations by defining the order
they execute.
Blocks
Blocks can have inputs and outputs that pass data in and
out of the block to its operations.
Blocks
Blocks can contain and control other blocks nested to
any depth.
Blocks
Sequential
Blocks
Blocks can be connected together with links to define
sequential ordering of operations.
Conditional Block
Match
A block can be used to conditionally execute operations
based on the value of an input passed to a...
Conditional Block
2nd of 2 cases1st of 2 cases
Navigate
between
cases
A conditional block contains 1 or more Cases, or sub...
List Loop Block
Loop Input
List of numbers
A List Loop Block will execute its operations for each
element in the list prov...
List Loop Block
Looped Value
Inputs can be Looped into pairs that pass the value of
the output back to the input on the ne...
Numeric Loop Block
A block can be executed a number of times based on the
count value on the first input. The Match define...
Numeric Loop Block
A numeric loop can either increment (+) or decrement (-) the
Count based on the icon of the Count outpu...
Calling a Script
Calling
Script
Calls Script
A script can call another script with the Call operator which
is set to the n...
Normal Return
Normal Return
A call to a script is followed by a return in which the called
script’s outputs are provided t...
Return Operator
Return Operator
A script can also return from any block using the Return
operator whose input is the value...
Global Values
Values that need to exist between scripts can be stored in
Global values using the Global Set and Get operat...
Expression Operator
To simplify the use of math expressions use the Expression
Operator. Type the expression in the label ...
Code Example: Hello World
Hello World is the simplest example of a program in Vizwik.
The Print operation outputs a value ...
Code Example: Math
Add two numbers, 4 and 3, then divide by 4 and print the
square root of the result...
Code Example: List
Create an empty list, add numbers 3 and 45 to the list, then
concatenate another list (1,2,3) to the fi...
Code Example: Object
Create a new object, add properties for first and last name,
age, and print out the first name...
Code Example: Blocks
Print a first and last name of an object, making sure the first
name is printed first.
This approach ...
Code Example: List Loop
Sum the elements of a list for only types that are of number
and print the result.
Code Example: Numeric Loop
Print a list of all the even numbers between 0 and 100...
Code Example: Call & Return
Call a script that divides 100 by a number provided, and
returns an error if the number is zer...
Code Example: Factorial
Write a script that calculates the factorial function n! For
example, 6! = 6x5x4x3x2x1 = 720
If th...
Code Example: Quicksort
Use the quicksort algorithm to sort a list…
First, we partition a list into two lists whose values...
Code Example: Quicksort
Use the quicksort algorithm to sort a list…
Second, we grab the pivot from the head of the input l...
Vizwik Support
Web: www.vizwik.com
Mobile: m.vizwik.com
Blog: blog.vizwik.com
SlideShare: www.slideshare.net/agoramobile
F...
Prochain SlideShare
Chargement dans…5
×

Vizwik Coding Manual

1 182 vues

Publié le

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

Publié dans : Logiciels
1 commentaire
1 j’aime
Statistiques
Remarques
Aucun téléchargement
Vues
Nombre de vues
1 182
Sur SlideShare
0
Issues des intégrations
0
Intégrations
174
Actions
Partages
0
Téléchargements
15
Commentaires
1
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Vizwik Coding Manual

  1. 1. Vizwik Coding Manual Learn Create Share
  2. 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. 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. 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. 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. 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. 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. 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. 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. 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. 11. Text Data Type Text is a collection of characters and numbers. The Text Lib contains operators to work with text.
  12. 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. 13. List Data Type The List lib provides opers to work with lists. Empty List
  14. 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. 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. 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. 17. Create an Operation To create a library operator drag it from the Parts Panel into your script.
  18. 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. 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. 20. Blocks Blocks control groups of operations by defining the order they execute.
  21. 21. Blocks Blocks can have inputs and outputs that pass data in and out of the block to its operations.
  22. 22. Blocks Blocks can contain and control other blocks nested to any depth.
  23. 23. Blocks Sequential Blocks Blocks can be connected together with links to define sequential ordering of operations.
  24. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 36. Code Example: Math Add two numbers, 4 and 3, then divide by 4 and print the square root of the result...
  37. 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. 38. Code Example: Object Create a new object, add properties for first and last name, age, and print out the first name...
  39. 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. 40. Code Example: List Loop Sum the elements of a list for only types that are of number and print the result.
  41. 41. Code Example: Numeric Loop Print a list of all the even numbers between 0 and 100...
  42. 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. 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. 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. 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. 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

×