Clicking on each of these screen change buttons sends the user to a different screen in the
project.
This gives the user an intuitive and easy way to navigate between the different screens
of a project.
Note that as we change to a different screen, the control window highlights the screen we
are on – that’s a handy way to keep track of where you are.
In addition to changing screens, this example uses several tricks that will make your life
easier, so let’s see how to set all of this up.
First we need to create some screens – we already have 4 setup labeled HOME, ALARMS,
TOOLS and FANS – lets add a 5th.
Click the new screen button – we’ll call this one STATS - change the color to orange
– and note that the screen numbers don’t have to be sequential, we’re allowed up
to 999 screens, so just for the heck of it, let’s give this one number 999.
Lets add a text label on the screen too –we’ll just copy one from the Fans screen – copy,
paste and just change the name.
Ok, Now that that we have 5 screens we want to navigate between, we need to create another
screen that we can put our navigation buttons on.
Let’s call this our MENU screen – and let’s give it another random screen number,
again just to highlight the fact that these screens don’t have to be in any kind of
sequential order.
We are going to setup all of the screen navigation buttons on this one screen, then tell the
other screens to use this screen as a background screen.
That way we only have to setup the menu buttons once.
Double click or drag a screen change button onto the screen -, we’ll have this one go
to the HOME screen – which you can choose by screen number OR by screen name – we’ll
change the title to HOME just so we can recognize it… and we are all set.
Ok, we have the HOME button where we want it.
Now we’re going to copy the HOME button and paste it 4 times to fill up the bottom
row of the screen.
Now we’ll just edit each one and change its purpose.
Let’s have this second one go to this stats screen.
Let’s also change its title.
Let’s have the third one go to the FANS screen.
And change hi title.
Let’s have the 4th one go to the TOOSL Screen, Change his title.
And the last one will be our alarms.
We don’t care what these look like, because we are going to cover them up with graphics.
So lets go grab a bitmap – we need the alarm clock for the alarms.
Then we just take that alarm clock and place it on top of the screen change button.
Now we have what appears to be a graphical button but we know it is really just a screen
change button.
I’m going to take a copy of this alarm clock and paste it on top of each of these screen
change buttons.
Now I’m going to change each of these graphics to match their function.
This will be our tools graphic.
So let’s go find something that looks like a tools graphic.
Let’s change this one to a FAN graphic.
Change this one to a STATS graphic – maybe a little bar graph.
And change this one to a Home Graphic.
And then we just move those to cover up our screen change buttons.
That’s it – we now have a fully functional menu of screen change buttons.
We could copy and paste all of these buttons on every screen in the project – but that
is the hard way and makes the project VERY difficult to maintain, especially when you
start to getting hundreds of screen you have to keep up with.
There is a MUCH easier way to do this.
We’ll simply use this screen as a background screen for all the other screens.
You just select the other screen, say you want to use a background, pick our menu screen
as the background, and now that screen gets to take advantage of all the menu buttons
on the background screen.
Let’s do that for all of our screens.
Enable the background feature .. Choose the background screen, enable the feature, choose
the menu screen, Now every screen in the project has the exact
same set of menu keys, but we only have to change one set of menu keys for them to work
on all of the screens in the project.
Lets try it – simulate, save the project, and up pops our simulator with all of our
navigation buttons.
I’m on the home screen, if I want to go to the STATS screen, I just hit the STATS
button and it takes me right to the STATS screen.
Fans, Tools Alarms.
So this one set of menu buttons on the one screen, now works for every screen in the
project.
So using screen change buttons on a dedicated background screen with simple bitmaps covering
the screen change buttons is an easy maintainable way to give the user a simple friendly intuitive
way to navigate the project.
So, Check out the Video on How to Use a Background Screens for more information on how to do
that.
Also check out the video on How To Control Screens From A PLC if you would like for the
PLC to control which screen is displayed.
And one last thing we need to point out … On a screen change button, you have the option
to go to the Power Up Screen – that’s the default screen the panel goes to on power
up – OR you can have a screen change button go forward to the next screen or to the previous
screen.
This is a little bit confusing, so let’s review that for a second.
The next and previous screens functions here in the dialog don’t take you to the next
or previous screen in the project – instead they walk you through the history of where
you have been.
The C-More Micro keeps track of every screen you have visited.
The previous button walks you backwards through that history, the next button walks you forward
through that history up to the most recent screen you have visited.
So be careful when using those options.
That’s it for this video – be sure to check out the other videos in this series.
And as always, please send us any topics you would like to see covered – or - any other
comments for that matter – we appreciate the feedback!