1 / 27

Programming 2 LAB

Programming 2 LAB. TA: Nouf Al-Harbi NoufNaief.net ::: nouf200@hotmail.com. Lab 5. Introduction to GUI. GUI stands for Graphical User Interface . GUI. A GUI component is an object that represents a screen element such as a button or a text field

rodney
Télécharger la présentation

Programming 2 LAB

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Programming 2 LAB TA: Nouf Al-Harbi NoufNaief.net ::: nouf200@hotmail.com

  2. Lab 5 Introduction to GUI

  3. GUI stands for Graphical User Interface GUI

  4. A GUI component is an object that represents a screen element such as a button or a text field • GUI-related classes are defined primarily in the java.awt and the javax.swing packages • The Abstract Windowing Toolkit (AWT) was the original Java GUI package • The Swing package provides additional and more versatile components • Both packages are needed to create a Java GUI-based program GUI Components

  5. A label is a GUI component that displays a line of text and/or an image GUI Components

  6. A buttonis is a GUI component that generates an action event GUI Components

  7. A text fieldallows the user to enter one line of input GUI Components

  8. A check box is a button that can be toggled on or off GUI Components

  9. A group of radio buttonsrepresents a set of mutually exclusive options – only one can be selected at any given time GUI Components

  10. A dialog box is a window that appears on top of any currently active window GUI Components

  11. An image icon is a fixed-size picture; typically it is small and used to decorate components. • Java currently supports three image formats: GIF, JPEG and PNG. • To display an image icon, first create an ImageIconobject using new javax.swing.ImageIcon(filename). • For example, the following statement creates an icon from an image file us.gif in the image directory under the current class path: • ImageIcon icon = new ImageIcon("image\us.gif"); GUI Components

  12. A GUI container is a component that is used to hold and organize other components • A frameis a container displayed as a separate window with a title bar • It can be repositioned and resized on the screen as needed • A panelis a container that cannot be displayed on its own but is used to organize other components • A panel must be added to another container (like a frame) to be displayed GUI Containers

  13. Displaying Three Cards Example

  14. Display a framethat contains three labels. Each label displays a card, as shown in the figure below. The card image files are named 1.png, 2.png, ..., 54.png and stored in the image/card directory. All three cards are distinct and selected randomly. Displaying Three Cards

  15. To create a user interface, you need to create either a frame or an applet to hold the user-interface components. Create GUI

  16. import javax.swing.*; import java.awt.*; 1- import swing & awtclasses that will be used in the code

  17. 2- create a frame & adjust its properties

  18. Title bar Content pane Output…

  19. You should invoke the setSize(w, h) method before invoking setLocationRelativeTo(null) to center the frame Notes …

  20. Adding Components to a Frame

  21. The Java GUI components are placed in containers, where they are arranged by the container’s layout manager. • In the preceding program, you did not specify where to place the Labels in the frame, but Java knows where to place them, because the layout manager works behind the scenes to place components in the correct locations. • A layout manager is created using a layout manager class. Layout Managers

  22. Layout Managers : FlowLayout • FlowLayoutis the simplest layout manager. • The components are arranged in the container from left to right in the order in which they were added. • When one row is filled, a new row is started. • You can specify the way the components are aligned by using one of three constants: • FlowLayout.RIGHT • FlowLayout.CENTER • FlowLayout.LEFT • You can also specify the gap between components in pixels.

  23. Layout Managers : GridLayout • The GridLayout manager arranges components in a grid (matrix) formation. • The components are placed in the grid from left to right, starting with the first row, then the second, and so on, in the order in which they are added.

  24. Setting the Layout

  25. Display images in labels

  26. Display cards randomly

  27. End of Lab 5

More Related