Java Layouts CSIS 3701: Advanced Object Oriented Programming

Adding Components to Surface ContentPane –Member variable representing visible surface of app –Accessed with getContentPan e method –Add JPanel to surface and add components to it Application ContentPane getContentPane() JPanel add

Adding Components to Surface // Create a new visual panel and add it to the // surface (the ContentPane) of the application. JPanel mainPanel = new JPanel(); getContentPane().add(mainPanel); // Add the button and textfield to // panel to make them visible. mainPanel.add(helloButton); mainPanel.add(responseField);

Component Positioning Positioning: Determining where/how components displayed on surface of JPanel –Location: x and y position (relative to top left corner of panel) –Size: width and height in pixels y x width height

Component Positioning Absolute Positioning –Manually setting x, y position and width, height –Often done in IDEs using “drag and drop” from “toolbox” Layout-based Positioning –Automatically setting position based on rules –Positions, sizes of components based on: Size of container Preferences about relative positions of components

Absolute Positioning Sizes of applications not fixed –Screen resolution –Browser propertied (if applet) –Manual user resizing Problem: Components may not be visible if application resized

Layout-based Positioning Automatically adapts to size of container –Shifting component positions –Resizing components –Depends on rules used by container layout Shifting components Resizing components

Layout Objects Layout objects: –Contain rules for determining where component placed on surface of panel –Contain rules for setting size of components –In java.awt.* package Key question: should component be natural size –Just large enough for text, etc. to be drawn on surface Natural sizes Sizes adjusted based on panel

Layout Objects Layouts are objects of different types –Must be constructed with desired parameters Passed to containers as parameters –Usually to constructor JPanel P = new JPanel(new FlowLayout()); –Can also later use setLayout method New layout object Passed to JPanel constructor

Layout Objects Layout objects used by container when new component added to surface JPanel object Layout object add(b) Where should I add b ? x, y position What should b ’s size be? width, height

FlowLayout Class Components added to container in “left to right” order –Kept on same “line” –“Auto wrapped” when reach edge of container –Centered on line Components kept natural size JPanel P = new JPanel(new FlowLayout()); P.add(b1); P.add(b2); P.add(b3); P.add(b4); P.add(b5); P.add(b6); b1b2 b3 b4 b6 b5

GridLayout Class Container divided into grid of cells of equal size –Rows, columns set in constructor Components added to container in “row major” order Components resized to fit cell –Text may be abbreviated if necessary JPanel P = new JPanel(new GridLayout(3, 2)); P.add(b1); P.add(b2); P.add(b3); P.add(b4); P.add(b5); P.add(b6); b1 b2 b3 b5b6 b4

BorderLayout Class Container divided into 5 areas Must specify location to place component in overloaded add method JPanel P = new JPanel(new BorderLayout()); P.add(b1, BorderLayout.SOUTH); P.add(b2, BorderLayout.WEST); P.add(b3, BorderLayout.NORTH); P.add(b4, BorderLayout.EAST); P.add(b5, BorderLayout.CENTER); Static constants in BorderLayout class used NORTH SOUTH WESTEASTCENTER

BorderLayout Class Sizing rules: –NORTH, SOUTH : natural height width of entire container –EAST, WEST : natural width height of container (minus NORTH, SOUTH ) –CENTER : leftover area after NORTH, SOUTH, EAST, WEST b1 b3 b2 b5b4

Layout Advantages/Disadvantages FlowLayout –Advantage: components natural size –Disadvantage: no guarantee components next to one another if “wrapped” GridLayout –Advantage: fixed component positions –Disadvatage: unnatural component sizes BorderLayout –Advantage: fixed component positions –Disadvatage: unnatural component sizes, only 5 positions

Layout Design Can nest panels inside one another JPanel mainPanel = new JPanel(new BorderLayout()); JPanel subPanel = new JPanel(new GridLayout(4,2)); mainPanel.add(subPanel, BorderLayout.EAST); Can choose layout for each panel to achieve best effects –Often give GridLayout single row or column –Often only use parts of BorderLayout subPanel mainPanel

Layout Design Example: “File loader” application Requirements: –“File” and text area must be adjacent and natural size –LOAD and SAVE buttons must be adjacent and same size –text area and button can be above or next to one another

Layout Design Create panel ( filePanel ) for “File” and text area –Use a BorderLayout with “File” to west and text in center Create panel ( buttonPanel ) for buttons –Use a GridLayout with one row and two columns Create panel ( mainPanel ) for subpanels –Use a FlowLayout for flexibility filePanel buttonPanel

Layout Design // Visual components fileField = new JTextField(15); loadButton = new JButton("LOAD"); saveButton = new JButton("SAVE"); // Main panel to which we add the subpanels JPanel mainPanel = new JPanel(new FlowLayout()); getContentPane().add(mainPanel); setSize(250, 100);

Layout Design // Subpanel for label and file textfield JPanel filePanel = new JPanel(new BorderLayout()); filePanel.add(new JLabel(" File: "), BorderLayout.WEST); filePanel.add(fileField, BorderLayout.CENTER); // Subpanel for buttons, which should be same size JPanel buttonPanel = new JPanel(new GridLayout(1, 2)); buttonPanel.add(loadButton); buttonPanel.add(saveButton); // Add the subpanels to the main panel mainPanel.add(filePanel); mainPanel.add(buttonPanel);

Absolute Positioning Can use absolute positioning in Java –Set layout of container to null JPanel P = new JPanel(null); –Add components as usual P.add(b1); P.add(b2); P.add(b3);

Absolute Positioning Use setBounds method to set position and size setBounds(int x, int y, int w, int h) b1.setBounds(10, 10, 80, 40); b2.setBounds(100, 10, 50, 40); b3.setBounds(10, 60, 200, 40);