JavaFX Java GUI Tutorial - 18 - Simple TableView

all right so now in Maine dot Java first let me explain exactly how this is going to work so we're going to have a bunch of different products and these are just going to be regular Java objects so we're going to have like a laptop toilet cheeseburger whatever products that we have a bunch like I said just plain old Java objects now once we have those we're going to convert them into an observable list so we use observable list before we saw all the benefits of it and an observable list is what we're going to use in our tables so objects to an observable list to a JavaFX table simple enough let's go ahead and get started all right so oh I just say like a little fruit cup in between the last tutorial on this one and uh I don't know I feel like I need to eat more fruit but I'm too like lazy to peel the orange so I just buy these fruit cups but whatever all right so observable list and inside here inside the I would say curly brackets but they're not Oteri's regulator I don't know less than greater sin than regular brackets I guess you write what type of data you're going to have in your list now before we saw string double int but the type of data is actually just the name of your class so we're going to store product objects in here so we can just write product and you can just name your method anything you want get product so what this method is essentially going to do is it's going to load in all of your data I'll say uh like get all of the products and it's going to look a little bit goofy because I'm just going to make a bunch of you know products real quick but again this would typically be something like connecting to the UM you know a database on the internet or looking on a file on your computer for like a CSV file or some or something but I can just type in a bunch of products whatever so again we're going to need to return an observable list of product objects so the first thing we need is an observable list it's going to hold products and I'll just call it products instead of equal to FX collections hold on I got a cuff my god Wow okay where was I FX collections dot observable array list and this is a type of observable list rügen store java objects inside and now we just need to add a bunch of products to it so products add and just create whatever product you want so new product holy sweet tamale and remember for the product constructor whenever we create a product we can just create it all in one line passing in a name a price in a quantity so for my first product I'll just say laptop and for the price how much does a laptop cost 859 not bad it's going to be a sweet laptop and the last one is we have 20 of them so you can just do this for whatever fake products that you want I'm just going to say I have like five different ones I have a laptop move that all the way bouncy ball what do I have toilet the notebook DVD awesome movie by the way and corn all right now let me just change these up so I know how much is it bouncy about $2.49 and how much is a toilet $99 the notebook DVD is $19.99 and corn I'll say corn is a dollar and 49 cents and the bouncy ball we have 198 of those I have 74 toilets a bunch of toilets in my store I have 12 notebook DVDs and I have 846 corns court up corns corns and toilets boys come and get them corn and toilet sale that's a going to be my commercial alright so now we have a bunch of products stored in a servable list we just have to return that's a list right now just go ahead any time we call this method right here it's just going to get all over products and return the list and again like I said this is usually going to be a database or something but whatever this is how I run my store do not judge me so now that we got all the boring behind-the-scenes data stuff taken care of we can get to the good part learning how to make the actual table the user interface is going to be awesome alright so the table is just called table view this is your entire table and it's like that one don't want to import swing and in brackets you write what type of data are you going to be story in your table well of course we're just using it to store our products and now you give a name I'm going to be really creative and just name mine table awesome alright now here's the thing whenever you create a table essentially whenever you create a spreadsheet you need to have at least one column now ours is going to have three columns one for the name one for the price and another for the quantity so again just remember if you try to create one without using any columns you're going to get a bunch of errors so the first thing I always like to do is set up my columns so I'll just write name column and this is how you set up a column the first thing you have to write is table column and as you saw it takes two pieces of information the first one is just the type of data in your table so again product like before and the second one is what type of data is going to be in this column so in the first column we're going to have string data for the name the second one doubles and third one integers so for the name column we're just going to use a string nothing new and I'm just going to name this name column and you set this equal to new table column and just pass the name column so again we're going to have columns and the header of it is just going to say name at the top and that's just a little indicator so the user knows what the heck that column is supposed to be and you can also do something like this name column set min width and just give it a pixel value so the minimum width of this column is going to be 200 if you don't have this then they kind of look like all the columns are bunched together kind of looks a little bit goofy so I like to do that and the last thing you do to every column is this name column set cell value Factory so what we're going to do is for the name column we're going to say use the name property of our objects so for this column look to our objects and get all the values of their name so it's going to have laptop bouncy-ball toilet the notebook DVD and corn so this is where you kind of tie your data together saying use this data for this column and the parameter that you pass in is new booooo property value factory and then you just write the name you actually don't need these little indicators because everything is implied so that's how you set up a column real simple and now we can just copy this and do it for the other two so named column 1 0 1 price all right so for the price column this is obviously going to be price column and we aren't storing prices of string we're storing it as doubles and we'll just say price right here and price so again make sure that you whenever you throw in this parameter right here that it's the exact same is this variable right here this one this very first one this is just the header and it can be whatever you want I'll say like a item price you can have that if you want but this one has to be the exact name of your property so make sure I got that what's the width of my price let me have that at 100 I don't want my numerical columns to be quite as wide as measuring columns so are moving on quantity quantity column quantity column la la la la la la nothing happened nothing to see there art 1 and let me just write quantity in quantity alright so it looks like I have everything set up correctly name price perchick one quantity 100 100 Quentin Quentin corny alright did a little quick check in my head alright so we have three columns set up and they're just showing there they're ready to stick inside a table and to set our table up it's actually really easy table equals new table view and after this we have to do two things the first thing is loading all of our data so what data do you want to use for your table we're just going to call set items and this method right here we made to load in all of our data so that's going to get all of these products as an observable list and those are the items that we're going to use in our table and the last one is we just have to add our column through it so table get columns a doll then just add all your columns so this was the name column and then the price column and quantity column alright so I art now I actually have to add our table to our layout and everything should be good to go I think all right sexually find out so I'm going to run this and check it out alright so we have our name column our price column and our quality column and one of the awesome things about JavaFX is this see we didn't build any functionality ourselves to sort all of these columns what it's doing it for us and also we didn't have to build anything to like select this and you can also if you grab one of these you can drag it into a new location did we have to build that all done for us so that's one of the amazing things about JavaFX but there you go that is how you create a really simple table again what we did is anytime we have data that we want to represent build a new class and make sure to include all of the properties and then once you can treat your data is a Java object take all of the objects and stick them inside an observable list and then your table can use that observable list beautifully thanks the JavaFX so in the next story I'm going to show you guys a couple other cool techniques that you can use with the table but for now thanks for watching see you next time

Channel: thenewboston

Views: 170,886

Keywords: javafx, java, gui, tutorial, scene, builder, 2.0, game, animation, application, swing, download, demo, sample, example, Java (Programming Language), Programming Language (Software Genre)

Id: mtdlX2NMy4M

Length: 12min 3sec (723 seconds)

Published: Thu Apr 23 2015