java gui programming - maynooth universitydtraynor/cs211/lecture13/lecture13.pdf · java: the...
TRANSCRIPT
![Page 1: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/1.jpg)
Java GUI Programming
An Introduction to Swing, Event Based Programming, and more.
![Page 2: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/2.jpg)
Administrative Stuff
● Des Traynor ([email protected]) ● Website:
http://www.minds.may.ie/~dez/cs211/● 2 hours per week lectures, 2 hours labs as
per usual. ● Lecture slides will not be sufficient for
passing the course, alas.
![Page 3: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/3.jpg)
Course Layout
● In order...– Creating Basic GUIs using Swing
– Creating Nice GUIs
– Event Based Programming, to add functionality
– File I/O in Java (briefly)
– Writing Full Graphical Programs to solve reasonablesize problems (size depends on time)
● You'll need to be able to do all of these to do well in the exam.
![Page 4: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/4.jpg)
Java: The Background
● Java is a new relatively new language, its original popularity was due to two things, applets, and platform independency.
● The first few releases of Java contained the Abstract Windows Toolkit (AWT), a slow primitive poorly designed toolset for creating GUIs.
● Netscape wrote their own version later on, and Sun reacted by co-authoring JFC with Netscape. The Java Foundation Classes updated Java and made it a 'real' competitor in the desktop market.
![Page 5: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/5.jpg)
Swing
● The Swing toolkit contains 250 classes and 40 different UI components.
● We will not be covering them all, we will cover the most regularly used ones, and I will show you how to go about learning the other ones.
● We will cover the components in a reasonably structured order, starting with the most necessary, the JFrame.
![Page 6: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/6.jpg)
JFrame: Making a Window
public static void main(String args[]){JFrame jf = new JFrame(“This is my title”);jf.setSize(800,600);jf.setVisible(true);}That'll give you a big dirty grey Frame of size 800 x 600 pixels.
The title of the frame will be “This is my title”, and the frame willbe visible. Lets have a look at it... (code1.java)Questions?
![Page 7: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/7.jpg)
Side Note: Applets versus Applications
● Applets, are basically Java applications embedded into a web browser with more limited functionality. They were “big news” back mid 90s , but these days they are just big slow and ugly.
● Applets are have effectively been replaced by Flash or well coded XHTML, and as such they have limited uses these days (This is my biased view).
● It is very easy to convert an Application to an Applet, so we will work with Applications because they are less hassle. Thats all I'll be saying about Applets
![Page 8: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/8.jpg)
Extending our JFrame
● To create JFrames that do what want, we create a new class that inherits from the class JFrame.
● Inheritance is when you create a class that has all the methods/variables of another class, but you add/remove attributes & characteristics to it.
● Inheritance is a pretty big concept, but I can only touch on it, detailed exploration would take too long.
![Page 9: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/9.jpg)
Inheritance ExamplesVehicle
Helicopter Car
SpaceWagonApache
Is a type of..
Is a type of..
JFrame
White JFrame that closeswhen you click X
JFrame containingfunctionality for a calendar
![Page 10: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/10.jpg)
JPanels
● When we create programs in Swing, we add the GUI components to a JPanel, not directly to the JFrame. (this is one of the big differences between AWT and Swing)
● So, to create a Simple GUI in Java, we...
1) Create the JFrame
2) Add a JPanel to it
3) Add everything we want to the JPanel.
![Page 11: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/11.jpg)
Extending a JFrameclass mySecondFrame extends JFrame{JPanel mainPanel;mySecondFrame(String nameOfFrame){super(nameOfFrame);/* Create the panel, and make it white */mainPanel = new JPanel();mainPanel.setBackground(Color.white);Container contentPane = getContentPane();contentPane.add(mainPanel);setSize(400,300);setVisible(true);this.setDefaultCloseOperation(EXIT_ON_CLOSE);}public static void main(String args[]){mySecondFrame msf = new mySecondFrame(“White Frame!”);}}// A complete version of this : MySecondFrame.java
![Page 12: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/12.jpg)
Look at the inheritanceclass mySecondFrame extends JFrame{JPanel mainPanel;mySecondFrame(String nameOfFrame){super(nameOfFrame);/* Create the panel, and make it white */mainPanel = new JPanel();mainPanel.setBackground(Color.white);Container contentPane = getContentPane();contentPane.add(mainPanel);setSize(400,300);setVisible(true);this.setDefaultCloseOperation(EXIT_ON_CLOSE);}public static void main(String args[]){mySecondFrame msf = new mySecondFrame(“White Frame!”);}}// A complete version of this code is in
MySecondFrame.java
![Page 13: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/13.jpg)
Setting up our JPanelclass mySecondFrame extends JFrame{JPanel mainPanel;mySecondFrame(String nameOfFrame){ super(nameOfFrame); /* Create the panel, and make it white */ mainPanel = new JPanel(); mainPanel.setBackground(Color.white); Container contentPane = getContentPane(); contentPane.add(mainPanel); setSize(400,300); setVisible(true); this.setDefaultCloseOperation(EXIT_ON_CLOSE);}public static void main(String args[]){ mySecondFrame msf = new mySecondFrame(“White Frame!”);}}// A complete version of this code is in// MySecondFrame.java
![Page 14: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/14.jpg)
TableCloth Analogy
● Think of the JFrame as being the table, and the JPanel as being the tablecloth.
● You must/should have the JPanel on before you can add anything else.
● Secondly, everything you add will go onto the JPanel.
● We can (and should) of course, make our own JPanels using inheritance. But first, lets look at GUI components.
![Page 15: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/15.jpg)
GUI Components 1
JButton
Buttons are used to perform actions, e.g. Print, Close, etc
![Page 16: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/16.jpg)
GUI Components 1
JTextField
TextFields are used for receiving arbitrary input from the user.
![Page 17: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/17.jpg)
GUI Components 1
JCheckBox
For boolean options e.g. Smoker?Vegetarian?
![Page 18: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/18.jpg)
GUI Components 1
JRadioButton
Each JRadioButton is a member of the same ButtonGroup.This makes sure only one of them can be picked at any time. Radio Buttons are used for
choosing one from few. E.g. Windows, Linux , Apple
![Page 19: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/19.jpg)
GUI Components 1
JLabelLabels are used to annotate GUIs and explain what each component modifies
![Page 20: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/20.jpg)
GUI Components 1
JScrollBarTypically used for choosing percentages etc. Popular in Art programs.
![Page 21: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/21.jpg)
So, lets see how do we use them
● Thats the first set of GUI Components that we'll get to grips with. What we are going to do is create a subclass of JPanel that has them all sitting inside it.
● They each have their own constructors (all pretty similar though)
● Lets have a look at myFirstPanel.java (goto text editor)
![Page 22: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/22.jpg)
But des, they're all over the shop!!!
● Yes, they are added in an ad-hoc fashion alright.
● To manage the Layout, we need a Layout manager.
● Again, there are several different types of these we will only look at a few.
![Page 23: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/23.jpg)
The FlowLayout Manager
● FlowLayout just adds the component in a left to right fashion, and wraps at the edge of the frame. This is the one we have seen thus far.
● Just like text in an editor, you can also tell it to left|right align or justify.
● Useful only for small panels of components, doesn't work for complicated arrangements.
● this.setLayout(new FlowLayout());
![Page 24: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/24.jpg)
The Grid Layout Manager
● Arranges components in a grid fashion, you specify the number of rows and columns.
● It presumes all objects are of equal size, this is usually a woeful presumption. Good for splitting interfaces into 2 halves.
● Has some nice uses, calendars, calculators etc.
● this.setLayout(new GridLayout(3,4));// 3 rows, 4 columns etc
![Page 25: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/25.jpg)
BorderLayout()
● Arranges components based on the borders, e.g. You can add to N,S,E,W and Center.
● Has limited uses, handy for adding toolbars etc.
![Page 26: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/26.jpg)
GridBagLayout
● Used for creating really complicated GUIs, is as a result pretty tricky.
● You can use it to set relative sizes etc. (e.g. Make this JTextfield three times the size of that one )
● Can usually be avoided, or at least simplified.
● Automated GUI builders use it.
![Page 27: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/27.jpg)
The best way to build GUIS
● Break the GUI down into different parts, and keep breaking them down until all sub-parts are simple enough.
● Then build the individual components and put the interface components.
● We use JPanels for this, we've already seen how to extend Panels, so we create the sort of Panels we want, then add them all together.
![Page 28: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/28.jpg)
Calculator, a simple useful GUI
JPanel containing one big JTextField
JPanel containing 4 JButtons, using FlowLayout
JPanel containing 24 JButtons arranged in a 4 x 6 GridLayout. (sort of)
Don't worry about the menu at the top, JMenu(which we haven't seen yet) will always goto thetop , unless you tell it otherwise.
![Page 29: Java GUI Programming - Maynooth Universitydtraynor/cs211/lecture13/lecture13.pdf · Java: The Background Java is a new relatively new language, its original popularity was due to](https://reader030.vdocuments.us/reader030/viewer/2022040501/5e23764319472b5cfd7e7e4b/html5/thumbnails/29.jpg)
End Of Lecture
● You should now know– What this course is all about
– What Swing is
– How to make a simple Frame
– How we will be using inheritance for GUIs
– The basic GUI components
– How to place a panel in a frame and add stuff
– Some Layout Managers, and what they do. ● Next we will create a Calculator GUI from scratch