Creating Templates and Navigation for our HMI in Siemens TIA Portal WinCC!

welcome back everybody in today's video we're going to be having a look at navigation and creating templates with our project from last week before we get started what i'd like you to do is give the video a like comment below and let me know that you're watching and if you're watching us on youtube hit the subscribe button if you're watching us on facebook give us a like so you stay up to date with more new videos right let's get started so what we have here is our hmi project from last week and on our hmi project from last week we had two push buttons controlling two lamps input one and input two when input one turned on this lamp here would turn from red to green and the same with input two when this input turns on this lamp here would turn from red to green what i want to do however is i want to create some formality between all of my screens that i'm going to be creating next and to do this we create what we call a template and then what we can do with this template is we can assign it to any screen and that screen will then have whatever that template has on it so for example if we put time and date up into the top left corner every screen that uses our template will then have the time and date in the top left corner so to create a template all we do is we go to screen management and inside the screen management is templates and then all we do from here is we just double click add new template now here is my template you can see i've already got one created here what i'm going to do is just delete this there we go now you can see here it's called template two so what i'm gonna do here is i'm gonna right click this rename this and then just backspace out the two and put this back to just template okay now inside of this template you can see here that the background screen here is slightly darker than what my home screen was so to change this if we go to properties and then we just go to the properties of the screen we then change the background color and what we'll do is we'll change it to this sort of light gray color remember keeping it neutral so it's easy on the eyes and then what we want to do is we then want to add something to this screen and what i want to add is i want our date and time because i want the date and time to show on every screen so to do this all we do is we open up the elements from our toolbox and then inside of our elements is our date and time function here it looks like the calendar with a clock if i just click this and then i insert this onto my screen there it is there and what i can then do is i can drag this anywhere i want on the screen and i'm going to just drag it up into the top left corner here and then what i'm going to do is i'm going to right click this and go to its properties now inside of the properties we can then change the color so we can then change the color of the background the fill pattern and the text as well as any border as well because you can see on this actual date and time here you got this black border around it so if i click on this and i change the color from black and i change it to red my border now changes to red now what i want to do is i'm just going to remove the actual border so we don't have any border all it is now is just the actual date and time and then what i can do as well is i can also change the date and time to then match the background of my hmi so now it looks like the date and time is just on the actual hmi itself you haven't got lid sort of like boxy border around it and then what we can do with this is i can actually change the actual format of the date and time itself how it actually appears inside of the program so first of all it's saying here you use the actual system time which is going to be pulled up from the hmi or from the plc and then here we've also got the show date and show time function if i uncheck show date no longer shows the date and if i uncheck show time it no longer shows the time pretty standard and the type here you've got output and input output we're going to leave this as output what this means is that when the actual data is being displayed it is only being displayed the operator can't alter anything if we change this to input output this means that the operator can actually interact with this date and time and it can change things within this date and time next what we can do is then go to text format and we can actually change how the text is being displayed so you can see currently inside of the text format it's to homer nine point style bold now if i ever wanted to change this i'll just click on the three dots and then inside of here i can change the actual font style from here so i might want to say well change this to normal i don't want to make it bold anymore and i want it to be a size 15 and then say okay to that and there's my date and time now what i'm going to do is i'm going to put it back to the way it was bold and i want to make it size 11 so it stands out a little bit more and there we go there so now it's showing the date and time and it's now showing it inside of the top left hand corner what i can also do is i can add in other buttons that i might want to use for other things so for example one of the most common features on plc's is alarms and what we usually do when an alarm turns on is we latch that alarm on inside of the plc when the alarm input turns off the operator then has to reset the alarms and we usually do that via a push button or via a button on the hmi and what we could do here is we could create a fault reset push button and then tie that to the actual reset of the alarm latch and we could have down every screen so if there is an alarm and the alarm gets cleared the operator can then reset that alarm from any screen and all we would do is we'll just place a button on this template all i'm going to do however is just leave this template as it is now you'll notice i'm not putting in any sort of screen titles sometimes you might have a title on the screen to let the operator know whereabouts on the hmi is i'm not putting the screen title on this template however because if i put it on the template that is going to show on every screen and on every screen there's going to be a different title i'm gonna do that on the actual screens themselves so now that i've actually created my template and i've added this date and timing over here if i go to my home screen you'll notice that my home screen hasn't updated and that's because it's currently not using the template so for me to use a template if i go to the properties and then expand the three dots you'll then see my template inside of here and if i tick that now it updates and you'll notice the actual date and time doesn't look as clear as it does on the template it looks slightly faded that's just there to tell you that that's part of the template and it's not part of this screen now what i want to do is i want to create two more screens i want to create one screen for the control one screen for my alarms and the home screen is simply gonna have the navigation to bounce between the control screen the alarm screen and go back to the home screen etc so to do this i'm just then gonna select add new screen if i select add new screen it then pops up here screen one i'm gonna right click this reading the screen control and then i'm gonna create a new screen and then i'm gonna right click this screen and rename this alarms there we go now if i just go back to the home screen i'm going to take these two push buttons and lamps i'm going to copy them from the hmi and i'm going to paste them onto the control screen so if i go to the control screen now what i can then do is right click paste and then if i go to the properties of the control screen here i can change the template for this control screen to be template and then there it is there change the background to be the lightish gray minimize that and then if i go to my alarm screen again go to the properties here template is my normal template and the background is my lightish gray now you'll also notice i had to change the background even though my template is a light grey anyways this is because inside of our global screen if i just double click this the global screen is a dark gray this means that every screen that i add is then going to have this dark grey format now what i might want to do is i might well say well hang on let's add in this light gray and now whenever i add a new screen it's going to use this light grey feature here let's go back to the control what i'm going to do is just move these down a tiny bit and i'm then going to add in a title and this title is just going to tell me that this is the control screen there we go and if i just go to the properties here what i'm going to do is i'm going to change the actual color of this inside of the appearance and i want to change the color of the text to a black and i then want to go to general and then change the actual size of this to size 15 there we go and i'm just going to move this into the center of the screen there we go my control screen is then set up if i then copy that and then go to the alarm screen i can then paste that into the alarm screen and then it's going to paste it at the exact same position and i want to change this to alarms like so now if i go back to the home screen i'm then going to delete these two inputs and the actual lamps and then from here what i'm going to do is i'm going to create some navigation and to create the navigation i'm simply going to add in some buttons to my hmi and in this button here i'm going to call this control and then i'm going to add another button in for alarms like that and i'm just going to put them into the center of the screen somewhat there we go so what's going to happen is when operate uh first of all powers on the machine it's gonna go to the home screen and then it's gonna ask them where do they want to go within the home screen do they want to go at the control screen or do they want to go to the alarm screen we're gonna create the alarms later on all we do here is we just go to the control go to properties go to events and then say on the press i then want to add a function where i activate a screen and then the screen that i want to activate is going to be my control screen so when the operator presses this button here it's then going to activate the control screen now if i go to my alarms and i go to events go to press what i'm then going to do is scroll down until i see screens there we go activate screen and then inside of here i'm then just going to select my alarm screen take that close that box down there so now when the operator presses control it's going to take him to the control screen he presses alarms it's going to take him to the alarm screen the problem is how does he get back to the home screen well what we can then do is then we can create buttons on the alarm screen and the control screen to take them back to home so if i now open up my alarm screen i can then add another button into here and i want to just call this home move it to the bottom left because you're gonna actually have the alarms interface in the middle of the screen so bottom left is where my button is going to go if i then go to the properties if i then select press drop this down open up my screen activate screen and then take him back to home take that there we go if i then just copy that and then i go to control and then i just paste this into here it's gonna paste it in the exact same position and then that will now have the properties of the previous button which is to take me back to home now this control in this alarm screen the actual screen color is slightly different so all i'm going to do is just go to my home screen and then change this to this color here the slightly darker color and then i'm just going to save the project and now i'm going to test it out to make sure that my navigation and my templates now work so i'm just going to open up the simulator start simulation it's going to start a simulation with the home screen which is fine say okay to that and here we go so we're now on the home screen we've got buttons to go to the control we've got buttons to go to the alarm if i press ctrl it then takes me to my control screen if i press input 1 it turns on the first lamp if i press input 2 it turns on the second lamp if i press the home screen it takes me back to home and now if i press the alarm screen it takes me to my alarms i can go back to home from there as well and you can see at the top there's my time and date and that there is available on every single screen and that there is simply just a short introduction to creating navigation using buttons to be able to move from one screen to another as well as creating templates inside the project to create some uniformity within all of the screen so i hope you enjoyed this brief introduction to creating navigation and creating templates i look forward to seeing you on the next video enjoy your week

Channel: Scantime Automation & Training

Views: 12,133

Keywords: scantime, plc, hmi, scada, wincc, tia portal, step7 professional, siemens, programming, templates, navigation

Id: zrVAq7a8aU0

Length: 13min 16sec (796 seconds)

Published: Fri Aug 14 2020