A Rookie's Guide to Java Part 6 - Java Swing | Harry Wainwright | Skillshare

A Rookie's Guide to Java Part 6 - Java Swing

Harry Wainwright, BSc Software Engineer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
5 Lessons (45m)
    • 1. Class Introduction - Java Swing

    • 2. Coding a GUI Application

    • 3. GUI Builder Interface

    • 4. The Different Components of Swing

    • 5. The Calculator Program


About This Class

The final class in A Rookie's Guide to Java. We cover Java Swing, an external library that allows the user to create GUI (graphical user interface) programs. By the end f this class you will have your own functioning calculator program.

A Rookie's Guide to Java, previously released on Udemy currently holds a 5-star rating and boasts hundreds of happy students. Now I'm bringing it to Skillshare! A Rookie's Guide to Java assumes no prior programming knowledge. We start at the very basics and work our way up to some fairly advanced topics, including Java Swing. This course comes with written material to recap what you've learned at predetermined points. This truly is one of the best ways to learn.

I often see courses claiming that you can "Learn To Make Video Games (No Programming Needed!)" But unfortunately if you want to make anything more advanced than flappy bird you'll need a programming language under your belt. Learning programming is fundamental to any career in the software industry, games or otherwise, and Java is a great starting point.

Java is the most widely used programming language currently so you cannot go wrong by getting to grips with it. It holds a heavy focus on the "Object Orientated" part of "Object Orientated Programming" and as such it is a subject that features heavily in this course. 


