Getting Started6:09 with Craig Dennis
Let's spin up a new JavaFX app in IntelliJ IDEA.
So now that you know about all those node types, 0:00 let's go see how to make one of those JavaFX applications that uses them. 0:02 The great news is that there's a template included in IntelliJ IDEA. 0:07 All right. 0:12 Now all we need to do is just think of a simple app to build. 0:12 One thing to remember is that simple doesn't mean bad. 0:17 I mean, do you remember that one app that got built? 0:20 And all it did was say, yo. 0:22 Then it ended up getting millions in funding and downloads. 0:25 Huh. 0:28 Why don't we start with something like that? 0:29 Okay, and just so we're clear here, if you end up creating that next app that has 0:31 a windfall of sorts and you're sitting there swimming in your cash, don't forget 0:35 your old teacher here that showed you your JavaFX app building skills. 0:39 All right, let's go blow the world away. 0:43 Okay, so let's make a new IntelliJ project. 0:46 So I'm gonna click Create New Project. 0:49 And you'll see, over here, that there's an option for JavaFX. 0:51 So let's do that, we'll select that. 0:57 All right. So instead of making our app say, yo, 1:00 how about we make our app say, sup? 1:02 You know? Like the short form of what's up. 1:06 All right, so let's name our project, sup. 1:07 This is gonna create a little more than we need at first. 1:12 It uses some best practices that we'll touch on here in a bit. 1:14 For now, though, let's just focus on the main JavaClass that got created over here 1:17 in the sample package, so under Source, Sample, Main. 1:21 Okay, so 1:25 if we look at the class definition here it says Main extends Application. 1:26 You might not have encountered this keyword extends before so 1:31 let's discuss it briefly. 1:34 What this is saying is, essentially, Main is an Application. 1:35 Again this means that Main will inherit all public methods and 1:39 fields from Application. 1:44 Now, you've seen inheritance at play before with objects and the two string and 1:45 equals methods, so extends is the way that you can specify inheritance. 1:49 Each class can use extends once, and 1:53 only once since Java is a single inheritance based language. 1:55 So the way that Java FX applications are kicked off is that you 1:59 override the start method from Application. 2:02 You'll see what our template did right here was it overrides the start method. 2:06 What happens is the Stage, this primaryStage is passed in. 2:10 Now remember the analogy. 2:14 The stage is where the performance is happening. 2:15 So the first line here is for a future topic. 2:18 So let's go ahead and comment that out. 2:21 A very simple thing that we can start practicing with is a root node, 2:25 which you know, the first node of our graph. 2:28 So we can make one called the group. 2:31 So let's add that, we'll call it root. 2:33 So we'll say root equals new Group. 2:34 Okay and it's saying that it's not sure what to do. 2:41 Now, there's multiple choices available so I'm gonna press that option enter. 2:43 And I'm going to choose the thing that does down here, the JavaFX Scene group. 2:47 Now be careful not to grab the Java X Swing. 2:51 Quite a few of these share the same names as they're, 2:54 they come from a similar background. 2:56 So I'm gonna choose the Group, all right. 2:58 So next up, there's the setTitle line here and that's the window's title. 3:00 So let's go ahead and let's make it the name of our app, say Sup. 3:04 And continuing on, we'll see that there is a new scene that is created and 3:08 it takes the root node. 3:13 Okay, the root node is the one that we've created. 3:15 And the sizes and pixels, you know the dots on the screen, so 3:16 this is 300 pixels wide by 275 pixels tall. 3:21 So that new scene is passed into the set scene method of the stage. 3:25 And once our stage is all set up, the next line calls show, 3:30 which I guess can be likened to opening the curtains. 3:34 Okay, so let's run that. 3:37 But how does that work? 3:40 Okay, let's look down here, here's this method here. 3:41 It's a public static method, that returns nothing and 3:46 it's named main and it accepts a string of arguments. 3:50 That sounds familiar doesn't it? 3:52 So this is what runs when the program's kicked off. 3:55 You'll notice here that it calls the launch method that is inherited from 3:57 the application class and it's passed the commands from args. 4:00 Cool, so let's go ahead and run it. 4:03 So I'm gonna choose Run. 4:06 Run Main. All right, that's not very impressive, but 4:08 it's something to work with. 4:11 So note here that things are still running. 4:13 See down here? 4:15 See, this run is still running, the stop buttons here. 4:15 Otherwise, there's be a play button here. 4:17 So you could stop it here if you wanted to or you could just click the close button. 4:20 And you'll see here, it says, run main. 4:23 If I click this close, it'll go away. 4:25 It will stop. 4:27 All right, so what do you say let's add a node. 4:28 Let's add a text node to the scene graph. 4:31 Okay. So let's say, Text. 4:35 We'll just call it txt = new Text and we'll pass in Sup. 4:38 Okay, so again there's multiple choices available and 4:44 we want to choose the Scene text text. 4:47 And then we want to add it to the root's children. 4:51 So root is that group object there. 4:54 So it has, all root objects have, the ability to get their children. 4:56 What this does is it returns a list, and it returns an object reference to a list. 5:00 So we're gonna do getChildren, and 5:05 then we're gonna chain and call add and add txt to that. 5:08 Cool. All right so we'll run it and hm. 5:13 I don't see it. 5:17 Oh wait. 5:18 There it is. It's hidden up in the corner. 5:18 I think I see the bottom little pieces here. 5:20 Let's tweak some of our properties there and try to scoot it down a bit. 5:23 So I can scoot it down with the setY method that's on a node. 5:28 So let's say txt.setY and 5:34 we'll move it down 50 pixels. 5:38 Aha, there it is. 5:45 Cool, well, that little starter project provided a nice quick review of some 5:49 object oriented concepts. 5:52 We saw how to cause inheritance and 5:54 how the JavaFX application can be started by overwriting the inherited start method. 5:56 So now we have a very silly little app to start working out of. 6:03 Why don't we add some interactivity? 6:06 Right after this quick break. 6:08
You need to sign up for Treehouse in order to download course files.Sign up