In this video we’ll build a simple app that we can use in the rest of the videos.
If you are already familiar with creating an HMI Screen using Point of View, you really
only need the first 2 minutes of this video where we show how to setup a project for remote
access.
Let’s create a Point of View application something like this where we can resize the
window, click on a button to change the color of this circle, do a screen change to take
us to a screen that displays the current time, a screen change to get us back and an exit
button.
Not very elegant, but it will serve us just fine.
Let’s do it.
Launch Point of View.
Click on the Point of View button, NEW, Project and give it a name.
We’ll call ours Demo_Project.
Pick a location to store the project.
The default will be under your accounts documents folder, but to keep things simple for this
project let’s save it on the C drive under a POV folder I created earlier.
The reason for that is we will be coming back here and I don’t want to have to do a lot
of folder navigation to find it.
Putting it on the C drive will make it a lot easier to work with.
Select the product you want here – looks like I have two options here, so I’ll pick
the smaller one since we’ll only have one tag in this demo.
You can always change this later under the project tab.
Let’s change the display size to something smaller so it will be easy for us to see on
this video.
Be careful here … make sure you choose the size you really need because it’s difficult
to change it later.
Normally you would set this to the screen resolution of the PC that this app will be
running on.
We want to configure the projects client server relationship.
So on the project Tab, click WEB.
Since we’ll be doing local loop back first, we simply put that loopback address here 127.0.0.1.
And for this project, let’s enable tool tips and file compression.
Click on the advanced button and make sure the web tunneling gateway enabled box is NOT
checked.
Under the IP Security Button, make sure the Enable box is NOT checked.
We’re done with that one.
Under the HOME tab, local management section of the ribbon bar, click on TASKS.
Make sure TCP/IP Server Runtime is set to automatic.
If not, click on the Startup Button and change it.
We’re done with that one.
Now we just create a screen by right clicking screens and selecting insert.
Let’s call this the main screen.
Right click and change the background color to light blue.
We’ll need an exit button so make sure you are on the graphics tab of the project explorer,
double click on symbols, double click on buttons, select the exit button and click to drop it
in the upper right corner of the screen.
We need a circle we can change the color of so under the graphics tab, click on ellipse,
then draw a circle in the middle of the screen.
You can move and re-size it if you want to.
The circle doesn’t do anything by itself, so we’ll apply a color change dynamic to
it by clicking on this guy and then clicking on the circle.
Double click on the circle and give it a tag that will change the color.
How about Color_Change?
When we click away Point of View reminds us that tag hasn’t been created yet and asks
us if we want to create it.
We do, and let’s make that a boolean and we want the scope to be server.
This is really important – if you choose local here the tag won’t be visible to the
client.
So make sure this says SERVER and hit OK.
We can change the colors, blinking, etc, but for now this is fine.
To add a button to change that color, under the graphics tab, click on button then drag
mouse to draw the button.
Double click on that to change the text to Change Color.
Now click on the command button to tell it what you want it to do.
We’ll choose on button press, we want to toggle the Boolean we just created setup so
we select that.
Great.
Let’s test what we have so far.
Right click this tab and Save this screen as Main and close the screen.
You always want to close screens before hitting the run button because open screens can confuse
the local viewer.
Speaking of the local viewer, let’s set that up before we hit RUN.
On the project tab, click Viewer.
Add a title bar so we can grab the window and move it around, add the usual control
boxes, make the window resizable and we DON’T want to start with the window maximized.
Right click on the Main Screen and tell Point of view that it should start on this screen.
Now we can click on RUN and see what we have so far.
The changes we just made to the viewer allow us to move the window around and re-size it.
That will be especially handy when we need to view this AND the remote screen at the
same time.
And sure enough the button changes the color of the circle.
Perfect.
Note that pressing the EXIT button kills the project.
If however you click on the red x to close the window, the process will still be running
– you can tell because the run button is still highlighted.
You’ll need to stop it by clicking the stop button.
Let’s create a screen change button.
Graphics tab, button, click and drag.
Double click to change the text to “Time” because on that screen we are going to show
the current time.
Normally we would click on the command button and tell it to go to that screen, but we haven’t
created that screen yet, so let’s hold off on that for now.
Right click on screen and insert a new screen.
We’ll call this one Time.
We’ll put the time in a simple text box.
Double click on that and let’s go grab the system time which is under System, String,
Time.
Let’s make the text BIG.
And we need a way to get back to the Main Screen so under the graphics tab, grab a button.
Double click on that and change the Text to MAIN.
Click on Command.
On button press, we want to open the main screen.
Right click this tab to save the Time Screen.
Go back to the Main Screen and double click the Time screen change button.
Click on command and on button press, we want to open the Time Screen.
Click on the Point of View button and save all.
Close all the screens.
Right click on the Main Screen and select it as the startup screen.
Hit RUN.
And sure enough we can change the color of the circle, switch to the time screen, and
switch back to the main screen ad exit.
Perfect.
Well, that’s all great, but we are viewing it locally on the development PC, we really
want to view this remotely from Internet Explorer.
Check out the next video to learn how to do that!
If you have any questions, please don’t hesitate to call AutomationDirect’s free
award winning tech support during regular business hours.
They will be happy to help you.
And don’t forget the forums – there are lots of folks there that love to share their
years of experience.
Just don’t post any support questions there – AutomationDirect’s support staff doesn’t
monitor the forums on a regular basis.