VPL Patterns – Add Diagrams
Young Joon Kimhttp://www.helloapps.com
VPL Beginner Course – 01
2
Topics
• Create Button form
• Add new diagrams
• Separate logic
3
Scenario for target samples
4
Scenario for target sample
• Build simple calculator
Input user’s choice
(“Add”, “Subtract”, “Multiply”, “Divide”)
Add & Subtract diagram
Display result
Multiply & Divide diagram
Display result
5
Create Button form
6
Create Button form
• Add “Data” activity and “HelloApps (Util) Button Dialog”
service
7
Create Button form
• Set “Data”
• Connect “Data” and “ButtonDialog”
8
Create Button form
• Set “Connections” and “Data Connections”
9
Create Button form
• Connected result
10
Create Button form
• Save and run a diagram
11
Create Button form
• Add “Data” and “ButtonDialog” as follows
12
Create Button form
• Set second “Data” activity as below
13
Create Button form
• Select “AddButtonVertical”
14
• Connected result
Create Button form
15
Create Button form
• Save and run a diagram
16
Create Button form
• Repeat for the “Multiply” and “Divide”
17
Create Button form
• Save and run a diagram
18
Add new diagrams
19
Add new diagrams
• Click “Add Diagram” submenu under the File menu
20
Add new diagrams
• Add another diagram again
21
Separate logic
22
Separate logic
• Click “Diagram0”
• Add activities and services as follows
23
Separate logic
• Connect the notification point of “ButtonDialog” to the input
of “If”
24
Separate logic
• Choose “NotifyButtonClicked”
25
Separate logic
• Set “If” as follows
26
Separate logic
• Set “Data” activities as follows
27
Separate logic
• Connect “Data” activity and “SimpleDialog”
28
Separate logic
• Choose “AlertDialog” from the list
29
Separate logic
• Diagram0
30
Separate logic
• Click “Diagram1”
• Add activities and services as follows
31
Separate logic
• Set diagram as follows
32
Separate logic
• Completed diagram
33
Separate logic
• Save and run a diagram