1. Class Introduction - Java Swing: all right, and so Java swing, you finished the classes section. If you've gone to this minute, I would say that Java swing is an optional section. It's not required to call yourself a Java programmer, but what Jarvis Wing allows you to do is create Gilly applications or graphical user into face applications, and this will basically allow you to build a layout on buttons to click and fields to type in. Um, they're on any programs I can think of where you just interact with the consul, which is what we've been doing so far. So you well, almost always need a graphical user interface. Whether you'll be building that as a programmer or whether some artists will build back for you is another question. But it is, in my opinion, useful to know just so you can see what goes on behind the scenes. So to say, eso is a short section and classes, certainly, but we cover writing java, swing through code part coding it, and then we cover building it with a dragon drop system built into net beans. So it is optional, but I would employ you toe, have a look it anyway, right 2. Coding a GUI Application: So this is gonna be first lecture on Java swing Java swing is a It's a library you can involve which will allow us to create buoys for our programs. Ah, give me stands for graphical user interface. Eso I pretty much every program you love. The use is a gillie program. He very rarely do people these days use consul applications. So against groups with give you design and creation is kind of really important. If you want a career in programming fusion left a design is an artist, but you will have to There eventually. Andi So Java actually includes a built in library which will allow you to do the c++. Doesn't Grijalva deals and it's known as the swing library, So we'll just important that we've done this before with scanners. It's one of import everything from the swing library on in the last few lectures. If I'm see me and watch them, we could seep classes and sub classes. So we want our our class to extend Ah a J frame. So we're essentially making our class a subclass that is extending to this J frame, which is a super class found in swing library Ah, don't worry. That doesn't make sense. It's just know that when you created giving applications need toe import swing library. You need to extend different at least whichever one Ukraine. The window in frames in Java. That's why stands for Java frame a frame is just a window. Eso everything else you'd call that window? We call it a J frame. I'm just gonna create a new object of our class. One bullet, given that and name, um, as completely valid. I was gonna grand you You didn't. Hello, world. That's fine. That's just gonna run when the program ones. So I'm gonna be putting together. I was gonna basically show you a few of the commands so you can put together you swing applications with the commands of the next lectures. I'll be using ah, builder, which just drag and drop. Say, dragon, drop each different component today. We're gonna be hard coating that, uh, which I'd you never actually do on the job. But it will give you a good and something of you know, what's going on underneath. So let's just set the stars to begin with. Usually had based this on the size of the user's screen or their resolution. Um, I'm gonna keep it simple, to be quite honest on, just say it to a basic formed by 400. That's fine. We got no areas with that. Next thing we have to do is so we can see our frame is said to visible. So you noticed I run the program, but nothing happened. We got this build successful. That's cause you got to set it. Ah, you J frames too visible. Usually wanted to be the last thing you do inside. Uh, old class s o I just running again. Then we could see the window 400 by 400. Nothing in it. Nothing there any interest. But we've created a J frame and it's got the three buttons which would expect simple right , obviously, is one reason that beans that followed in that beans Ah, lay out that spirit. Would you call up? That's a lot. Anyway Ah, what's mentioned doing this all inside of the constructor, by the way. So if you have much my lecture on constructors yet you might be confused. I suggest you go back and watch that eso we've said toe visible. Next thing we could do is set the title, so you'll notice I'm doing. I'm using the this keyword as I didn't give the class and name. This just refers to this class. It's the same as if I have given it a name. Called out tonight. Object one. Usually I'd be typing, you know, object one here. Uh, because I didn't give it a name. I'm just using this. Which referring to you to me. Hello, world. So we're gonna set it to no, not so visible going to set the title. And this will change the tile. So this is what it refers to on it saying toe this bit of the very top of the window. So I'm saying that title in this to calculator the next few lectures, unless I change your mind, we're gonna be building a calculator. Eso that's running again. And then we haven't got calculator at the top groups. Um, start populating it with some attributes than more components. Close it down. The eso. The first thing is on. This is kind of specific toe java gains on. But you you have your J for anymore your window. And then inside that J frame, we have a panel or J panel inside. That J panel is all you components. We generally just use a J panel to kind of keep it all together. Keep it nice and neat, I suppose, is the best way of talking about it. But it isn't something you can actually see. I will create any wakes. Maybe actions speak louder than words. So I was gonna create any J panel which called Panel, and then we have to add panel to J frame. So even though this keyword again, I was going to do this store ads panel, so if I run it again is gonna be no visible difference to our calculator program. But there is now a panel which will be filling up the the the usable area here. Eso Let's add something into our panel I'm gonna keep I'm keeping this election nice and simple, By the way, it's not gonna resemble a calculated by the end. Will be will be expanding on in future lectures. So we're gonna set a bit of text. And to do that, we have to use something called a J label. Now, Jay label is essentially just a little string of text. I believe it's just one line. Um, it's a small amount of text. Anyway, I believe is the best way to describe it. So I was gonna set that here now, Like we added the panel to the J frame, we have to add the label to the panel. So as here we did this. Start referring to Jay frame Dad instead of this, we're gonna use panel the ad. I'm just gonna add label one to that on with any look. Should be okay, So if we run that now, we've got a little bit text in center of the screen says hello, world. What else can I show you on? I'm not showing you every component because this video would be half an hour long. We're gonna be moving on from this very quickly. Anyway, Ed Buttons, buttons it pretty instrumental. So Jay label ah may catch some people out. It doesn't exactly refer to, you know, a small bit of text. But buttons, on the other hand, j born very self explanatory. What they did. Sam's gonna cran you, Jay Boland just gonna say click me in it. And then, as I added the label to the panel. Who's gonna add the button to the panel? So I mean, this is all very self explanatory. It's not a difficult concept. It's just time consuming, typing out line by line by line. That's why we're gonna be moving on very soon. So you see you just Saturday. But I'm here. It just says Click me Doesn't do anything. Uh, I'll be able to add that functionality in the future. Ah, a few little clear apps we're going to do saying that it's whenever in the program on I press this first I can resize it Not good for a calculator exit just messes. It'll look like this is there second thing, and this is if I click the red button here doesn't actually end the program after. Like, I can't rerun it after press the stop button down here for it'll stop. So I'm just gonna go down here to the bomb. Ah, and I believe it's this stuff. Yes, that re sizable. Nice. Just taken in a boo lean. So that's false. That will stop it from re sizing. The other one I want to do is quite a bit longer. Ah, that the I mean why I wasn't getting helpful pumps. So they were just referring to the J frame again. This long line here will set default Close operation J frame Exxon close. So exit on close it's gonna exit the build when we close the J frame So now we can no longer resize it on When we press the red X, it stops the build So that was a hopefully shortish video on Java swing. We're gonna be moving on in the next few lectures on using a the tools that we can just drag and drop everything in So it we'd after 1/5 round Little this but hopefully it's given you a behind the scenes Look at how how this stuff interacts with each other. 3. GUI Builder Interface: All right, then. So it's they're going to be using Met means built in and give a designer hospitals, You call it? I don't really know what it's really like, miss on, but this will allow us to just drag and drop components onto our Jeffrey instead of typing wall in manually as we did in the last lecture. So I'm just cleaned up our main class and function here, so it's all empty. Uh, you need very bare minimum. We're gonna keep all our gooey and I capture it stuff in a separate file. So the same as we did with, you know, cats, dogs and animal classes appear was gonna creating you. Ah j frame form new. No up. Ah, Maybe it's a new J friend full. It happens. It's gonna cause calculate it finished our eco. So is J frame fool, so you'll see immediately that everything is different. This isn't the code view we've been used to so far. If you want to get that back, then we just click the source. But up here a top. So you see what source design in history exit generates a bunch. If a bunch of courage which will be added to. So it's a J frame here. Pretty simple. Over here, we've had our palace input. Um, so this is where we're gonna drag and drop stuff, You know? It's not mentioned. Panel last time. Leave out birth. For now, we've got our swing controls. Here's without labels, which we mentioned buttons got toggle on off buttons here. Text fields, which is for a bit more text rather than labels. Text area, which is multi lined. And there's loads is Yeah, you're welcome to digging in your own time. I won't be covering all of them. Certainly below the power. We have the properties. So this is depending on. Well, have you got selected the moment I've got the J frame itself selected. So I have the properties off the J frame. So they see this is that line. We added the long line default close operation with exit on clothes. We just have higher Do nothing. Dispose levers. Exelon close because, you know, that's what we were doing. We can have that. The tile here of the J frames. We did last time as well, so I would just call out calculator. Um, so we're gonna the first thing we're gonna do is and show that we can see this, Uh, something that I think it was the first thing we did in the last ones will. So it's gonna create an object off our calculator. So it's gonna be calculator, which we call it up. My just just just a test equals new How key Late toll, then test stop. Set visible. So please don't call it test in yours. I was on the spot, so I had to do it quick. So if we were on the program Onda we got calculate window says calculator at the top. It's just a J frame. And if we close it, it does actually close it on this. Or eggs on clothes is working fine. Um, should be a property to resize it in here somewhere. AP third size says at the moment it set 400 by 300. Uh, yeah, that seems about right to me. I'm gonna resize that right off the get go. Just at 600 by 600 and probably needed that big. It didn't even resource. Maybe it's not preferred size, You know, I leave it for now until I find out what property? Eyes now all day seems to find that out. So was last last thing we didn't. And the original lecture was put in a panel on this. Gonna contain a lot components. So I was gonna resize it to not quite the full screen. Mostly they're exceed. That means does actually how we line out with these guiding lines here. So just off the top, I'm all day just off the bomb as well. There we go. Eso we have RJ panel here. Uh, I was gonna change the variable name if I can find that property. Farewell. Name is under the code tab eso I'll just call this panel. We're gonna have warm panel. Sam's gonna call it panel. So what we need in, like how close? It's gonna be really, really basic. And you're welcome to expand upon it in your own time. If most part I'll just be in this lecture, I'll just be having our different components on the visual side, and then the next side, we're gonna click this source top here and ensure that it's all working s So the first thing you probably know this is after I added my J. Pamela, which is not visible the moment. Um, it added. So I was thinking that added this private variable down here. Jarvik swing J pounding panel. We obviously renamed it to panel. So as you Ah, dragon drop things in the design view, it will automatically update source code for you. And that's why this is a useful. So you'd after enough to the spending Tina hours I saw in your layer out line by line of code. Some people prefer to do it through code. I most certainly do not. It's at least. 4. The Different Components of Swing: So we're gonna continue adding components to our Cal. Carry on. Really? Just after it boil this down to what does calculate here involved? It's a sudden last lecture. Uh, this is gonna be really simple. Really simple. If you want to expand upon it in your own time, one so giving you the basics of you know, it's the swing library. You're more than welcome to Ah, but I found I just keep it real simple. So we want to add a text field. Um, on a J text field will allow the user to input a line of text. Essentially Well, I will. A lightweight component that allows editing of a single line of text. The key would being allows editing. So this will allow the user to edit it. So he's the that the right box there. We can drug it to others Lied size. I just double click to this. So this has taken us to the code, which doesnt mean today more men today was edit default text we've got there. Yeah. So under text here in the property section that just says jay, text field warm. Want to get rid of that? Um, I don't want to type something there. My trial day with labels so I can show you a bit of variety. Big Sebaggala loaded, different options here. And I employees to play around the minute you're in time. So change the farm background color, foreground color, even a text linemen and south center, Except for except for except for not gonna go too far into it. I was going to the code real quick and change the variable name. It is good to get into a convention when naming these different labels. Show you why. And then they would probably be in the next lecture, but is it's a text field. I'm just gonna prefix it with here, and then I'll just call it first number. No, we go Ah, Or create another text field for the second number. Do the same again, Which is gonna call this one TF second number. Oops. Uh, T s t f and properties here get rid of this text. They would have it. It's gonna be about down a bit. That's label these. Ah, So the user knows what they'll So is it says Jay label won by default, was gonna say first number groups keep down there? Uh, maybe a way to underline it. I I honestly I'm not sure that I don't think so. Actually, regardless, it is getting a label out that can double click it to change the text inside. She's what men's do before. And if you miss click of it, then you've got taken to the code. It's cause one second trying line There's up a bit. It's gonna rename these for these labels. Just gonna say it's gonna have prefix it with L. Ah, of course. One second number on and L first. But today we have this where these is gonna input, Um, What they want to add and subtract, possibly divide Andi, multiply. So God J boom one. This is just gonna be our tradition. So it's gonna be addition, Prefects and with the beaks is a book, obviously. So in Texas is gonna have a plus sign and then the strike. A few more of these Ah, let's commit minus Uh hey, so tracked. Forget these to line up a bit. But part of me, I could be a bit fiddly. That's on snap back into place. I'm not sure which attribute is doing that it's basically net beans trying to be helpful and make sure it's all lined up correctly, which is fine. Ah, referred to be on and be a bit annoying then. No, on it all course will be Teoh application. So change the text in that one. It's gonna be an asterisk. Yeah, but annoying. But whatever, it's just a rough idea to get you used to it. This one could be division, so it be deficient. Oops. Pretend that that didn't happen. Finally was gonna have a label round here, which is gonna be a answer. It's gonna be nothing gonna be in this world. Ah, but I will change the farm on this one. It's to show you, you know, that's a thing said Sauce 24 and then clear out the text. It's not. Label still exists. Uh, just invisible se. We haven't Recep Ally components. Are these gonna import their numbers into these two fields here? Then press a button. The answer will be displayed down. Here s we're going to do that in the next lecture. We're gonna cover the code 5. The Calculator Program: All right, then. So we're gonna be having a code. Why calculate it's gonna be believed Fun Electron job swing. I'm add more in the future, but I want to give you a brief overview of I can create Goose for your programs. And so the first thing I want it's nice. Is I finally found out with navigate waas? I usually is this displayed by default down here, but if it isn't, um, you can select from the left side. Bore here files is where we used to be working. This obviously has that, you know, job files in. But if you get to the navigator over here and it'll list all of our components that we've created So, um, this comes into play the naming conventions I was using, So be addition, B division, location, subtraction. It's got all the buttons together because, like create temas, I labeled them with a B and then, you know, an elf of the labels and we got a t f for the text fields scale come in and play again and moving on. However, if we want to create, you know, on action to respond to a bullet, impress something I could make out but small back home. Um well, we have to do is we have to are selling it on event on to do this. We just click on the event tab here once we've selected the blonde, so we're gonna be working on addition. First, we were loaded. Different events. And this will. When one of these events is triggered, it will trigger the code associated with it. Essentially, it's gonna be more simplistic once I I give you a good example. But that leads different events. Keep rescue release key Typed mouse, click mass dragged, mouse entered, etcetera, etcetera. This kind of catchall, one of the top his action performed. This includes mouse clicked on D key pressed or is that key released and includes a few different ones. Essentially, is what is what we need. You can use mouse click to fuel amb. Obviously that weren't function if you press the space for space bar, for example. So it was likely dropped out here. That's going to create a function that will be triggered once we pressed the addition. Boone. Okay, so sounds fairly simple. And it's fairly simple. So our addition, But let's think what is going to do is gonna take in the numbers in the first and second field. It's gonna add them together. Then it's gonna set the answer label to whatever the answer is. This is, you know, really simple stuff. We covered this in the first few lectures were just adding it to agree. This is just basic addition. So it's so parentage is we're gonna have number one number two as of number one, he pulls. So what I'm doing now is I'm just pausing the text field this first text field here, whoever the uses it entered. So think back to scanners on what we were doing with that scanners. Was lovely. Taking an input from the council. Now we using swing. So we're getting the input from the text field. Uh huh. Why didn't that foreman correctly? Ah, not tonight. We'll fix it in a minute. So you see, now we've talked in this, so we're referring to this area on. We have all of our labels here because we've named them correctly. We're gonna be pulling in from ah, text fields or type in TF on they would have it. It narrows it down to our to TFC. So naming conventions really important. Obviously, if you had hundreds of components that's gonna get that's gonna come into play a lot more that's read what the Sarah says. It's just expecting. Okay, Simon idea. Ah ah, I did. Squiggly brackets. Um, instead of around little ones Su let this just re factor rabbit. So it's all on the same line. Yeah, that will possess me that, um in the meantime, I've put this line of code into a try catch statement. Eso, same as we did with the scanners in in the electoral. Would just looking for an interview here on if we don't get into your we want to output in error message. So previously I used a very specific form of our message, and I can't remember what it was on. The exactly import Miss much exception. I believe it. Waas, um mouse that that's a very specific air message. Weaken do far more general error messages. We knew that as so exception is like the most generic error message you can get. Um, and it just it's a catchall for everything. Really a way one very spit got specific in the air message, but you know, allowed Put something. I'm gonna apple this to a Ah, a new J panel centrally will create a new J panel which will just show the error message Now that we got it's come up floors. So it takes a few things, weaken the minimum we can get away with this component object. I'll import a few different things. So show for this in the it's in the first field. So say first number error. Ah, this will make more sense when you actually see the error. But for now, just copy along. I suppose that's going to create a new J panel with just some basic information for debugging. So this is gone over here of hit cult. Enter on that. They'll give us some potential fixes. So the top one is add import for Java swing J option pain, which is probably what got to do. Yeah, there we go. That should fix that one. Ah, folks were doing that instead. Yeah, there we go. I was just a type eso, if that's for a number, Field one. So we're up to here. We've taken in the first number. We've assigned it to a variable number one. It's going to exactly the same for number two. Obviously, we're gonna instead of tear first numbers could be this the second number. Andi, change the error messages. Well, very forgot. Anything else? No, I should be a good Finally. We just want to add these together. So let's have int and swear equals number one and number two. Ah, and then we just got to set the label. Haven't way. Is that correct? I've got these are messages here. He, uh and and I should still compile. I imagine that's an interesting era. Yeah. What's happening? There is It's saying that haven't been initialized, which they have him. We've created the variables, but we're only initializing them in. Try catch statements which may or may know, trigger. Obviously we go. If we're going to the catch, then the tribe, it hasn't worked, so this hasn't been initialized. If it's underlining in red squiggly, that means it's not gonna work, so I'll just initialize them to zero. This isn't the ideal solution that will leave it like that for now. When we got to set the answer eso because he here we've got a label, so l answer and then we just set the text. So we've covered this before. In a previous lecture. We just said to answer My voice is going to have to be a little it quick cannot convert into two string. Did it? Did it? Did, uh yes, do that. Maybe continent. Yeah, yeah. When he can Can I get an interview? It converts it to a string automatically. We could also cast it to a strength, but I've got to do that off my head. So this do it this way for now. So I believe that's it for addition. Let's run the program and see what happens. So, I mean, this is an ugly girl. We had expect girls to be much better, but for now, let's just do five at five. Press the addition. Boon. They would have a equals 10. So off camera, I'm going to do subtraction, most procreation and division, and I'll get back to you in a minute. All right, then. So I finished, uh, second, pull the code E. I mean, it really is very simple. I may add to my very few changes. Ah, normal kids find you just got to make a few changes at change the addition. Sign here to a subtraction sign in subtraction. One on multiplication and division. You've got to change it from an interview to afloat, obviously a few times to insist together you may get a no, you get home numbers. But if he divided, certainly, uh, you may get a float or a decimal number. So we just got changed those floats. It just makes the case of changing the signs around. Now. If we were in the program, I mean, obviously it looks. It looks ugly. Assume no one's denying that it's not pretty program, but the lectures wants show showcase that I was just give you a basic idea. Eso just five and seven and together 12 years correct. Take away minus two. That was Find out that I wasn't actually sure how it would handle negative in a looser That's good to know times together. About 35 Vitamin get zero. Not correct. No correct at all. Eso I'll bring up a actual capital way off screen, actually, so 0.7 didn't get up. Wonder why. Let's change them. Was rounds or 10 uh, 52 bad Example. 10 3 So we're still getting a float. That on inter. Just sorry. Uh, I changed the answer to float. I'm just wondering why possibly because of the way we're setting the text. Although I doubt it. If I could remember how to open up the deeper go, this would be a lot easier. Let is this. Do it manually. So we're just gonna print our answer here before we'll be simultaneously. But that's fine. So I will be able to see what he is actually coming out within the consul. So what was it? Uh, 10 divided by three. I believe to read council down here. We're still getting three. That's got nothing to do with that. I see him in then is because with asking for inter juice. But I'm honestly not sure this is Ah, quite interesting. Interesting problem. I doubt this will work, but we'll just see for the sake of it, because we're still pausing in. Oh, no, I worked for Well, screw me, Angus. And so apparently, you can't get float if you two component numbers of both inter jizz. That's very surprising to me. It doesn't well, online C plus plus, um, soon, But I guess in division we just such change The the two initialization is to floats as well . Um, bit that's worked. What was it given his areas before? It was like five and seven, wasn't it? I can't cool eso That's a working fine. We've got all our full Ah Barton's working last final thing I want to take test is our air messages. So I'm just gonna talk in a string here. Cool. So we got our era is Talavera first number era Presser K. Nothing happens. Program doesn't crash. It's all good. Just doesn't do the calculations if it didn't do the calculation and we'd get a problem Ah , you notice that the box also listed first number error Northern second number era, for example. So is putting ah string into this one as well when we get second the mirror. So that's perfect. That's exactly how I expected it to look. So this looks like a lock heard. I mean, it is a lock heard. Ah, but it's just copy and paste over and over again. We need to make very minimal changes in regards to the division on the multiplication. Both in that and it's pretty much the same. Same stuff would have been using. Obviously, you can make this capital area a lot more complicated. If you wanted, he could have decimal place in. Um Well, you wouldn't need investment place. They could just type one in and which would be fine. SE wants to do 5.2 seven point a. It's not gonna work on something that yeah, not gonna work because we're importing floats and it's looking for Introduce my work in the division? No. Well, that's fine. Obviously, the way to fix that would be Look for floats as well as along with Introduce on DA Won't not, but you can make this a lot more complicated. You can have a few more buttons if you want to get into more complicated mathematics. But this was just meant to be a really basic example. That's interesting. And I am, ah, maybe ask aside and had both of the little Israel anyway. Really basic example of gov in Jova swing