PowerShell 21: GUI Interfaces - Coding Windows Forms

hello carly soleil here in this video we're going to take a look at graphical user interfaces with powershell or guis graphical user interfaces can make things much easier for your end users for the people who use your scripts and your applications if you can take your code and you know give it a nice menu structure or put it into something with a nice form and graphical interface just makes it easier to use for the average user now we have written menus in the shell we've written menus that display at the command prompt like old dos menus and they can be very useful too but in this particular video we'll explore guise so the first thing we want to look at is a basic windows form okay and i tried to i tried to just use comment text and show the basic parts of creating a form so first we have to add the required csharp.net namespace and classes and that that's with ad type assembly name systemwindows.forms and systemwindowsforms application enable visual styles okay sometime you're going to make use of a graphical windows form component you want to add that to your script um the next thing we have to do is instantiate a form object and remember in the video in classes we talked about how a class is a blueprint and when you build an object from that class you're making an instance of it you're instantiating it or constructing an object so that's what you have to do when you're going to use a windows form you have to build or construct that class of objects so we're using new object just like we would with the class we wrote ourselves and we're constructing a system.windows.forms.form object and for a main is the variable that sort of points to and c plus we'd call it a pointer but it points to that object in memory that we instantiated okay um number three set the size of the form right and this is just how big it is 350 by 350 width by heights same thing notice that we're creating a system drawing point with new object right and it's on it uses the dot operator and it's on the pointer or the variable that we use to point to our windows forms object so it's all you know four main you could call that whatever you want super color fidget or fragilistic you know banana whatever but the point is that's how we're setting the size the dot operator and then to affect the form all the way down it's the same syntax we just use a dot operator all right so we included what we needed to as far as the required classes and name space we built or instantiated the form object we set it size now we're going to set the position of the form and there's several ways to do that um you can use the value center screen if i pass that in here and double quotes and that would just have it appear in the in the middle of the screen or you can set it by x y coordinates if you want to but if you do that you want to set the start position to manual and then set the location okay and i'll put all the source kid i'm going to go through these fairly quickly um but you you know remember you can always pause the video and read over the code or you can rewind it if you need to so i don't think i have to spend a whole lot of time on each subject i think i can go through them quickly and you can pause where you need to also i will put the source code and comment tags that i pin um under each video or in the description tag depends on where i can fit it so you can always copy and paste the source code into ice or into the development environment of your choice and and you know kind of play with the code and see what it does so um so we can kind of skip through these fairly rapidly and then you can pause you know just just sort of do a broader overview and you can pause the video when you need to okay so that's setting the position of the form x and y coordinates um i can set the text you know the top window of the form okay um in this case currently this sparkly unicorn or whatever you want to set it to you know the typically the name of your application um i can set the form's background color and to do that do you remember this remember when a method is static in that video we did on classes we were talking about how you access static member data from a class so you don't have to build an instance of it first well notice that's what we're doing here right up here we had to use new object and we instantiated or built instances of that that was those we i think we covered some pretty good stuff in that classes video because you know you see it all over powershell it gives you when you understand how classes work and when you understand how they function then you see it everywhere in powershell and in net and in c sharp and you know you you see that everywhere that that class type uh structure that that design philosophy so here we're not doing that we're not using a new object we're not instantiating we're not building an object here we're using static member data and so that you know it's just acting as a means of organizing the code there but we're going to set the system color this is just a hex color you know you can you can google any color you want for hex values and i'll also show you so at the end of the video i'll show you some gui tools that can help too but right now i just we just kind of want to focus on the code okay and there's two ways to display the form but when you build a form the last step right in this case number seven the last thing you're going to do it's always going to be called show dialogue on that form that causes that form to launch and display and there's two ways to call show dialogue you can call it with feedback which while you're running the form it'll give you some feedback in the console or you can call it and pipe it to out null in which case it'll give you no feedback we'll look at both ways let's go ahead and launch this all right and so see it creates this form here currently this berkeley unicorn it's the background is black because we made it black um you know the size in this case or the the location it appeared 800 by 300 it's about the middle of the screen and the size is 350 by 350 okay so 350 wide by 350 tall and that's show dialogue um [Music] let me all right and let's just run it one more time right so see this this is the initial location under which it appears okay and see the cancel here can you see the this cancel cancel all right so that's because i clicked on the x to close it that's that's sort of some feedback but if i comment this out and i show and this time i do show dialogue and i pipe it to out null okay so now when i close it see now there's no output there there's no cancel there so this can be useful when you don't want debugging information written to the console when you're running a windows form object something's up to you but i like to give you guys options so these are all the basic parts of a very simple windows form okay so we've gone over creating a simple windows form and before we get into the components that you know the dot net and the c sharp components we can utilize with powershell let's let's stay focused on just the form for now you can actually draw things uh vector graphics and text right on the background of a windows form itself without even adding a text box or a label or buttons or things like that so before we get into all those components while we're still talking about building a simple just just a forum let's look at actually drawing on the background of the form itself with with different functions different things okay now there's two basic things you need to do if you're going to draw on a form first you need to call the create graphics function on the form object itself okay so basically you have a variable that would be set up as a pointer and you would use the name of the form whatever you choose to call it and you would call the create graphics method on the name of that form and so then this points to that it it sort of gives you a pointer to the background of the form and so it lets you use the background of the form as a canvas to paint on using you know in this case whatever you call this and dot the dot operator so you have to do that and that will become clearer in a minute and the second thing you have to do when you program with guise with the graphical user interface you have to get them to what's called event based programming and you add all these components you have a visual form well it's not like programming for the console when you program for the console you control what the end user can do you can keep them in a holding pattern you know with your your ascii menu your awesome ascii dos menus and things you can kind of control the program flow and where they go and what they do um you know kind of like the outer limits you know we control the horizontal we control the vertical when console programming you can do that you can't do that with a graphical user interface with a gui um you know the user is in total control and so what happens is you add these components and they have to listen for events so they sit there and they listen and an event is a trigger it's a certain type of behavior the user clicks a button the user moves the mouse um the user presses the key you know the the some event happens and when that event happens it acts as a trigger and it triggers that event handler and that event handler processes the code well the event handler that you have to override remember we talked about overriding versus overloading in the classes video if you haven't watched that one i recommend you go back and watch that because it will give you such a good understanding of how powershell works and it will give you such a good understanding of how this works with how creating gui for powershell works if you understand how classes work it's like you will see the structure behind all the code and you'll you'll see how it fits together okay so anyway back to our current topic guise we need to override the built-in ad paint method app payment that's called automatically when you display a form it paints that form right on on the user's display and so they see that they see the graphical the user interface to gui well that's the add paint method and there's a built-in default one but if you're going to paint on the background of i almost said an applet this is not java if you're going to paint on the background of a windows form you need to override that built-in ad paint method okay and then you would put code in there that you want to happen to display whatever it is that you're trying to display on the windows form background does that make sense if not it will make sense in a moment when we actually start to work with it okay so i tried to number these sequentially as i did before first thing we want to do right we need to add the required c sharp dot net name spacing classes so add type assembly name system dot windows.forms and then here you know statically we're calling enable visual styles from system windows forms application remember always access static data okay so first up second step we need to instantiate a form object we have to build a form from the form class the form blueprint right so we're going to use as always the keyword new object and system.windows.forms.form we're going to set the size 351 by tall the position we're going to set to manual and manually position it at x 800 y 300 the text we're going to call kirkley curly the kirkley correctly the sparkly correctly the sparkly yeah how about that quickly instead of crazy correctly the sparkly unicorn there we go um and we're going to set the background color and it was sort of a i don't know fuchsia purpley sort of cyanny type whatever whatever hack and this is just a html you know hexadecimal color there um okay now this is important the next thing we need to do we need to get a pointer to the form background so we can actually draw some graphics on it okay so if you're not going to use a component if you're going to draw on the background of the form itself you have to call the create graphics function or method on the form well this is just the name of the form that we built up here right that we instantiated so form dot create graphics and i need another variable to act as a pointer to the graphics context this is sort of like a paint brush if you think about it in code or in memory we're sort of setting up a paint brush from memory so now this points to the background of the forms and i call create graphics so it puts it in context that i can i can use all these functions these built-in functions now to draw vector graphics onto it or to draw string data onto it okay so i do that and then i assign it to graph so i'll use graph on the dot operator when i need to use those functions and there's methods to actually draw things okay so very important for drawing on the background of a form is step three also very important is step four now remember i have to override the add underscore paint method so there's a built-in method called add paint for every windows form but remember overwriting versus overloading when we talked about that in the classes video you must watch the classes video okay so i think it was video 17 i don't remember but okay so we're overriding that remember when you override a function you're creating a function um with the same name that does as a built-in function or method but it does something different and you're putting your own code there so that's what we're doing we're overriding the default ad paint which just paints a basic form that doesn't do any kind of vector graphics on it or put strings on it well we're overriding it with our own paint method because we're going to do some weird funky stuff that isn't normally done to a form so you'll you do that a lot you have to override a particular event handler to cause events or to handle you know triggers for those events that happen with with your code with with things that you want to happen okay so we do that and um remember overloading is when you you create more than one function with the same name but they take different parameters or arguments and also remember you can override and overload at the same time you can have functions that are both overriding and overloading and if that's confusing go back and watch the videos on functions functions and classes and it will explain those topics we talk about those topics okay so first thing we're going to do i created some functions down here and these are just to try out and use some built-in graphics functions you get once you do this right when you call create graphics and you override your own you know the ad paint method you get access to all these really cool built-in functions so you don't have to reinvent the wheel you can use the stuff that's already out there that's been invented so in the first example we're going to call draw filled rectangles and i should have put these in order and i didn't but all right so here's draw file rectangles so do that the first thing i have to do is instantiate or build what's called a brush object or solid brush so here's new object right and i'm building a solid brush object it's just a built-in object in the windows.forms class and you know and there's graphics objects that we get access to with create graphics in a brush it's a underscore brush is sort of a pointer right a variable that points to and the color is black so it's a paintbrush i can paint with it now and i'm going to call this function two times full rectangle and it just takes x coordinate y coordinate width and height those are the four arguments okay again down here i call it a second time x coordinate white corner width and height okay so if i run this form now that add paint is is overriding the default app paint it's just going to draw some rectangles on the back of the form using this function here right in this case our draw filled rectangles so this is how that looks like all right so here's the form correctly the sparkly unicorn and that and here's our rectangles there's our filled rectangles okay is that and i meant to close that not minimize it does that make sense okay let's take a look at the next function and again i'm going through this fairly fast but if you need to you can pause the video right and i will include the source code and comment tags under the video or in the description tag wherever i can fit it so you can copy it and paste it into ice or development environment for choice you can play with the code and you can pause the video so so that way hopefully i can do all this in less than an hour i'm going to try to cram all these forms components and things into a video that we'll we'll see we'll see you know see if i can do that i have to turn off my verbosity mid and try to be brief in general all right so the next function that was filled rectangles here we're doing the same thing but instead of creating a solid brush object like we did up here we're creating a pen object in this method all right so we instantiate we build a pen object same thing same color black right we can set the width of our pen object so we're going to give it a good size point you know 10 pretty big size point on the end of it and then we're going to draw not a filled rectangle but this time an empty rectangle so instead of using fill rectangle as we did before now we're using draw rectangle to create an empty rectangle but it uses the same arguments in this case instead of a brush a pen that's the pen we instantiated and built here and then the um you know the x and the y and the width and the heights okay so if we run it run the form now you can see here's our empty rectangles okay all right let's go look at another one of these cool built-in methods and functions that we get now we're going to draw some lines okay so how do you draw lines now that we have create graphics to get our graphics context and now that we have overridden add paint we can draw some lines and to draw lines i'm just going to use the draw line method or function and we need a pen right so we're going to instantiate or build a pen it's black and just to show you i could have passed in blue and created it blue but if for some reason you want to change the color of a pen you can't after you build it that's just to show you remember you can get any of those any once you have an object bill look if i hit at least on ice you get auto complete right intellisense it'll show you all the functions member methods and data members that you can access for that function so you notice there's color right so if you doubt or if if you don't know just use the dot operator and you know ice will show you all of the built-in uh data members all the built-in methods that you get with that particular object in this case a pen object that was just to give you an example set the width to 10th again we pass it out as the first argument to draw a line which just draws a line okay and then the starting coordinate x and y and the ending coordinate x and y all right those are the arguments starting coordinate x and y ending coordinate x and y so if you look at this this is inverted right the two arguments to these jaw lines and it's just going to draw two crisscrossing lines x marks the spot because we're pirates wow we're total pirates right i love pirates i i kind of have a fetish for pirates i have everything i'm obsessed with pirates sorry but all right so correctly the sparkly unicorn here's x marks the spot because we're pirates okay so that's draw lines all right there's another function you can draw a bezier curve all right and to do that you have to create what are called point objects we have to instantiate point objects which is just a point that's an x y coordinate and it will sort of histogram curve you know from this x y point to this x y point to this x y point to this x y point so there's four points i've built them and i can pass them in all right as arguments as parameters and i can add more points if so desire to make a more complex bezier curve but in this case we're just going to use these four points here just to show you how it works right and you guys you know what a pen is by this time you understand we're building the pencil we call draw bezier all right let's let's take a look at that so here's our bezier curve right and it's just curving from the four arguments that we passed in the points the x y coordinates that we instantiated that we built up here okay let's look at the next method let's look at draw ellipses okay draw ellipses and if i draw ellipses i'm going to use filled ellipse okay and there's also a draw ellipse which we could use to create an empty ellipse but i'm going to use fill ellipse in this case i'm going to pass in a brush i'm just trying to show you two ways of doing this you could create a drawing that rectangle object all right if you wanted to with an x and a y and a length and a width that's that's one way to do it um or you could just pass on the arguments numerically this way that's another way to do it either either way but it uses a brush a solid brush object instead of a pen i'm making my color pink i'm passing it into the constructor so i can do that where i can set the color attribute later if i wanted to on the brush just like i did with the pen up above okay so if we run it here so it's just basically you know creating two circles two pink circles on the background of of a windows form and finally let's take a look at draw string draw strings a nice cool function so i build up a string here i have a message and just like with a text file um with these windows form components and with the background of the form itself when you want to add a new line you have to add both a carriage return and a line feed so you're going to use the escape sequence this escape sequence whatever you call that the little over the tilda you know and then the end there too all right so r and n and the combination of this it's actually just one line but i don't know it's sort of a tangent but you might notice if you if you just do the escape sequence for a normal line uh you'll notice that doesn't work with windows forms it doesn't work with text files either so when you're writing to a text file and when you're you know when you're trying to add a line to move on to the next line in a windows form or in a text box or something you have to use the combination of these two carriage return and a line feed for the escape sequence so just sort of a tangent but hopefully a useful tangent anyway we have a string right so i have a string here we want to display that string on the form background so first we need to create a font object so we instantiate we build a font object i'm going to make a comic sans a mess that's one of my favorite fonts and this is the point size of the font so two arguments the font face and the point size all right so i build my font next i have to build a brush a solid brush object so i can then take my font and draw with it and i'm setting the color to black so the ink will be black so a font and a brush i've built them i've instantiated them now i need to create a drawing and this is a very special rectangle f not a rectangle but a rectangle f object you need that when you use the drawstring method so i instantiate i create a drawing.rectangle i said that in a weird way so hopefully it'll be a mnemonic and help you remember rectangle f f rectangle f object okay i think if i say it where it helps as a mnemonic to remember but and then same thing right x and y and width and height okay now we have all the things that we need to call the drawstring method and again it's you know this is the graphics object that we got up here right with create graphics we assign it to graph so here it is graph dot i call the drawstring method and all the things that we built up here all these objects the string and the font and the solid brush and the rectangle f they all need to get passed down as parameters to draw a string so i pass in message my string i pass on font my font brush my brush and rectangle which is my rectangle f object okay and so if i do that right so now i'm calling drawstring method message let's see what happens with the form all right so karkly the sparkly unicorn a long long time ago in a galaxy far far away it was a dark and stormy night and once upon a time there was a magical unicorn and she was so totally sparkly and all her reindeer pals they did not want to play with her because she was way too sparkly for them the end how do you like my story okay so hopefully that that gives you an idea of not just how to create a form but some things you can actually do with the form itself even before you start adding things to it you know all the other components that we'll talk about in the future so now that we've looked at basic forms and how to draw and use the background from us as a canvas so to speak with graphics methods let's take a look at adding components to a form and again i've numerically sequenced this process to hopefully streamline it and sort of explain it or demystify it okay so the very first thing we need to do as with any forms application that uses forms of the gui we need to include the you know the csharp.net namespace and classes so to do that step one add dash type assembly name system.windows.forms and then we're calling that static member data enable visual styles okay so step one step two we have to instantiate the form object you have to build the form from the form class so we do that with new object and we set the size of the form with client size and we set its position with x and y coordinates here um i'm going to change that from curly to correctly correctly a sparkly sparkly unicorn whatever um set the text at the top it would be our application name right it would go at the top of the form okay so that's step two step three we need to build the form component so we have the forum we built that good now we got to build the components that we're going to add to the form so this time in this example the third one instead of drawing directly onto the canvas or background of the form we're going to add other uh classes of object to the form other components right things that we have to also instantiate and build with the new object uh you know function so we're going to add a text box and everybody has their own system but my system when i do gui's i like to prefix the type of what you know the data type of the object with like the first couple of characters i'll make what that object is so i use this for taking input in this example from the user but it's a text box so i prefix it with tb i mean you could call it whatever you want you could call it banana if you're gwen stefani but but the point is is that it should be something logical so where you look at your code and you're like oh well that's a text box you know what i'm saying makes it easier to when you have a gui interface that's like you know 2 000 lines of code and has all kinds of components on it it's hard to debug that if everything is just called some default you know text box one text box two text box three you're like what the heck what the what you know on the other hand and you don't even know that it's a text box sometimes because it just you know sometimes by default they're called something that's totally undecipherable if you use some gui design tool that just gives it a default name so i recommend going through your code and neatening it up and give everything a special name that stands for what it is and what it does you know what it's made from and its behavior so in this case the i know by looking at this variable even if i had thousands of lines of code in my interface and i want to come back to this later i know that this is for taking input from the user and i know that it's a text box because of my system i prefixed it with tb okay same thing for here this is a button it's an inner button so i know that because it's enter and i know because it's prefixed with a b that's how i titled it that's how i named it that's how i coded it i look at this and i know that it's a label right because it has an l in front of it and i know that it's it's for the name in this case the name of my user now this is this is the part that doesn't change so it's all my four minutes it just says name now i know this is another label but it's different this is the label that where i actually output when i get input from my user this is where i'm actually going to change and output that data and i know that because i post fixed output to the end of it and i know that it's name and i know that it's a label because i prefix it with an l this is just my system it's not right it's not wrong your system could be better could be worse you'll make up your own i'm just trying to show you that it will really help you in dealing with and managing your code if you rename everything to a logical and well organized type structure so prefix what the object is it'll label a text box a button um and then what does the object do on the forum and then then later on when it comes time to edit that code or you have to track down issues or modify something it's much easier to do that because you can quickly locate components in your code because they're named logically and they do i don't know why it went off on that tangent but maybe that will hopefully be useful to you or helpful to you as you code your gui interfaces for powershell so let's take a look at these components now here we're instantiating and building a text box multi-line by default this is this attribute is set to false all right so you only have a single line text box but if you want a big text box that can hold multiple lines of text you want to set the multi-line option to true and remember if you can't remember you can always hit the dot operator and you're going to get all these data members and all these functions related to that object at least in ice and also a lot of the gui design tools out there you'll see field options you know properties sheets or pages in that gui design tool itself we're going to take a look at one called posh gui which is totally free tool it's amazing good free tool out there for designing um you know windows form interfaces for powershell but whatever you use it doesn't matter you know you could just use notepad if you wanted to i don't know why you'd kind of be torturing yourself but but you could use notepad if you understand how these things work you could just code it out build it set the options on it set the width and the height and the location and i did have to do that manually i mean i you can drag and drop these components on a form with the gui design tool but they when you actually run the code a lot of times it seems like the components shift out of place or you know so you have you do have to go back in the code after you even if you use a gui tool to generate the code you still have to go on and edit the code later so it is wise it is good to to rename everything with a logical name that makes stuff easy to track them you know what i'm saying easy to debug easy to modify easy to maintain so we create the text box we set all those attributes we set the font we set the point size we set the location right the x and y coordinate shifting here we create a button right we instantiate called b enter i set the text to the button the width the height um in this case the location right the drawing point the font and the point size i create a label all right system windows forms label with new object and its name and auto size is true so it'll it'll size itself according to the text value that gets passed into it width and height now in this case because auto size is true that can change based on the text value of the label itself okay and then the location x and y coordinate the font and the point size and i'm just making another label and this is the label that i'm actually going to update with a value so this this label up here stays the same but this label down here this is actually going to change with output okay from the form itself and again here's the you know the font face and the point size comic sans ms so remember what we've done so far we've added the required components we built and instantiated the form we built and instantiated the form components right here so steps one through three now step four now that we've built them we have to add them to the form so the form name right here's the form we built up here we call it form underscore main so for main dot controls dot add range and there's an add method where you can add one component at a time but i use add range um that's it's just a convenient method where you can add a whole array of components to a to a form all at one time and i have to do that right it's a tb input my text box b enter my button l name my label and l name output my other label i have to add those four components to the form okay now additionally if i want to do something with any of these components i have to add what's called an event handler we talked about that in the last video or and excuse me the last topic i've tried that from the same video but we talked about overriding the ad paint method well um here we have to code an event handler for the the enter button all right be enter up here now i don't have to have event handlers for my text box i don't have to have event handlers for my labels because i'm not using them for input they don't really interact with the user i'm using them for display purposes for output okay the only thing that's really listening for something to happen or waiting for the player for the user to to click on it or do something is is my button so that's all i have to add an event handler to an event handler is like adding think of it like adding a pair of ears to your object it sits there and it listens for an event it listens for a trigger when it hears that trigger it'll execute the code that you point it to okay so i can i could do put code directly into my event handler if it's just something short or small but more often than not i will place a function call i'll invoke a function and there might be hundreds or even thousands of lines of code in that function but but i'll call that function from within the curly braces of my event handler okay so for anything on my form that's going to listen for events or triggers it's going to interact with the user with the player be it a button be it combo box be it a list box you know scroll bar or whatever if i want my program to react to that to react to what the user does and what the user chooses on my form i have to add an event handler for every single event for every single trigger possibility i have to add a separate event handler for that component and for that event so if i had 20 buttons on my form i'd have i'd have to add 20 event handlers and that's just for the click method there are other events other triggers besides just clicking the mouse that i can listen for and i could add that on each component so not only would i have to add an event handler for every single button should be like 20 event handlers if i had 20 buttons but each one of those buttons could have multiple event handlers to listen for different events different triggers you know a mouse click or or whatever okay but in this case the only thing i have to worry about is is the enter button that's the only thing i have to add a listener to and again maybe it seems like a corny example but think of adding an event handler as adding a pair of ears onto your component okay you're adding you're giving it a pair of ears and so now it can listen to the the end user can listen to the person who's using your your form your program and when it hears something when that user does something they move the mouse they click on something they scroll something they change or modify something then it can react to it you know that that acts as a trigger which calls that event handler and then that event handler can go and call the appropriate function in your code to do something so i hope that makes sense um in this example all we're doing is you know we're we're just going to take the the label here our output label and we're going to change it to whatever they typed in the text box with the you know the assignment operator so we're getting the text value of that text box and we're just going to assign it to the label okay very simple but this is our first event handler so let's let's keep it simple we'll get more sophisticated later once we get used to using these basic windows form components okay and the last thing we need to do in absolutely any windows form graphical user interface gui application we need to call the show dialog method okay so whatever the form name is we always call show dialogue to show it okay and remember whatever the out no option if you don't want debugging information written to the console so let's run this form and see what it does all right so here's our text box here's our our enter button here's name and then here's the label for the output it's invisible you can't see it but it's there on the form right it's there on our code and i'm going to say carly solalli i'm going to hit enter and boom that's all it does right so the event listener is listening uh on our button right and it it takes it takes what we've typed into the text box and it shows it right here in this label and this label right here now we're going to take a look at creating a form with group boxes group boxes are a very useful way to add components to a windows form it gives you a lot more control over where you position them because it it can use relative positioning sort of absolute positioning so you can create multiple group boxes and put you can nest like uh radio buttons and you know normal buttons and text boxes and labels and things in that group box and then you can move the group box around and when you move the group box around it moves all the stuff inside of it with it you know sort of you know relatively positioned to where you put that group box also when you put radio buttons on the same group box it's what gives the radio button it's it's characteristic behavior you know where you can only click one of them and when you click one it you know the others are unselected whenever you select one that's done by putting those radio buttons in the same group box so let's see how we do that in code and we'll just see how that looks okay so we have a form here we have two group boxes group box top group box bottom okay and notice when i select these radio buttons if i select the top one the bottom one deselects if i select the bottom one the top one deselects the reason that behavior is occurring is because they're both added to the same group box group box top and then this also this text box this multi-line text box is added to that group box as well and i could play with my x and y coordinates i could move this group box all around the windows form and if i do the radio buttons and the text box go with it so how cool is that that can save you a lot of time because you can't spend a lot of time um even if you use a gui design tool you can still spend hours and hours and hours after you've created your initial form going in and and changing your code and cleaning up your code and and and making things things that you can only do with code you know there's a lot of things that there's gui form tools they help at first but there's a lot of things that they don't do and ultimately you still have to go in and you have to tweak all the code and and change all the values and code so group boxes are great um you know if i were doing a large you know sophisticated graphical interface something that i spent quite a bit of time on i would put everything i could in group boxes just because of the relative positioning and because it makes it so much easier to go back and make changes in the code to move things around on that windows form okay and we have a group box at the bottom here and there's in this case a label and a button if i click the button it just says hello world okay so let's take a look at the code and like any other windows forms application um we need to add in the required c sharp.net namespace and classes so add type assembly name system.windows.forms and statically enable uh visual styles okay so step one step two we need to instantiate the form and we've gone over that several times are you beginning to see a pattern step three building the form components well first we need to build a group box okay so we build a group box and we size it and we position it accordingly and then we we build the other objects we want on our forms so a radio button and another radio button there's our to be and our or not to be radio buttons okay our text box and then here's another group box that we build right so we have group box bottom and group box top remember how i kind of in my system i just i i changed the code so that i prefix it so if i look at that variable i know that's a group box because the first two letters are gb that's just my system you can come up with your own system but you know i know that's a radio button because it starts with rb i know that you know text box tb group box gb label l and and so forth okay b button so that's just my system that's how i rename all my variables makes my coder you know could easier to maintain easier to edit easier to to modify all right so we just build and instantiate all of these windows form objects labels button we are setting the location we've already gone over that setting the background color setting the foreground color um you know in this case of of our component and then once we do that down here we're adding them to our group boxes okay so gb top the top group box i add radio button one and radio button option two and i add the text box the top output okay and group box bottom i add the label bottom output which and then i add the enter button okay so again if i run it you see the form right you see the components i'll drag this over here so there's radio button option one there's radio button option two and here's our text box right here and then if you look look at the bottom gb underscore bottom so here is the label right bottom output that's right here and the enter button okay so once i've added my components not instead of adding them directly to the form i add them to the group box and then after i've done that then i add the group boxes to the form okay so do you see how that works now it's just one extra step but i recommend putting everything you can inside of group boxes it just makes it way more convenient and way easier to move things around when you you know you'll reach a point where you can't edit things with the gui editor anymore you have to start using code to edit your your graphical user interfaces it just always ends up that way and if if when you reach that point you have put everything into group boxes it'll be so much easier for you to manipulate things but you know just again just and you know notice how we set on some of these items i don't know if i've gone over individual attributes but remember you can always an ic you can use a dot operator and autocomplete will pop up so on the group box itself notice we can give it a text value and height and width okay and the position under location uses a point object so x coordinate y coordinate here notice on the radio button it has a text component auto size true so that's based on the text value how long that is a width and a height a location x and y a font and a point size okay remember you can always pause the video if you need to um that's a radio button or text box same thing multi-line remember that this value is false so normally a text box is only one line but if you want a big text box that can have multiple lines of text you need to just change that value to be true and then it becomes a multi-line text box so a width and a height and an x and a y for location and a font and a point size okay here's our next group box heights with the text the x and the y coordinate where it starts at here's our label okay and i set this auto size to be false on the bottom label because if i didn't it wouldn't show up unless there was text there see where there's no text i i clear it there's my text if if i didn't set this to be false look if i run the form you wouldn't see this at all this fuchsia color magenta or whatever that color is but you wouldn't see that at all until there was actually text in it and then it would just be auto-sized to be just long enough to accommodate the text and i didn't want that i wanted to center the text and the label and i wanted the label to exist whether there was text on it or not because otherwise it would be dynamically changed and i wouldn't be able to position it in the center see what i'm saying so that's why i set this attribute to false in this example and there's a text align option and the way i got my text to center middle center it's just a constant just a variable that i pass in that centers that text a width and a height an x and a y point value a font face and point size and a hexadecimal color value for the background color again if i watch the form see so that hopefully explains those attributes and my button it just says enter it's 120 wide by 42 high i position it in my group box on my form at x130 y90 font calibre and point size 15 and the four color is that's the hexadecimal value of white okay and the background color is the hex decimal value of black all right let's just i'm statically scoping in to these html color attributes okay so hopefully that makes sense and that explains you know radio button behavior that's how you get radio buttons to um allow only one radio button to be selected you know so whenever you select one it deselects all the other ones just make sure you put them in the same group box that's all you have to do the only other thing is remember we have to add event handlers remember that anything that you want to respond to a trigger with your windows gui forms you have to add a pair of ears to it maybe that's a silly example but maybe it'll serve as a mnemonic to kind of help you remember so if you click on your component and it's not doing anything it's not responding odds are you you probably forgot to add an event handler or you you know something's wrong with the function you're calling from that event handler that kind of tells you where to look so in this case for anything that takes an action that receives focus from the user needs an event handler so that that means the first radio button option one the second radio button option two i need to listen for events and if if we hear that right we'll give them ears and if we hear the event the trigger that they click you know one of those radio buttons then what we're going to set the value of the text attribute of our text box tb top output to be to be if they click the first video button and if they click the second radio button we're going to say where not to be and remember this escape sequence just adds a carriage return and line feed to put it on the next line okay and finally our normal button with our label we need to listen on that button too for a trigger if it gets clicked and if that button gets clicked we're going to take our label l bottom output text and simply display hello world and finally we will always show our window with show dialogue that's how we'll do that form right and again to be or not to be and hello world so those are all the event handlers listening for triggers for those components that i added to my windows form so we're going to look at a list box now and we're doing the same thing right we add the required c-sharp.net namespace and classes we build the form there's nothing new going on here so i'm not gonna repeat you know repeat it the the new thing is in step three when we are building our form components and now we're using a list box okay and that looks like this all right so if you have a list box on this interface here i have all these options in a list box and the user or the player can select options in that list box okay and then you can code an event handler to respond to that so how would we do that we need to instantiate or build a list box class object first so we instantiate we build a list box class object this text attribute doesn't really mean anything it's just a label that that's not how you add items to a list box we'll take a look at that in a moment we set the width we set the height we set the location the x and y coordinate okay and we set the foreground color the color of the text and we set the background color as sort of that gray background color and these are static data members from the listbox class itself okay and here you know we're just it's a hex decimal html hex decimal color value all right we create a font object we set the font to be comic sans ms and the point size to be 16. and here's where we actually add items to the form and the way we would do that we use dot items dot add and then we pass in as a string all the items that we want to add into that list box okay so here's the name of our mlp you know six main characters twilight sparkle fluttershy rainbow dash applejack pinkie pie and rarity okay so that's this is this is a new component we haven't used this one yet we've already used text boxes so there's nothing really new going on here although let me again review right if you text boxes by default the multi-line attribute is set to be false so they'll only display text on one line so if you want to display text on multiple lines you just need to remember to set that value to be true okay in this case yes i i want multiple lines of text so i set that to be true everything else is the same we've gone over um the only other new item potentially is this right here on the text box i'm centering the text and the text box and that works a little bit differently than it does from other components so in this case i'm scoping into the static member data and setting it to be center right when you see those double double columns remember you're accessing something static you're kind of scoping down into it and into an object that way okay so all that being said add the components to the form to keep it simple i didn't add this to a list box but if you watched you know previously remember i said you would always add everything to a a i said list box a group box you would always add everything to a group box first because it does make it easier to manipulate your code and move things around so if this were more you know if this were more just for a larger more complex graphical interface i wouldn't just directly add a list box to the form i would add it to a group box first and then i'd add the group box to the form like we did in the previous example but to keep it simple i i'm just you know only adding these two components that i'm adding directly adding them to the form itself okay so here's our list box here's our text box now when something happens when we do something to that list box right remember what we said you always have to code an event handler to listen to that event otherwise it's deaf it's not going to do anything it's not going to respond to anything the user does if you don't code an event handler and so in this case on the list box itself we added add click so that's the trigger right it's listening for that event when the when the player when the user clicks on that list box and then if it hears that you know if it detects that trigger it's just going to go call the function do something and what if the function do something do it's going to simply get item text and this is a quick and easy way you can you can take the list box itself and get the selected item now that's just an array subscript value it's just you know it's just index 0 1 2 3 4 5 and so on um but we don't really care about that what we want we want the text value stored at that location right so a quick and easy way to do that is this sort of common behavior when you use a list box and when you code its behavior is get the selected item write the array index for subscript value and pass all of that in as an argument itself to the get item text function right member method of the list box object itself so you're just nesting one inside the other that gives you a quick and efficient way to grab the text of the selected item when i do i assign it to this variable as a string and then i just display it in my text box i'm going to say pony of the month is add a carriage return and a line feed in that escape sequence and pass up my string right so again if we run it all right so our event handler is it's listening right our list box has a pair of ears and now when i select these different items there that's the trigger and when it hears the trigger it goes and it calls do something and when it calls do something displays that item there and who's blowing up my phone right now now we're going to take a look at a combo box which is like one of those drop down boxes that you access on a windows form so to add that to a windows form same basic process right you have to include the required csharp.net namespace and classes you have to build the form step 3 you need to add the components and we've gone over everything to do with text boxes so far so i won't repeat that the only new item here is the combo box itself right so we instantiate we build a new combobox object with new object and we're going to set the text on it the initial text would be the final five the width and height we set and then on a point object the x and y coordinate where we want it to appear on the form um the font face and point value and notice that the syntax is similar to how we added items to um a list box so that you know in a similar way to add items to a combo box i can add guys baltar commander adama starbuck apollo just using dot items dot add and that will populate my combo box with choices that the user can can choose from their drop down list okay and we need to add the components to the form all right so for main controls add range and there's our combo box cb input and our text box tb output okay and remember anytime that we do anything with a component or an object on a windows format has to have an event handler we have to give it a pair of ears so it can listen to a trigger um and then when it hears that trigger you know then it can go do something we can have our code jump to a function or go do something based on that event that trigger so in this case we've been working with add click as an event handler we're going to use a new type of event handler called add selected index changed so when they click on that combo box right that drop down list and they select a new item think of it like elements inside of an array and think of each item that you select with the mouse that's that's a subscript value a different subscript value so that triggers an event you know that that's you're changing the index value of an item every time you select an object from a list box or a combo box so you can listen for that event too not just a click of the button not just a click of the mouse but you can listen for when an index has been changed and there are dozens and dozens and dozens of different events that we can handle and that we can listen for but this is a new one so we listen for that and when we hear that right that trigger we go call the function do something and what does that do well okay we are going to call take our comma box we're going to get the item text doing the same thing we did with the list box essentially right it's a quick and easy way to get the index value so that you know our combo box cb input dot select item that would give us the subscript the index value of the selected item in the drop down list and then we can get the text value of that element right of that of that particular position subscript value in our combo box we assign it to the string we're going to add a carriage return line feed to our text box and we're going to say the silent of the month is add another line and then display our message and that would be the text up here right guys balthar commander adama starbuck or apollo okay and then finally we need to you know to display our form as always we call show dialogue so what does this look like if we launch it all right so here's our initial value right the final five and if i pull down my drop down list watch i'll select guys balter someone of the month of school sponsor i'll select starbuck some of them starbuck commander adama okay so you you see what i'm saying so it listens for that event the index value being changed on our combo box so when it hears it then it just goes and calls that function and changes the text of our text box let's take a look at picture boxes in this example and it's just a quick and easy way to display an image object on your windows form okay jpegs or pngs or whatever same basic process as for all our other components we have to add the required namespace and classes we have to build the form object itself and then we have to build the form components we've gone over button multiple times so i won't repeat that but here's the new item pb view and that's where we use new objects and we instantiate or build a picture box object from the picture box class okay set the width set the height set the x and y coordinate where we want to draw it and we have to set we have to tell it where to find the file okay so i could fill this in with the absolute path you know c colon backslash blah blah blah but what i've done here this is a quick and easy way in parentheses i've called split that's path and then parent and ps command path that's a quick and easy way to get the the directory that the script is being run from okay so in this case i'm just telling powershell whatever directive we run the script from that's the directory where you're going to find a subdirectory called images and a file called ls.jpg okay and so then we use the image location attribute and we set it to be the value of that file and you could do all this in one step if you wanted right here i just split this into a separate step and i used a string to sort of make it more explicit i wanted to chop it up into smaller pieces remember how to eat that elephant one piece at a time border style in this case i wanted to wrap a border around it but if i didn't i could set that attribute to be zero instead okay and then the size mode now um i do have one event handler down here right and click but it's for the button not the picture box the picture box doesn't need to listen for any behavior i could i could i could listen for someone click on their mouse in the picture box if i wanted to but but that's not how i chose to create this form instead i'm only listening for events that happen to the button my b view button object and if somebody clicks on it then i'll i'm going to call the function reveal the view and then reveal the view i'm just going to change my file it was alice now it will become wolf.jpg so i change the string value and then i set that the image location attribute on my picturebox object to be the new file okay and it'll automatically repaint and display my new image okay um and and don't forget we've got to add our components to our form very simple form here too only two components right so to my form i'm adding the picture box object pb view and the button and it's going to listen for our event the button will listen for a click event and here's a click event it'll change the image so let's launch it and see what happens okay so it starts out and here's a picture of alice i can't explain myself i'm afraid because i'm not myself you see carrier 7 curious i said alice all right so it's a bit of all right so anyway she's a bit of alright she's like i'm sorry i'm stuck i'm still talking in a bit of an english a little bit of a british accent here but it's not very good on there but i said okay anyway so we click view and now it displays our wolf yay sound effects [Laughter] so that's our picture box component now we're going to take a look at um check check buttons checkbox buttons they're sort of like radio buttons except radio buttons have a different behavior if you put radio buttons in the same group box you can only select one at a time for any radio button in the group box if you select it it will automatically deselect all the other radio buttons but that's not the case with check box buttons okay with a check box you can have multiple selections it's up to you it depends on your interface needs and what you're doing with that particular gui forum and how it interacts with your script your program but um okay so for this component look there's nothing new here i have to include the required namespace and classes we have to build the form step two step three we have to build our components this time we're using group boxes okay so we have a group box top and we are going to you know here we're going to build some check boxes all right and this is very similar to other components other attributes has a text attribute right we have to build it using new object and we have to instantiate a checkbox we can set the text to james t kirk auto size is false because i want it to be a fixed size i don't want it to auto size in this case because i want to position them around my group box accordingly a set width a set height and an x and a y coordinate where we want to draw this checkbox inside of our group box we'll add it later okay so that's check b kirk and we have three more check boxes all right so we're adding four check boxes total and we have a text box for output a multi-line text box for drawing our output okay so um we need to add those components to our form so remember with a group box we add the components to the group box first right so i'm adding my four check boxes to the group box okay and then when i've done that then i can add the group box itself to my form here as as well as the text box right the text box the main output textbook is outside our group box now i added four event handlers okay one ad click for each check box and so if that item is clicked what's going to happen it's just going to set the text to of the text box to be the value of the selected check box that's in the group box okay and here we're calling show dialog to display our form so if we run it let's look what happens gb best starship captains of all time james t kirk okay and then i can choose benjamin cisco sean luke picard catherine janeway all right now this behavior okay there's nothing syntactically wrong with this form okay but notice i have all four check boxes selected now if these are radio buttons it wouldn't be a problem because as soon as i selected one you know it would deselect all the others but in this case that's you know these aren't radio buttons these are uh check boxes and because they're check boxes i can select multiple values i can select all four if i want but when i do notice that the best captain is still benjamin alsiska there's no it's it's not the the logic isn't working the way that it should okay so let's take a look at another example and instead of using the add click event handler let's look at how we would handle these check boxes in a different way all right i'm going to scroll down here and if you look we're doing something different here so in this form this time we added a button okay we listen for a click value and when we do we're going to use the boolean checked attribute that just returns true if a checkbox is checked and we're going to have if no else if no else but just four if statements so this will change the behavior of our form so that if they have multiple check boxes selected it'll concatenate or accumulate and add those multiple values uh to the checkbox and we're just using the overloaded edition assignment operator here right so we're using the same components the only thing we've done differently is we've added a button here and instead of listening for clicks on the check boxes we're listening for a click on the button and the button says who is your captain and based on that it will go call this function and this function will look at the state of checked on those four check boxes and if it returns to be true it will append that or add that in to the text on our text box and so potentially if all four checkboxes are checked all four captains will appear so you can see how this behavior is different right if i choose one captain just one captain and if i deselect them and i choose another one all right but if i choose all four captains watch and then it selects all four items so i'm just showing you there's a there's multiple ways that you can handle events and multiple things you can listen for you have to decide what's the best for your interface for your forum and what kind of behavior you want to happen you know what kind of triggers that you need to get other code to happen on the back end in your algorithm or in your script or in your you know your your programs and so forth now we're going to take a look at a progress bar and this is kind of a fun component among windows forms objects the same basic process for building a windows form add the required namespace and classes build the form object itself and then we need to add the components to the form right the only new item in this instance is progress bar so we're going to build or instantiate using new object a new progress bar class object and we'll set the width we'll set the height and we'll set the x and we'll set the y coordinates okay and we're going to create some radio buttons and we're going to add them all to a group box and remember what that does when you add all you whatever radio buttons we add into the same group box it only allows you to select one radio button at a time which is good we we don't want to be able to simultaneously set the power level at 25 and 75 that doesn't make sense i have to in this interface situation in this particular graphical interface it only makes sense to allow the user to set one option at a time so that's a perfect example of why you'd want to use a radio button inside of a group box or you know a group of radio buttons inside of a group box so that only one can be selected at a time remember what we said with event based programming and with a graphical interface you have to more carefully control what you let the user do because they can move in any random order and do things that they shouldn't do you know in reality it doesn't make sense to set something at 100 power and at 50 power it can only be one or the other um but that doesn't mean that you can't create a a bad interface that lets your user do that and then therefore that confuses your program and confuses your code so you have to kind of put some thought into your interface and what you let the user do and how you control their input you know so they don't end up doing things that that they shouldn't do so we add these four radio buttons right 25 50 75 and 100 power we're going to add them to this group box we're going to use them to manipulate this progress bar up here okay so next thing right we have to add our radio buttons into our group box so group gb amount we're going to add radio buttons one two three four 25 50 75 and 100 then we have to add our group box to our form as well as the title and the progress bar itself okay now what's the event handler we're going to add an ad click event handler for each radio button and if they click on that radio button that event is triggered we listen for it right we add ears to each radio button and if they hear their name called they'll respond to that trigger and when they do it's just going to set the value attribute of our progress bar to be 25 50 75 or 100. progress bars are very useful components you can use them to show you know progress of of processing a certain operation or you know loading something i mean there's so many different things you could do with the progress bar and plus they just look cool and finally remember we always display our windows form with by calling show dialog the show dialogue method so i'm gonna run the form here's our empty progress bar and look 25 50 75 100 okay does that make sense you see what's going on you you see in the event handler code each of those radio buttons is listening so again if i check 25 or 75 or 50 or 100 and then the progress bar would respond accordingly because this value is being set each time a click event is triggered and that radio button hears its name being called now we're going to take a look at a different kind of text box okay this is a masked text box same basic process add the required name spacing classes build the forum and we're going to add components to the form okay but this time the the only new component here we've gone over all the others the only new component is this item right here a masked text box it allows us to set a mask attribute and therefore control the input so we can use regular expressions we can match it to a date type pattern we can match it to a numerical pattern you name it but that's all controlled with this attribute right here the mask attribute all the other attributes are the same these would be accessible and available through any normal text box object including a few that we haven't gone over yet for instance if i want to convert the characters in a normal text box or a math text box and to you know make that a password field so it hides what the user is typing in you know typically you see that behavior when you when you enter a password because we don't want anybody looking over our shoulder to see the password we're typing in well you do that by setting the password care attribute it's normally null but if you set it to be any value then this is the character that will appear in that box when they type and so that way if someone were looking over the shoulder they still wouldn't see them type their password okay tab stop and tab index as well because um here we're seeing we want tab you know when we launch the windows form we want that object to receive focus for input so that's why we're setting the tab stop and then we want to select the text and this just makes it easier because if we select it all they have to do is start typing and it'll erase whatever's in that text box and replace it with what the end user is typing you see what i'm saying so to do that we would just set a selection start the selection start attribute to zero the first character and then we would want to go from that first character to the very end of the text and you can quickly get that via tax dot length it works kind of like a read at count or with a string the string.length method okay um so this is the only new item spell this is the most important one our mask value so we are telling uh our math textbox that we only want to accept numerical input we will not accept characters okay and everything else is the same the button um the event listener is the same we're not doing anything they click the button you know we're just going to display that we're just going to take what you know our our text here and we're going to display it in our text box whatever they've typed into our our masked text box will display in our normal text box we'll de-mask it so to speak and show dialogue to show that window or that form so let's see how this works right this mask attribute so we'll run it and if we run it i'm going to type a character i'm going to type in w w-e-r-t-y-u-i-o-p nothing happens see because it's not a number it doesn't have a numerical value now what if i type a number four four four yes so it allows me to input that data in that text box because it's in a numerical format and you can use that mask attribute to do all kinds of things like you can match it against regular expressions dates numbers you name it different combinations and things that that you want to you know it's your way of enforcing a standard of input when you ask the user for a certain kind of input okay and notice here's the the password character and that's because we set this option here um you know password care right here we set that option okay and if i click on the button event handler it just displays the number that i typed so i'm masking and then i d mask okay and i'm hiding you know taking in password information and hiding it with the asterix character and and here i'm not hiding it in this normal text box does that make sense okay so two items and again you can use this for the normal text box if you want to that should be a pi sketcher but but the mask attribute is only available if you instantiate or build a special kind of text box and that's a masked text box object now we're going to take a look at adding menus to a form and that can be a very useful way to add controls to a form that don't take up a lot of space and in other words so look i click on about all about me help help me view changing the view options options and then we can add sub menus so file open um save file and exit right so we can add menus and submenus to any windows form and the syntax it's very similar to other components let's take a look at the code so to do this just like with any other windows form you need to basically import the namespace and classes second step you need to build the form itself okay instantiate it third step you need to go ahead and create and instantiate the form components so in this case the first thing i'm going to do main menu that's sort of the main strip at the top of my form i'm going to instantiate with new object or build a menu strip class object once i do that then i can build two tool strip menu items boy i have tongue tied tongue twisted there i can instantiate or build toolstrip menu items okay and there's two ways to do this you could just construct it the default way and then you could set there's a dot text attribute you could set on a tool strip menu item but why not you know instead of two lines it could why not just do it in one line of code in which case you can pass a string argument into the constructor and it'll do the same thing so in this case we do that here and these are going to be our menu items there's our parent menu and here's our sub menu they are all tool strip menu items okay and our main menu is a menu strip so we we could have multiple menu categories on a windows form i guess you could have multiple main menus if that's syntactically correct to save it but in this case we have one menu one main menu one strip right across the top and then these would all be choices menu items that we will add so when i plan out my menu as i code it once i've built my main menu right my instance of menu strip then every menu choice simply becomes an instance of tool strip menu item so file open save exit okay and all these done here too tool strip menu items right options view help about okay now these options here i named them sub menus because they're all going to go under my file menu but it's not because i named them submenus that's just arbitrary i just did that for me for my sake so when i glance at my code i'll realize ah that's that's not a parent menu choice that's a sub menu item that will appear underneath uh a parent menu choice when that when they click on it okay that's arbitrary you could call that super color fragilistic or rainbow tutti fruity unicorn if you want to it doesn't matter but you you do what works for you okay what's important is the order in which you add them using items add and we'll take a look at that in a moment okay so again we need at least one menu strip and then for each choice whether it's a parent or a child you know a sub menu item they're still all instances of the same class tool strip menu item okay and you can name them accordingly if you want to so how do you differentiate between a parent menu versus a child menu item the order in which you add them so look down here right under step stage four where i've kind of designated that with a comment tag okay so here um i'm gonna take menu file okay tool strip menu item and i'm gonna add drop down items add i'm going to add open save and exit they're all the same type of object they're all tool strip menu items but notice that the method that i call right it's on menu file itself and i call dropdownitems.drop.items.add and i pass in the submenu items open save and exit so that's how i get these items to appear beneath are underneath my file menu item here's my my parent object right the file menu but instead of calling items dot add i call drop down items dot add it's a different method and that's how i add my my sub menu items now the rest of these they're all at the parent level right and i just add them to my main menu object that main strip of what we built up here main menu our instance of menu strip right so a menu file options view help and a belt okay and when i'm all done i just need to add the components to my form and i only have to worry about adding the main menu strip item right so main menu it's my main menu strip item and i added all of my tool strip menu items but the parent menus and the sub menus too main menu so when i get down here to step four and i have to add components to my form i only have to worry about adding the main menu item and it adds all of the child objects associated with it okay and then my form tb output my phone is blowing up today um and then i just need to code event handlers a menu item is just like any other component um you know on your on your form just like a button just like a check box just like a radio button any other component a list box you have to listen for events triggers when you hear them and they're detected then you execute code based on that trigger based on that event so our event handlers for each one each menu item is going to be add click and when they click on that menu item we're just going to do something simple we're going to display text in that text box and here we show our form and again if i run it again you can see the behavior parent menu item it just displays text all about me help help me view changing view options options and then here's the parent menu item and look at the child menu items that we added with our drop down items so open displays open file save display save file and exit exits the program okay so drop down items to add a child menu object and items that add to add a parent menu object and yet they're all instances of the same class just depends on the method that you use to add them and what you add them to now we're going to take a look at panel object components so again same basic process add your required namespace and classes build yourself a form and then create your components only this time we're instantiating panel objects with new object right so we have panel one we have panel two we'll create some objects check boxes radio buttons buttons and so forth and we're going to add them to our panels well the syntax for this it's just like adding things to a group box right so i'd add components a combo box and a text box to a panel one and it add components to panel two check box one and two radio button one two button one text box one and then after i've added the components to my panels i then add my panels to the form okay and display the formula show dialogue that's always the case so yeah pretty much identical to the way group boxes work but these in this instance are panels and the last item we'll cover what if you want to play like a sound with your former like you know make a sound effect when they click on a button or something you can have a little beep beep sound or something you when they click on a button some people like to do that well an easy way to implement sound and playing a sound in your windows form uh gui interfaces and programs is to use a sound player object okay and so again i would just instantiate or build a system.media.soundplayerobject i need to tell it where my file is remember this tells it to look in the same directory that i'm running the script from and i have a subdirectory called sounds and i have dot wave okay in this case i'm playing a wave file and then i use the play method on my sound player object so if i do that in this case when this function gets called right then it's just you know it's gonna though it's gonna play the wolf sound okay um and then also here right before i call shadow like before i display my gui my forum um you know here i'm going to call thunder one dot wave and it'll play a thunder sound effect and this is just if you look at this form this is just using all the components that we've gone over for our windows forms so look if i launch it okay and then here's list boxes and buttons and radio buttons and so forth and then if i click and here's our picture box right our picture box item see again if i if i run that all right so you hear the initial sound effect from the form lids and then if i click go and it's you know changing our picture but you know you hear that's a sound player object so very easy way to use sound in your forms you know three lines of code and we'll look at one more interface that uses the same thing so this is for a blackjack game i've been working on but um we're doing the same thing here right begin the game and i instantiate a sound player object i'm gonna go find the path and the directory the script is running in the subdirectory sounds and i'm going to call the play method to play my sound player object so here's welcome to casino angelique okay i'm just you know welcome to casino angelique and just plays a little shuffling sound uh so a quick easy way to to implement you know wave sounds in your windows formats and there are other ways and other libraries we'll go over in the future this is probably the easiest and the quickest way with just three lines of code built right into you know system media sound player now you can use each of these examples as templates and you can build your windows forms that could and to a certain extent you will have to do that anyway you can use gui tools also that they only go so far and at some point you do have to start you know coding your interface out but there are tools out there to help you get started at least to maybe graphically you know lay things out and the one that i like is because it's free is this one poshgui.com in the editor so here if we run this it's a free tool and kudos let's give credit where credit is due so kudos um this guy here uh i probably would not pronounce his name right and i apologize because i'm just stupid but but but ma masiej obuchowski is is that how i anyway this wonderful kindhearted brilliant human being has provided this tool for us to use and you can buy him a coffee if you'd like um and he didn't you know i don't know him personally but but a brilliant man designed a brilliant tool here so the developer and this is just a graphical winform design tool all right so look at this you can drag a group box onto a form and and then in that group box i can add checkbox and i could add a radio button you know and i could add um you know a progress bar if i want to or i'm just adding you know a picture box and just adding different items to a form add a label okay if i do that um it doesn't go over menus you're gonna have to do menus and sound and stuff like that and could but notice that it writes the code for me and so then what i can do is i can copy and i can paste all this into ice or into an ide and then i can go in and edit the code and i'm you know i've still noticed that sometimes the positioning is different so you may have to edit the x and y coordinates you have to edit the width and the height you may want to rename your variables to something more meaningful but it's it's a nice way to get started right because it's it's a it gives you a graphical way to position things on a form because otherwise if you start out coding and you'll still have to do this a lot but you won't have to do it as much if you use a gui design tool but you know ultimately then it's a lot of you change the code you reload it you change the code you reload it you change the code you load it like a thousand times until you get the components right where you want them and to precisely get them where you want them you will have to still do some of that but this can save you a lot of time just using a gui design tool like this and there are other options in this case visual studio code and this is a free ide tool and there are things to do powershell you know there are plugins that you can use modules to code in powershell and specifically there is one that you can buy that a developer charges for ironman software it's a hundred dollars and it's powershell pro tools and they have a gui powershell form designer okay and probably the the fanciest and most amazing and coolest thing out there for powerful uh development is powershell studio and powershell studio 2020 that's by uh sapien and it was like 3.99 so 400 bucks it's pretty pricey but if you have the bucks to spare and you know i'm thinking about getting this eventually because it could be a big time saver for me right now i'm still just using ice and free tools and things but this this offers a lot of cool features and a lot of functionality and and they too have a graphical gui windows form designer um that you can use for your powershell projects and and there's another way too that that i haven't gone over but you can use visual studio and use the c sharp form design app and there's a way to you can include the xml file and do guise that way so these are just some graphical options to help you as you design you know you you can use notepad by golly if you want to you can do it all in code um and sometimes you have to because that's all you have but be aware there are power tools out there that can help you that can save you time and these are just some of them [Music] [Applause] [Music] welcome [Music] so [Music] [Applause] [Music] [Applause] [Music] [Music] [Music] you

Channel: OneByteAtATime

Views: 2,750

Rating: 4.9245281 out of 5

Keywords: powershell, POSH, PsSh, shell, script, programming, Microsoft, application, program, code, ISE, development, scripting, Carly Salali, Carly Germany, Classes, Class, GUI, Graphical User Interface, Windows Forms, Forms, System.Windows.Forms, New-Object, EnableVisualStyles, System.Windows.Forms.Application

Id: RvJSUVwLteY

Length: 100min 14sec (6014 seconds)

Published: Thu Aug 06 2020