图形用户界面的设计.ppt
第七讲 图形用户界面的设计与实现,布局管理器,回忆前面的程序,向一个面板中加了三件按钮,所有的按钮都是排成一行。如果加更多,直到一行排不了,分行。按钮总是居中显示。实际上,是有一个布局管理器在背后起作用。只要是容器都可以更改布局。,FlowLayout流式布局,上例中的JPanel就是。Java.awt.Container setLayout(LayoutManger m)Java.awt.FlowLayout FlowLayout(int align)新的流式布局 align-可选LEFT(左),CENTER(中),RIGHT(右)FlowLayout(int aligh,int hgap,int vgap)hgap-水平间隙(负值强制相互重叠)vgap-重直,BorderLayout 边框布局,North,Center,East,West,South,BorderLayout,这是每个JFrame的内容窗格的默认布局管理器。它和流布局管理器完全控制每个组件的位置不同,边界布局管理器让你选择每个组件的摆放位置。你可以选择把组件放在内容窗格的中部、北部、南部、东部或者西部。,BorderLayout,1.Void add(Component c,Object Constraints)把一个组件添加到容器中。参数:c 添加的组件constraints 布局管理器理解的标识符2.BorderLayout(int hgap,int vgap)根据指定的组件水平和垂直间距来构造一个新的BorderLayout。参数:hgap水平间距(以像素为单位,如果为负,则强 制进行重叠)vgap垂直间距(以像素为单位,如果为负,则强 制进行重叠),BorderLayout,经常将面板和BorderLayout合在一起用。面板如同界面元素的小容器,并且在局面管理器的控制之下,它们自己能够排列在一个更大的面板中。例如,你可以把一个面板放在南边用于容纳按钮,而另一个面板放在中部用于显示文本JPanel(LayoutManager m)为面板设置布局管理器显示几个按钮,以窗体下方对齐。,示例,Container contentPane=getContentPane();JPanel panel=new JPanel();JButton yellowButton=new JButton(yellow);JButton blueButton=new JButton(blue);JButton redButton=new JButton(red);panel.add(yellowButton);panel.add(blueButton);panel.add(redButton);。Container contentPane=getContentPane();contentPane.add(panel,BorderLayout.SOUTH);,网格布局管理器,网格布局按行列来排列所有的组件,就像电子数据表一样。然而,对于网格布局。各个单元总是一样的大小。例如:设定行列数 panel.setLayout(new GridLayout(5,4);添加组件,从第一行的第一列开始,然后是第一行的第二列,并这样持续下去。,网袋布局,网袋布局是所有的布局管理器中最强大的一种。在一个网袋布局中,行和列的尺寸均可改变,并且可以合并相邻的单元格来适应更大的组件。组件不需要填充整个单元格区域,并且可以指定单元格内的对齐方式。使用网袋布局管理器进行布局的步骤如下:创建一个GridBagLayout类型的对象把此GridBagLayout对象设成组件的布局管理器创建一个GridBagConstraints类型的对象对于每一个组件,填充GridBagConstraints对象,约束gridx,gridy,gridwidth,gridheight参数gridx,gridy值定义了添加组件左上角的行和列位置。而gridwidth,gridheight值指定了组件占用的行数和列数增量字段(weightx,weighty)设置单元格增量的最大值fill,anchor参数fill有个有效值:GridBagConstraints.NONE,GridBagConstraints.HORIZONTAL,GridBagConstraints.VERTICAL,GridBagConstraints.BOTH,anchor取值:GridBagConstraints.CENTER,GridBagConstraints.NORTH,GridBagConstraints.NORTHEAST,GridBagConstraints.EAST等等填塞(Insets,ipadx,ipady)Insets用来设置组件周围的空间量,这称作外部填塞,它有left,top,right,bottom个值ipadx,ipady的设置称作内部填塞。这两个值被加到组件的最小宽度和最小高度上,例子:,package src;import java.awt.*;import javax.swing.*;public class GridBagDemo extends JFrameJLabel face,size;JComboBox comboface,combosize;JCheckBox bold,italic;JTextArea text;public GridBagDemo()Container contentPane=getContentPane();GridBagLayout gridbag=new GridBagLayout();GridBagConstraints c=new GridBagConstraints();contentPane.setLayout(gridbag);,face=new JLabel(Face:);c.gridx=0;c.gridy=0;gridbag.setConstraints(face,c);contentPane.add(face);comboface=new JComboBox();comboface.addItem(Serif);c.gridx=1;c.gridy=0;c.ipadx=60;c.fill=GridBagConstraints.BOTH;gridbag.setConstraints(comboface,c);contentPane.add(comboface);,size=new JLabel(Size:);c.ipadx=0;c.ipady=0;c.gridx=0;c.gridy=1;gridbag.setConstraints(size,c);contentPane.add(size);combosize=new JComboBox();combosize.addItem(18);c.ipadx=60;c.gridx=1;c.gridy=1;c.fill=GridBagConstraints.BOTH;gridbag.setConstraints(combosize,c);contentPane.add(combosize);,bold=new JCheckBox(Bold:);c.ipady=30;c.gridx=1;c.gridy=2;c.gridheight=1;c.anchor=GridBagConstraints.CENTER;gridbag.setConstraints(bold,c);contentPane.add(bold);italic=new JCheckBox(Italic);c.gridx=1;c.gridy=3;gridbag.setConstraints(italic,c);contentPane.add(italic);,text=new JTextArea();text.setLineWrap(true);JScrollPane scroll=new JScrollPane(text);c.ipadx=0;c.gridx=2;c.gridy=0;c.gridheight=4;c.gridwidth=1;gridbag.setConstraints(scroll,c);contentPane.add(scroll);pack();setVisible(true);setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);public static void main(String args)new GridBagDemo();,弹簧布局,SprintLayout.Constraints getConstraints(Component c)得到给定组件的约束参数:c该布局管理器管理的组件或者容器之一void putConstraint(String endSide,Component end,Sprint s,String startSide,Component Start)void putConstraint(String endSide,Component end,int pad,String startSide,Componet start)设置end组件给定的边为一个弹簧,该弹簧是这样得到的:通过添加弹簧s,或者有pad尺寸的支柱到一个弹簧,此弹簧从end容器的左边到达start容器的给定边参数:endSide,startSideWEST,EAST,NORTH,SOUTH end添加弹簧的组件 s添加的弹簧 pad被加支柱的尺寸 start其他被加弹簧到达的组件,Spring getX()Spring getY()返回从窗口开始处到达约束组件西边或者北边结束处的弹簧Spring getWidth()Spring getHeight()返回跨越约束组件宽度或者高度的弹簧Spring getConstraint(String side)void setConstraint(String edge,Spring s)得到或者设置从容器开始处到达约束组件给定边界的弹簧参数:sideSprinLayout类的 WEST,EAST,NORTH,SOUTH常量之一 s被设置的弹簧static Spring constant(int preferred)用给定的首选值构造一个支柱.最小和最大值被设置为首选值,static Spring constant(int minimum,int preferred,int maximum)用给定的最小值,首选值和最大值构造一个弹簧static Spring sum(Spring s,Spring t)返回弹簧s和t的和static Spring max(Spring s,Spring t)返回弹簧s和t的最大值static Spring minus(Spring s)返回弹簧s的相反值int getMinimumValue()int getPreferredvalue()int getMaximumvalue()返回弹簧的最小值,首选值和最大值int getValue()void setValue(int newValue)得到或者设置弹簧的值例子:(SpringDemo.java),复杂的布局管理,箱式布局箱式布局要比网格布局灵活得多,它可以布置单行或单列组件。有一个容器Box类它的默认布局管理器是BoxLayout。static Box CreateHorizontalBox()static Box CreateVerticalBox()创建一个水平或垂直排列其内容的容器static Component createHorizontalGlue()static Component createVerticalGlue()static Component createGlue()创建一个能够在水平、垂直或者两个方向上无限延伸的不可见组件,static Component createHorizontalStrut(int width)static Component createVerticalStrut(int height)static Component createRigidArea(Dimension d)创建一个具有固定宽度、固定高度或者固定宽度和高度不可见组件float getAlignmentX()float getAlignmentY()返回x或y轴上的对齐方式,该值介于到之间。代表对齐到顶部或左边;0.5表示中间;代表对齐到底部或右边,例子:,package src;import java.awt.*;import javax.swing.*;public class BoxLayoutDemo extends JFrameJLabel lab_name,lab_password;JTextField text_name,text_password;JButton btn_Ok,btn_Cancel;Box box_name,box_pass,box_button,vbox;,public BoxLayoutDemo()lab_name=new JLabel(Name);lab_password=new JLabel(Password);text_name=new JTextField(10);text_name.setMaximumSize(text_name.getPreferredSize();text_password=new JTextField(10);text_password.setMaximumSize(text_password.getPreferredSize();btn_Ok=new JButton(OK);btn_Cancel=new JButton(Cancel);,box_name=Box.createHorizontalBox();box_name.add(lab_name);box_name.add(Box.createHorizontalStrut(10);box_name.add(text_name);box_pass=Box.createHorizontalBox();box_pass.add(lab_password);box_pass.add(Box.createHorizontalStrut(10);box_pass.add(text_password);box_button=Box.createHorizontalBox();box_button.add(btn_Ok);box_button.add(Box.createGlue();box_button.add(btn_Cancel);,vbox=Box.createVerticalBox();vbox.add(box_name);vbox.add(box_pass);vbox.add(Box.createGlue();vbox.add(box_button);Container contentPane=getContentPane();contentPane.add(vbox,BorderLayout.CENTER);pack();setSize(200,200);setVisible(true);public static void main(String args)new BoxLayoutDemo();,其它布局,不使用布局管理器不使用布局管理器可以把一个组件放在一个固定位置上(绝对定位)绝对定位的步骤:把布局管理器设为null把组件添加到容器中指定需要的位置和大小void setBounds(int x,int y,int width,int height)移动并缩放一个组件参数:x,y组件左上角的新位置 width,height组件的新尺寸,例子:package src;import java.awt.*;import javax.swing.*;public class LayoutnullDemo extends JFrameJButton first,second,third,fourth;public LayoutnullDemo()Container contentPane=getContentPane();contentPane.setLayout(null);first=new JButton(First);first.setBounds(10,10,70,30);second=new JButton(Second);,second.setBounds(120,10,90,30);third=new JButton(Third);third.setBounds(20,50,70,30);fourth=new JButton(Fourth);fourth.setBounds(100,70,90,30);contentPane.add(first);contentPane.add(second);contentPane.add(third);contentPane.add(fourth);pack();setSize(250,150);setVisible(true);setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);public static void main(String args)new LayoutnullDemo();,对话框,选项对话框Swing提供一些简单对话框用于收集用户的一些简单信息.JOptionPane有四个静态方法来显示这些简单对话框:showMessageDialog:显示一条消息并等待用户点击OKshowconfirmDialog:显示一条消息并得到确认showOptionDialog:显示一条消息并得到用户在一组选项中的选择showImputDialog:先是一条消息并得到用户的一行输入,例子:package src;import javax.swing.*;import java.awt.event.*;public class OptionDialogDemoJFrame frame;public OptionDialogDemo()frame=new JFrame();final JButton button=new JButton(Joption);,button.addActionListener(new ActionListener()public void actionPerformed(ActionEvent event)JOptionPane.showMessageDialog(frame,This is OptionPane,JOptionPane,JOptionPane.WARNING_MESSAGE););frame.getContentPane().add(button);frame.pack();frame.setVisible(true);frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);public static void main(String args)new OptionDialogDemo();,创建对话框在对话框的构造器中,调用基类JDialog的构造器添加该对话框的用户界面组件添加事件处理器设置对话框的大小例子:(DialogDemo.java),文件对话框,JFileChooser()创建一个可用于多个框架的文件选择对话框void setCurrentDirectory(File dir)为文件对话框设置初始目录void getSelectedFile()void getSelectedFiles()得到用户选择的一个或多个文件(如果用户不做任何选择,则返回null)string getName(File f)返回文件f的文件名,或者null,例子:package src;import java.awt.*;import java.awt.event.*;import javax.swing.*;public class FileChooserDemoJFileChooser filechooser;JFrame frame;public FileChooserDemo()JButton button=new JButton(Chooser);frame=new JFrame();,button.addActionListener(new ActionListener()public void actionPerformed(ActionEvent event)filechooser=new JFileChooser();int result=filechooser.showOpenDialog(frame);if(result=filechooser.OPEN_DIALOG)System.out.println(filechooser.getName(filechooser.getSelectedFile(););,frame.getContentPane().add(button,BorderLayout.SOUTH);frame.pack();frame.setVisible(true);frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);public static void main(String args)new FileChooserDemo();,颜色选择器,JColor Chooser()构造一个初始颜色为白色的颜色选择器Color getColor()void setColor(Color c)得到和设置该颜色选择器的当前颜色static Color showDialog(Component parent,string title,Color initialColor)显示一个包含一个颜色选择器的模式对话框参数:parent对话框显示在其上的组件 title对话框框架的标题 initialColor显示在颜色选择器中的初始颜色,static JDialog createDialog(Component parent,String title,boolean modal,JColorChooser chooser,ActionListener okListener)创建一个包含一个颜色选择器的对话框参数:parent对话框显示在其上的组件 title对话框框架的标题 modal如果该调用应该一直阻塞到对话框被关闭为止,那么该值为false chooser添加到该对话框中的颜色选择器 okListener,cancelListener OK和Cancel按钮的监听器,例子:package src;import java.awt.event.*;import java.awt.*;import javax.swing.*;public class ColorChooserDemoJButton button;JColorChooser colorchooser;JFrame frame;JPanel panel;JDialog dialog;,public ColorChooserDemo()frame=new JFrame();panel=new JPanel();button=new JButton(Color);colorchooser=new JColorChooser();dialog=JColorChooser.createDialog(frame,ColorChooser,false,colorchooser,new ActionListener()public void actionPerformed(ActionEvent e)panel.setBackground(colorchooser.getColor();,null);,button.addActionListener(new ActionListener()public void actionPerformed(ActionEvent event)dialog.show(););panel.setLayout(new GridLayout(2,1);panel.add(button);frame.getContentPane().add(panel);frame.pack();,frame.setVisible(true);frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);public static void main(String args)new ColorChooserDemo();,文本输入JTextField与JTextArea,在Java中,有两个组件用于文本输入:文本框和文本区。二者的区别在于文本框只能接受单行文本输入而文本区可以接受多行文本输入。对应单行文本输入的类为JTextField,而对应多行文本的类为JTextArea。,void setText(String t)改变一个文本组件中的文本参数:t新文本String getText()返回包含在该文本组件中的文本void setEditable(boolean b)决定用户是否能够编辑JTextComponent的内容,文本框,JTextField(int cols)参数:cols文本框的列数JTextField(String text,int cols)使用初始字符串和指定的列数来构造一个新的JTextField参数:text显示的文本 cols文本框的列数,int getLength()返回当前文档中的字符个数String getText(int offset,int length)返回文档中给定段所包含的文本,例:package src;import javax.swing.*;import java.awt.*;public class TextDemo extends JFramepublic TextDemo()Container contentPane=getContentPane();JPanel panel=new JPanel();JTextField text=new JTextField(TextField);,panel.add(text);contentPane.add(panel,BorderLayout.CENTER);pack();setSize(100,70);setVisible(true);public static void main(String args)new TextDemo();,密码框 JPasswordField,密码框是一种特殊的文本框。为了避免有心人看到密码,用户输入的字符实际上并没有显示出来。取代的方法是:每一个输入的字符被回显字符代替,一般是星号“*”。Swing提供的JPasswordField类实现了这种文本框。,JPasswordField(String text,int columns)创建一个新的密码框参数:text显示的文本如果没有则为null columns列数目void setEchoChar(char echo)设置密码框的回显字符char getPassword()返回包含在密码框内的文本,文本区,在一个文本区组件内,用户可以输入多行文本,换行的办法是使用ENTER键,在Java中每行都以一个n字符作为结尾。JTextArea(int rows,int cols)构造一个新文本区参数:rows行数 cols列数,JTextArea(String text,int rows,int cols)使用一个初始字符中来构造一个新文本区参数:text初始文本 rows行数 cols列数void setColumns(int cols)设置文本区应该使用的列数参数:cols列数,void setRows(int rows)设置文本区应该使用的列数参数:rows行数void append(String newText)把指定文本追加到文本区文本的末尾参数:newText需要追加的文本void setLineWrap(boolean wrap)打开或关闭换行参数:wrap如果需要换行则为true,void setWrapStyleWord(boolean word)如果word为true,那么换行发生在单词边界处。如果它为false,那么换行不考虑单词边界问题void setTabSize(int c)把跳格设为c列参数:c一个跳格的列数JScrollpane(Component c)创建一个显示指定组件内容的滚动窗格参数:c需要滚动的组件,例子:package src;import java.awt.*;import javax.swing.*;public class TextAreaDemo extends JFramepublic TextAreaDemo()Container contentPane=getContentPane();JTextArea textarea=new JTextArea();,textarea.setLineWrap(true);textarea.setRows(5);JScrollPane pane=new JScrollPane(textarea);contentPane.add(pane);pack();setSize(100,100);setVisible(true);public static void main(String args)new TextAreaDemo();,标签和标签组件,标签是容纳文本的组件。这种组件没有修饰(例如,没有边界),它们也不响应用户输入。你可以使用一个标签来标识组件。例如,和按钮不同,文本组件没有标签来标识它们。给组件设置标签的方法如下:使用正确的文本构造一个JLabel组件。把该标签组件放置到同需要标识的组件足够近的地方,这样用户能够看到该标签标识了哪个组件。,JLabel(String text)使用左对齐字符串来构造一个标签参数:text标签中的文本JLabel(Icon icon)使用左对齐图标来构造一个标签参数:icon标签中的图标JLabel(String text,int align)参数:text标签中的文本 align取如下常量之一:SwingConstants.LEFT,SwingConstants.CENTER或者SwingConstants.RIGHT,JLabel(String text,Icon icon,int align)同时使用文本和图标来构造一个标签。图标显示在文本的左侧参数:text标签中的文本 icon标签中的图标 align取如下常量之一:SwingConstants.LEFT,SwingConstants.CENTER或者SwingConstants.RIGHTvoid setText(String text)参数:text标签中的文本void setIcon(Icon icon)参数:icon标签中的图标,复选框,JCheckBox(String label)参数:label复选框上的标签JCheckBox(String label,boolean state)参数:label复选框上的标签 state该复选框的初始状态JCheckBox(String label,Icon icon)构造一个初始未被选择的复选框参数:label复选框上的标签 icon复选框上的图标,boolean isSelected()返回复选框的状态void setSelected(boolean state)设置复选框的状态,例子:package temp;import java.awt.*;import java.awt.event.*;import javax.swing.*;public class CheckBoxDemo extends JFrameJCheckBox bold;JCheckBox italic;JLabel label;,public CheckBoxDemo()Container contentPane=getContentPane();label=new JLabel(This is CheckBox!);label.setFont(new Font(Serif,Font.PLAIN,15);bold=new JCheckBox(Bold);italic=new JCheckBox(Italic);JPanel panel=new JPanel();contentPane.add(label);panel.add(bold);panel.add(italic);,contentPane.add(panel,BorderLayout.SOUTH);pack();setSize(200,100);setVisible(true);ActionListener listener=new ActionListener()public void actionPerformed(ActionEvent event)int mode=0;if(bold.isSelected()mode+=Font.BOLD;,if(italic.isSelected()mode+=Font.ITALIC;label.setFont(new Font(Serif,mode,15);bold.addActionListener(listener);italic.addActionListener(listener);,public static void main(String args)new CheckBoxDemo();,单选按钮,JRadioButton(String label,boolean state)参数:label单选按钮上的标签 state单选按钮的初始状态JRadioButton(String label,Icon icon)构造一个初始未被选择的单选按钮参数:label单选按钮上的标签 icon单选按钮上的图标,ButtonGroup()构造一个按钮组void add(AbstractButton b)把按钮添加到组中ButtonModel getSelection()返回被选择按钮的按钮模型String getActionCommand()返回此按钮模型的动作命令void setActionCommand(String s)为该按钮及其模型设置动作命令,例子:package src;import java.awt.*;import javax.swing.*;import java.awt.event.*;public class RadioDemo extends JFrameJLabel label;JRadioButton radioSmall;JRadioButton radioLarge;ButtonGroup group;,public RadioDemo()Container contentPane=getContentPane();JPanel panel=new JPanel();label=new JLabel(This is RadioButton!);label.setFont(new Font(Serif,Font.PLAIN,15);contentPane.add(label);group=new ButtonGroup();radioSmall=new JRa