What we want to build – logic:
A house control where two rooms have a temperature regulator in them.
What we want to build – visual:
1. A view that shows a floor plan of a house, with a temperature regulator in two of the rooms.
2. The actual temperature should be visible in the overview picture.
3. When we press on the temperature regulator icon, a window opens that shows the setpoint (editable) and the actual temperature (read-only). We will also show the name of the (instance of the) assembly.
This will be the window that opens, so all we need to build is the "button" that opens this window.
The diagram below shows what you will build in this tutorial. The red dots show tutorial steps.
Working with views
You can create views for:
– You can add drawings (in SVG-format) as we will do later in this tutorial.
– You can also add labels – that you can use to show "fixed text" information.
Rules of thumb:
You can only visualize what the component or assembly has access to, so as a rule of thumb you create:
Step 1: Create the button
Creating a view for the button
1. Open the assembly.
3. Rename to "button_for_XX_Temperature_regulator_notification_assembly".
4. Set view region – bottom right to y=50[mm] and x=50[mm]
5. Right-click on the view list and add drawing PD_17418- Temperature_Regulator
b. Press on temperature- actual rec – value (which represent actual temperature).
c. Select view type PD_2159- Number_name_value_unit.
a. Right-click on view list.
c. Double-click on "XX_temperature_regulator_notification".
d. Select PD_2292 – Name.
Configure your button
Now you need to indicate which window to open when you press the button. And here we will reuse the view we made in tutorial 4.
b. Select: PD_16706 – Open_view_in_new_window.
a. Right-click on the Open Info.
d. Select "Window_for_XX_Temperature_Regulator_notification_assembly".
3. The last thing you need to do is to make sure the window opens, no matter where the user clicks on the button.
What your code should look like:
Now all mouse clicks or screen taps will go to the "open view in new window".
Step 2: Add a new instance of your temperature assembly
We need two instances of the temperature regulator. We want to display their names, so you need to update the existing main assembly.
1. Open your main assembly from tutorial 4, ie. XX_Temperature_regulator_notification_main.
b. Rename it to "Dining room".
4. Locate the new control components on PD 850.
5.On your testbed, connect a temperature regulator to 11/31 and a DC output to 2/22.
Here we see one of the powerful features in VIGO6. We have built a complex functionality (the temperature regulator assembly) once, and we could reuse instances of it easily. Simply by adding a new instance to our assembly (and eventually wiring up any I/O).
Step 3: Build the main view
We are now ready to build our main view using the building blocks we just created.
2. Rename to "XX_Main_view_with_house_and_regulators".
3. Set view region bottom right y=200[mm] and x= 300[mm].
4. Right-click on view list and add:
a. Drawing: PD_17425 Plan_Drawing_Tutorial. Set the scale factor to 1.8.
Save the view and launch the graphic editor. Now drag the elements around to find suitable rooms for your icons/buttons.
Your view should look something like this:
Step 4: Build and run your project
3. Save, build and run your project on the testbed.
Make sure to click on the regulator buttons to see your windows open and test your two regulator instances via the testbed.