Java Swing Layout Management

1
Java Swing Layout Management
2
Laying out components

• Manage realized components
• Determine size and position
• Each container has a layout manager
• (usually)

3
Layout managers general aspects

• Creating a layout manager
• Consulting managers
• Types of managers
• Choosing managers
• Other features of component layout
• All Covered very well here
• http//java.sun.com/docs/books/tutorial/uiswing/la
  yout/using.html

4
Creating a layout manager

• Default layout managers
• JFrame, JDialog, JApplet have BorderLayout
• JPanel has FlowLayout
• Except when used as a Content Pane (Border
  Layout)
• Setting the layout manager for a container
• JFrame frame new JFrame()
• frame.setLayout(new FlowLayout())
• JPanel contentPane new JPanel()
• contentPane.setLayout(new BorderLayout())

5
Consulting layout managers (1)

• Consulted automatically when container may need
  to change its appearance.
• These methods result in consultation, but DONT
  trigger new layout
• add(), remove(), removeAll()
• getAlignmentX(), getAlignmentY()
• getPreferredSize(), getMinimumSize(),
  getMaximumSize()

6
Consulting layout managers (2)

• These methods actually result in the manager
  performing layout.
• JFrame.pack()
• Causes this Window to be sized to fit the
  preferred size and layouts of its subcomponents.
• JFrame.show() JFrame.setVisible(true)
• Shows the component
• JComponent.revalidate()
• This method will automatically be called on this
  component when a property value changes. Looks
  for all dependent components and calls validate()
  on them. Validate() causes a container to lay
  out its subcomponents again

7
Layout managers - types

• BorderLayout
• BoxLayout
• FlowLayout
• GridLayout
• GridBagLayout
• CardLayout

8
BorderLayout

• Five areas
• NORTH, SOUTH, EAST, WEST and CENTER
• Not all areas must be used
• Do not assume a default area for components
• Centre gets as much area as possible
• Specify location as argument of add method
• pane.setLayout(new BorderLayout())
• pane.add(new JButton(Button 1 (NORTH)),
  BorderLayout.NORTH)
• Setting gaps between components (default 0)
• BorderLayout.setHgap(int gap)
• BorderLayout.setVgap(int gap)
• BorderLayout(int horizontalGap, int verticalGap)
  - Constructor

9
BorderLayout

• import java.awt.
• import java.awt.event.
• import javax.swing.
• public class BorderWindow extends JFrame
• public BorderWindow()
• //--- use default content pane
• Container contentPane getContentPane()
• //--- Use the content pane's default
  BorderLayout.
• //--- contentPane.setLayout(new
  BorderLayout()) //unnecessary
• //--- under 1.5 can just commented out line as
  content pane
• //--- is implcitly obtained
• //--- add(new JButton("Button 1 (NORTH)"),
• //--- BorderLayout.NORTH)

10
BorderLayout

