Graphical User Interface (GUI)

Graphical User Interface (GUI)

1. Interaction Channel between User and System

   • User
     • Actions
   • View
     • Outputs
     • Controller
       • Model

2. Standalone

   • Run in Computer
     • JAVA Swing

3. Web

   • Run in Browser
     • HTML
     • JS
     • CSS

4. Mobile

   • Run on Cellphone
     • IOS
     • Windows
     • Andriod

5. Key: Usability

   • Gestalt Principles
     • Intuitive
     • Clear
     • Friendly

6. Containers

   • Frame (Primary Container)
     • Minimize
     • Close
     • Move
     • Maximize
     • JFrame
       • setSize(width, height)
         • Set Frame Width, Height
       • setResizable(boolean input)
         • User Size Modification
       • setDefaultCloseOperation(EXIT_ON_CLOSE)
         • End Execution
       • setVisible(boolean input)
         • Set Frame Visibility to User
       • add(GUI component
         • Add GUI Component to Frame
   • Panels
     • Contain, Divide Elements in Frame
     • Group Element based on Purpose

7. Graphical Distributors

   • Layouts
     • Border
       • Based on Compass
         • setLayout(new BorderLayout())
         • add(GUI component, BorderLayout.direction)
     • Grid
       • Columns and Rows
         • setLayout(new GridLayout(rows, columns))
           • add(GUI component)

8. Interaction

   • Active
     • Allow User Interaction
   • Inactive
     • Display Information

9. Data Input

10. Message Managment

    • Error
    • Info
    • Warning
    • JOptionPane