Computer Science [3] Java Programming II - Laboratory Course Lab 4 -1 : Introduction to Graphical user interface GUI Components Faculty of Engineering & IT Software Engineering Department Eng.Omar Al-Nahal Eng.Omar Al-Nahal

Introduction to Graphical user interface (GUI) Review Introduction to Graphical user interface (GUI) Review Simple GUI-Based Input/Output with JOptionPane - Review

Output JOptionPane Message Dialog Constants

4 GUI Elements b The key elements of a Java graphical user interface are: GUI componentsGUI components layout managerslayout managers event processingevent processing b GUI components, such as text fields and buttons, are the screen elements that a user manipulates with the mouse and keyboard b Layout managers govern how the components appear on the screen. b Events signal important user actions.

5 Containers b A container is a special category of GUI components that group other components. b All containers are components, but not all components are containers. b An applet is a container. b Therefore,buttons, text fields, and other Component can be added to an applet to be displayed. b Each container has an associated layout manager to control the way components in it are displayed.

6 Containers b Some containers must be attached to another graphical surface: PanelPanel AppletApplet b Other containers can be moved independently: WindowWindow FrameFrame DialogDialog

7 Containers Component Container Window Panel Dialog Frame Applet

Some basic GUI components. Swing Overview Classes from package javax.swing defines various GUI components objects with which the user interacts via the mouse, the keyboard or another form of input.

Component Object Container Window Frame JFrameJComponent JPanel JLabelJMenuBar AbstractButton JButton JMenu JMenuItem JTextFieldJTextArea JTextComponent Hierarchy of Swing Classes AWT Swing Class Abstract Class Layout manager classes are in the AWT.

Swing Overview b Common superclasses of many of the Swing components  Component class Operations common to most GUI components are found in Component class.Operations common to most GUI components are found in Component class.  Container class Two important methods originates in this classTwo important methods originates in this class –add — adds components to a container. –setLayout — enables a program to specify the layout manager that helps a Container position and size its components. java.lang.Object java.awt.Container Javax.swing,JComponent java.awt.Component

JLabel A label is a display area for a short text, an image.

JLabel Constructors The constructors for labels are as follows: JLabel() JLabel(String text, int horizontalAlignment) JLabel(String text) JLabel(Icon icon) JLabel(Icon icon, int horizontalAlignment) JLabel(String text, Icon icon, int horizontalAlignment ) See Label.java

Text Areas JTextFields, JPasswordFields & Text Areas. A text field is an input area where the user can type in characters. Text fields are useful in that they enable the user to enter in variable data. A text field is an input area where the user can type in characters. Text fields are useful in that they enable the user to enter in variable data. A text area is similar, but displays multiple lines of text They are defined by the TextField and TextArea classes A text area automatically has scrollbars on its bottom.

JTextField Constructors b b JTextField(int columns) Creates an empty text field with the specified number of columns. b b JTextField(String text) Creates a text field initialized with the specified text. b b JTextField(String text, int columns) Creates a text field initialized with the specified text and the column size.

JTextField Methods getText() Returns the string from the text field. setText(String text) Puts the given string in the text field. setEditable(boolean editable) Enables or disables the text field to be edited. By default, editable is true. setColumns(int) Sets the number of columns in this text field. See Area.java See JTextField.javaSee TestJText.java See TestArea.java

Buttons JButton inherits AbstractButton and provides several constructors to create buttons. JButton Constructors The following are JButton constructors: JButton() JButton(String text) JButton(String text, Icon icon) JButton(Icon icon) See JButton.java

JCheckBox JCheckBox inherits all the properties such as text, icon, mnemonic, verticalAlignment, horizontalAlignment, horizontalTextPosition, verticalTextPosition, and selected from AbstractButton, and provides several constructors to create check boxes. See CheckBox.java

JRadioButton Radio buttons are variations of check boxes. They are often used in the group, where only one button is checked at a time. See JRadio.java

JComboBox A combo box is a simple list of items from which the user can choose. It performs basically the same function as a list, but can get only one value. JComboBox Methods To add an item to a JComboBox jcbo, use jcbo.addItem(Object item) To get an item from JComboBox jcbo, use jcbo.getItem() See ComBobox.java

Menus   Java provides several classes— JMenuBar, JMenu, JMenuItem, JCheckBoxMenuItem, and JRadioButtonMenuItem —to implement menus in a frame. b b A JFrame or JApplet can hold a menu bar to which the pull-down menus are attached. b b Menus consist of menu items that the user can select (or toggle on or off). Menu bars can be viewed as a structure to support menus.

Menu Demo The JMenuBar Class A menu bar holds menus; the menu bar can only be added to a frame. Following is the code to create and add a JMenuBar to a frame: The Menu Class You attach menus onto a JMenuBar. The following code creates two menus, Operation and Help, and adds them to the JMenuBar See Menu.java

The JMenuItem Class You add menu items on a menu. JMenuBar menubar; JMenu menu1, menu2, submenu; JMenuItem task1, task2, task3, task4, task5,task6,task7; The The Sub menus You can add submenus into menu items submenu.add(task1= new JMenuItem("Addition")); submenu.add(task2= new JMenuItem("subtraction")); submenu.add(task6= new JMenuItem("Multiplication")); submenu.add(task7= new JMenuItem("Qutation"));