• contentPane.add(new JButton("Button 1 (NORTH)"),
• BorderLayout.NORTH)
• contentPane.add(new JButton("2
  (CENTER)"),
• BorderLayout.CENTER)
• contentPane.add(new JButton("Button 3
  (WEST)"),
• BorderLayout.WEST)
• contentPane.add(new JButton("Long-Named
  Button 4 (SOUTH)"),
• BorderLayout.SOUTH)
• contentPane.add(new JButton("Button 5
  (EAST)"),
• BorderLayout.EAST)
• setDefaultCloseOperation(EXIT_ON_CLOSE)

11
BorderLayout

• public static void main(String args)
• BorderWindow window new BorderWindow()
• window.setTitle("BorderLayout")
• window.pack()
• window.setVisible(true)

12
BoxLayout (1)

• Components on top / next to each other
• Direction is your choice
• Tries to size components at preferred height for
  Y_AXIS or width for X_AXIS
• Width as largest component width
• See above picture

13
BoxLayout (2)

• Space fillers
• Rigid - fixed-size space between two components
• Glue - taking up no space unless you pull apart
  the components that it's sticking to. Helps
  reposition extra space (default is at end)
• Custom - Use this to specify a component with
  whatever minimum, preferred, and maximum sizes
  you want

14
BoxLayout (3)

• Component sizes
• Respect Max, Min and Preferred Sizes of
  components
• Alignment
• Comes into play when not all components are the
  same width
• Can specify Left (0), Centre (0.5) or Right (1).
  Or Top Middle Bottom
• If you are having layout problems, first treat as
  an Alignment issue, then examine sizes.

15
BoxLayout

• import java.awt.
• import java.awt.event.
• import javax.swing.
• public class BoxWindow extends JFrame
• public BoxWindow()
• Container contentPane getContentPane()
• contentPane.setLayout(new
  BoxLayout(contentPane,
• 
  BoxLayout.Y_AXIS))
• addAButton("Button 1", contentPane)
• addAButton("2", contentPane)
• addGlue(contentPane)
• addAButton("Button 3", contentPane)
• addCustomFiller(contentPane)
• addAButton("Long-Named Button 4",
  contentPane)
• addAButton("Button 5", contentPane)

16
BoxLayout

• import java.awt.
• import java.awt.event.
• import javax.swing.
• public class BoxWindow extends JFrame
• public BoxWindow()
• Container contentPane getContentPane()
• contentPane.setLayout(new
  BoxLayout(contentPane,
• 
  BoxLayout.Y_AXIS))
• addAButton("Button 1", contentPane)
• addAButton("2", contentPane)
• addGlue(contentPane)
• addAButton("Button 3", contentPane)
• addCustomFiller(contentPane)
• addAButton("Long-Named Button 4",
  contentPane)
• addAButton("Button 5", contentPane)

17
BoxLayout

• import java.awt.
• import java.awt.event.
• import javax.swing.
• public class BoxWindow extends JFrame
• public BoxWindow()
• private void addAButton(String text,
  Container container)
• JButton button new JButton(text)
• button.setAlignmentX(Component.CENTER_ALIG
  NMENT)
• container.add(button)
• public void addGlue(Container container)
• container.add(Box.createVerticalGlue())

18
BoxLayout

• import java.awt.
• import java.awt.event.
• import javax.swing.
• public class BoxWindow extends JFrame
• public static void main(String args)
• BoxWindow window new BoxWindow()
• window.setTitle("BoxLayout")
• window.pack()
• window.setVisible(true)

19
FlowLayout

• Very simple - JPanels default
• Components in row(s)
• At preferred size
• Alignment
• FlowLayout.LEFT
• FlowLayout.CENTRE
• FlowLayout.RIGHT
• Gaps
• Default 5
• Specifying - setter hGap vGap methods or via
  constructor

20
FlowLayout

• public class FlowWindow extends JFrame
• public FlowWindow()
• Container contentPane getContentPane()
  
• //contentPane.setLayout(new FlowLayout())
• //default centre, 5, 5
• contentPane.setLayout(new FlowLayout(FlowLayou
  t.RIGHT, 30, 5))
• contentPane.add(new JButton("Button 1"))
• contentPane.add(new JButton("2"))
• contentPane.add(new JButton("Button 3"))
• contentPane.add(new JButton("Long-Named
  Button 4"))
• contentPane.add(new JButton("Button 5"))
• setDefaultCloseOperation(EXIT_ON_CLOSE)

21
FlowLayout

• public static void main(String args)
• FlowWindow window new FlowWindow()
• window.setTitle("FlowLayout")
• window.pack()
• window.setVisible(true)

22
GridLayout

• Grid of cells - all same size
• Components take all space in a cell
• Gaps
• default 5
• use setter methods hGap and vGap
• or via arguments to constructor
• Re-sizing
• Cells resize to be as large as possible in given
  window / container

23
GridLayout

• public class GridWindow extends JFrame
• public GridWindow()
• Container contentPane getContentPane()
• //contentPane.setLayout(new
  GridLayout(0,2))
• contentPane.setLayout(new GridLayout(0,3,20,20
  ))
• contentPane.add(new JButton("Button 1"))
• contentPane.add(new JButton("2"))
• contentPane.add(new JButton("Button 3"))
• contentPane.add(new JButton("Long-Named
  Button 4"))
• contentPane.add(new JButton("Button 5"))
• setDefaultCloseOperation(EXIT_ON_CLOSE)

24
GridBagLayout (1)

• Very flexible (and complex!)
• Rows can have different heights
• Columns can have different lengths
• Uses cells in a grid

GridBagLayout gridbag new GridBagLayout() GridB
agConstraints c new GridBagConstraints() JPane
l pane new JPanel() pane.setLayout(gridbag) /
/--- For each component to be added to this
container //--- ...Create the component... //---
...Set instance variables in the
GridBagConstraints instance... gridbag.setConstrai
nts(theComponent, c) pane.add(theComponent)
25
GridBagLayout (2)

• Constraints
• set in an instance of a gridBagConstraints Object
• gridx and gridy - The row and column of the upper
  left of the component
• Anchor - Where to display within cell when
  component is smaller than it
• fill - How to size component when cell is larger
  than components requested size
• insets - External padding - min space between
  component and cell edges
• ipadx, ipady - Internal padding - What to add to
  min size of components
• weightx and weighty - How to distribute extra
  space (padding)
• gridwidth and gridheight - Number of columns or
  rows the component uses
• More explanation here
• http//java.sun.com/docs/books/tutorial/uiswing/la
  yout/gridbagConstraints.html
• Example explained very well here
• http//java.sun.com/docs/books/tutorial/uiswing/la
  yout/gridbagExample.html

26
GridBagLayout

• public class GridBagWindow extends JFrame
• public GridBagWindow()
• JButton button
• Container contentPane getContentPane()
• GridBagLayout gridbag new
  GridBagLayout()
• GridBagConstraints c new
  GridBagConstraints()
• contentPane.setLayout(gridbag)
• //set all components to fill all
  available Horzontal space
• c.fill GridBagConstraints.HORIZONTAL
• button new JButton("Button 1")
• c.weightx 0.5
• c.gridx 0
• c.gridy 0
• gridbag.setConstraints(button, c)
• contentPane.add(button)

27
CardLayout

• Manages objects (usually JPanels) in sets
• Works much like tabbed pane
• Choose cards by
• Asking for card in order added to container
• Going backwards or forwards
• Specifying card by name

28
CardLayout

• public class CardWindow extends JFrame
• implements ItemListener
• JPanel cards
• final static String BUTTONPANEL "JPanel
  with JButtons"
• final static String TEXTPANEL "JPanel with
  JTextField"
• public CardWindow()
• Container contentPane getContentPane()
• //Put the JComboBox in a JPanel to get a
  nicer look.
• String comboBoxItems BUTTONPANEL,
  TEXTPANEL
• JPanel cbp new JPanel()
• JComboBox c new JComboBox(comboBoxItems)
  
• c.setEditable(false)
• c.addItemListener(this)
• cbp.add(c)
• //Use the default layout manager,
  BorderLayout

29
Choosing layout managers (1)

• In order to display a component in as much space
  as it can get, consider
• BorderLayout
• Component in centre
• GridBagLayout
• fillGridBagConstraints.BOTH
• BoxLayout
• Component specifies very large preferred/maximum
  sizes

30
Choosing layout managers (2)

• To display a few components in a compact row
• JPanels default FlowLayout
• BoxLayout
• Display a few components of the same size in rows
  and columns
• GridLayout

31
Choosing layout managers (3)

• Display a few components in a row or column, with
  different spacing between them and custom
  component sizes
• BoxLayout
• Display a complex layout that has many components
• GridBagLayout
• Using JPanel grouping and hierarchies

32
Layout managers - other layout features

• Absolute positioning of components
• When
• How
• Customising layout managers
• When
• How

33
Absolute positioning (1)

• Dont do it unless
• component size isnt affected by container size
  or font looknfeel changes
• e.g. desktop panes containing internal frames
• custom container performs size position
  calculations particular to container
• e.g. split panes

34
Absolute positioning (2)

• Key points from NoneWindow.java
• Instruct window to use no Layout
• .contentPane.setLayout(null)
• Set components size and position with
• XYZ.setBounds(x, y, width, height)
• Set window size with
• window.setSize(x, y)

35
Absolute positioning

• public class NoneWindow extends JFrame
• private JButton b1, b2, b3
• public NoneWindow()
• Container contentPane getContentPane()
• contentPane.setLayout(null)
• b1 new JButton("one")
• contentPane.add(b1)
• b2 new JButton("two")
• contentPane.add(b2)
• b3 new JButton("three")
• contentPane.add(b3)
• b1.setBounds(25, 5, 75, 20)
• b2.setBounds(55, 35, 75, 20)
• b3.setBounds(300, 200, 75, 30)
• setDefaultCloseOperation(EXIT_ON_CLOSE)

36
Custom layout managers (1)

• Ensure no existing manager does the job
• GridBagLayout / BoxLayout
• Layout manager downloads
• If your trying to do it, chances are someone else
  has done it already
• DECLARE use of external code in coursework

37
Custom layout managers (2)

• Create class which implements Layout Manager
  interface
• e.g. public class myManager implements
  LayoutManager
• Must have 5 methods required by interface
• void addLayoutComponent(String, Component)
• void removeLayoutComponent(Component)
• Dimension preferredLayoutSize(Container)
• Dimension minimumLayoutSize(Container)
• void layoutContainer(Container)
• See below URL for more documentation
• http//java.sun.com/docs/books/tutorial/uiswing/la
  yout/custom.html

38
Summary

• Creating a layout manager
• Consulting managers
• Types of managers
• BorderLayout GridLayout
• BoxLayout GridBagLayout
• FlowLayout CardLayout
• Choosing managers
• Absolute positioning
• Custom layout managers
• Next Abstract Model Widgets