最新图形用户界面的设计PPT课件.ppt

《最新图形用户界面的设计PPT课件.ppt》由会员分享，可在线阅读，更多相关《最新图形用户界面的设计PPT课件.ppt（109页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、图形用户界面的设计图形用户界面的设计布局管理器n回忆前面的程序,向一个面板中加了三件按钮，所有的按钮都是排成一行。n如果加更多，直到一行排不了，分行。n按钮总是居中显示。n实际上，是有一个布局管理器在背后起作用。n只要是容器都可以更改布局。网格布局管理器n网格布局按行列来排列所有的组件，就像电子数据表一样。然而，对于网格布局。各个单元总是一样的大小。 例如：设定行列数 panel.setLayout(new GridLayout(5,4); 添加组件，从第一行的第一列开始，然后是第一行的第二列，并这样持续下去。网袋布局n网袋布局是所有的布局管理器中最强大的一种。在一个网袋布局中，行和列的尺寸均

2、可改变，并且可以合并相邻的单元格来适应更大的组件。组件不需要填充整个单元格区域，并且可以指定单元格内的对齐方式。n使用网袋布局管理器进行布局的步骤如下：n创建一个GridBagLayout类型的对象n把此GridBagLayout对象设成组件的布局管理器n创建一个GridBagConstraints类型的对象n对于每一个组件，填充GridBagConstraints对象n约束ngridx,gridy,gridwidth,gridheight参数gridx,gridy值定义了添加组件左上角的行和列位置。而gridwidth,gridheight值指定了组件占用的行数和列数n增量字段（weight

3、x,weighty）设置单元格增量的最大值nfill,anchor参数fill有个有效值：GridBagConstraints.NONE, GridBagConstraints.HORIZONTAL, GridBagConstraints.VERTICAL, GridBagConstraints.BOTHanchor取值：GridBagConstraints.CENTER, GridBagConstraints.NORTH, GridBagConstraints.NORTHEAST, GridBagConstraints.EAST等等n填塞（Insets,ipadx,ipady）Insets用

4、来设置组件周围的空间量，这称作外部填塞，它有left,top,right,bottom个值ipadx,ipady的设置称作内部填塞。这两个值被加到组件的最小宽度和最小高度上n例子：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 conten

5、tPane = 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(Seri

6、f);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.

7、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);conte

8、ntPane.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.setCo

9、nstraints(scroll,c);contentPane.add(scroll);pack();setVisible(true);setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);public static void main(String args)new GridBagDemo();弹簧布局nSprintLayout.Constraints getConstraints(Component c)得到给定组件的约束参数:c该布局管理器管理的组件或者容器之一nvoid putConstraint(String endSide,Component

10、 end,Sprint s,String startSide,Component Start)nvoid 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其他被加弹簧到达的组件

11、nSpring getX()nSpring getY()返回从窗口开始处到达约束组件西边或者北边结束处的弹簧nSpring getWidth()nSpring getHeight()返回跨越约束组件宽度或者高度的弹簧nSpring getConstraint(String side)nvoid setConstraint(String edge,Spring s)得到或者设置从容器开始处到达约束组件给定边界的弹簧参数:sideSprinLayout类的 WEST,EAST,NORTH,SOUTH常量之一 s被设置的弹簧nstatic Spring constant(int preferred)

12、用给定的首选值构造一个支柱.最小和最大值被设置为首选值nstatic Spring constant(int minimum,int preferred,int maximum)用给定的最小值,首选值和最大值构造一个弹簧nstatic Spring sum(Spring s,Spring t)返回弹簧s和t的和nstatic Spring max(Spring s,Spring t)返回弹簧s和t的最大值nstatic Spring minus(Spring s)返回弹簧s的相反值nint getMinimumValue()nint getPreferredvalue()nint getMax

13、imumvalue()返回弹簧的最小值,首选值和最大值nint getValue()nvoid setValue(int newValue)得到或者设置弹簧的值例子: (SpringDemo.java)复杂的布局管理n箱式布局n箱式布局要比网格布局灵活得多，它可以布置单行或单列组件。有一个容器Box类它的默认布局管理器是BoxLayout。nstatic Box CreateHorizontalBox()nstatic Box CreateVerticalBox()创建一个水平或垂直排列其内容的容器nstatic Component createHorizontalGlue()nstatic

14、Component createVerticalGlue()nstatic Component createGlue()创建一个能够在水平、垂直或者两个方向上无限延伸的不可见组件nstatic Component createHorizontalStrut(int width)nstatic Component createVerticalStrut(int height)nstatic Component createRigidArea(Dimension d)创建一个具有固定宽度、固定高度或者固定宽度和高度不可见组件nfloat getAlignmentX()nfloat getAlign

15、mentY()返回x或y轴上的对齐方式，该值介于到之间。代表对齐到顶部或左边；0.5表示中间；代表对齐到底部或右边n例子：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 BoxLayoutDem

16、o()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(C

17、ancel);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.createHorizont

18、alBox();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();setS

19、ize(200,200);setVisible(true);public static void main(String args)new BoxLayoutDemo();其它布局n不使用布局管理器n不使用布局管理器可以把一个组件放在一个固定位置上(绝对定位)n绝对定位的步骤:n把布局管理器设为nulln把组件添加到容器中n指定需要的位置和大小nvoid setBounds(int x,int y,int width,int height)移动并缩放一个组件参数:x,y组件左上角的新位置 width,height组件的新尺寸n例子:package src;import java.awt.*;i

20、mport 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,

21、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

22、);public static void main(String args)new LayoutnullDemo();对话框n选项对话框nSwing提供一些简单对话框用于收集用户的一些简单信息.nJOptionPane有四个静态方法来显示这些简单对话框:nshowMessageDialog:显示一条消息并等待用户点击OKnshowconfirmDialog:显示一条消息并得到确认nshowOptionDialog:显示一条消息并得到用户在一组选项中的选择nshowImputDialog:先是一条消息并得到用户的一行输入n例子:package src;import javax.swing.*;i

23、mport 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

24、,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();n创建对话框n在对话框的构造器中,调用基类JDialog的构造器n添加该对话框的用户界面组件n添加事件处理器n设置对话框的大小例子:(Dialog

25、Demo.java)文件对话框nJFileChooser()创建一个可用于多个框架的文件选择对话框nvoid setCurrentDirectory(File dir)为文件对话框设置初始目录nvoid getSelectedFile()nvoid getSelectedFiles()得到用户选择的一个或多个文件(如果用户不做任何选择,则返回null)nstring getName(File f)返回文件f的文件名,或者nulln例子:package src;import java.awt.*;import java.awt.event.*;import javax.swing.*;publi

26、c 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.showOp

27、enDialog(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 ar

28、gs)new FileChooserDemo();颜色选择器nJColor Chooser()构造一个初始颜色为白色的颜色选择器nColor getColor()nvoid setColor(Color c)得到和设置该颜色选择器的当前颜色nstatic Color showDialog(Component parent,string title,Color initialColor)显示一个包含一个颜色选择器的模式对话框参数:parent 对话框显示在其上的组件 title对话框框架的标题 initialColor显示在颜色选择器中的初始颜色nstatic JDialog createDia

29、log(Component parent,String title,boolean modal,JColorChooser chooser,ActionListener okListener)创建一个包含一个颜色选择器的对话框参数:parent对话框显示在其上的组件 title对话框框架的标题 modal如果该调用应该一直阻塞到对话框被关闭为止,那么该值为false chooser添加到该对话框中的颜色选择器 okListener, cancelListener OK和Cancel按钮的监听器n例子:package src;import java.awt.event.*;import java

30、.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.createD

31、ialog(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)

32、;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与JTextArean在Java中，有两个组件用于文本输入：文本框和文本区。二者的区别在于文本框只能接受单行文本输入而文本区可以接受多行文本输入。对应单行文本输入的类为J

33、TextField，而对应多行文本的类为JTextArea。nvoid setText(String t)改变一个文本组件中的文本参数：t 新文本nString getText()返回包含在该文本组件中的文本nvoid setEditable(boolean b)决定用户是否能够编辑JTextComponent的内容文本框nJTextField(int cols)参数：cols文本框的列数nJTextField(String text,int cols)使用初始字符串和指定的列数来构造一个新的JTextField参数：text显示的文本 cols文本框的列数nint getLength()返回

34、当前文档中的字符个数nString 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);con

35、tentPane.add(panel,BorderLayout.CENTER);pack();setSize(100,70);setVisible(true);public static void main(String args)new TextDemo();密码框 JPasswordFieldn密码框是一种特殊的文本框。为了避免有心人看到密码，用户输入的字符实际上并没有显示出来。取代的方法是：每一个输入的字符被回显字符代替，一般是星号“*”。Swing提供的JPasswordField类实现了这种文本框。nJPasswordField(String text,int columns)创建一

36、个新的密码框参数：text显示的文本如果没有则为null columns列数目nvoid setEchoChar(char echo)设置密码框的回显字符nchar getPassword()返回包含在密码框内的文本文本区n在一个文本区组件内，用户可以输入多行文本，换行的办法是使用ENTER键，在Java中每行都以一个n字符作为结尾。nJTextArea(int rows,int cols)构造一个新文本区参数：rows行数 cols列数nJTextArea(String text,int rows,int cols)使用一个初始字符中来构造一个新文本区参数：text初始文本 rows 行数

37、cols列数nvoid setColumns(int cols)设置文本区应该使用的列数参数：cols列数nvoid setRows(int rows)设置文本区应该使用的列数参数：rows行数nvoid append(String newText)把指定文本追加到文本区文本的末尾参数：newText需要追加的文本nvoid setLineWrap(boolean wrap)打开或关闭换行参数：wrap如果需要换行则为truenvoid setWrapStyleWord(boolean word)如果word为true，那么换行发生在单词边界处。如果它为false，那么换行不考虑单词边界问题n

38、void setTabSize(int c)把跳格设为c列参数：c一个跳格的列数nJScrollpane(Component c)创建一个显示指定组件内容的滚动窗格参数：c需要滚动的组件n例子：package src;import java.awt.*;import javax.swing.*;public class TextAreaDemo extends JFramepublic TextAreaDemo()Container contentPane = getContentPane();JTextArea textarea = new JTextArea();textarea.setL

39、ineWrap(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();标签和标签组件n标签是容纳文本的组件。这种组件没有修饰（例如，没有边界），它们也不响应用户输入。你可以使用一个标签来标识组件。例如，和按钮不同，文本组件没有标签来标识它们。给组件设置标签的方法如下：n使用正

40、确的文本构造一个JLabel组件。n把该标签组件放置到同需要标识的组件足够近的地方，这样用户能够看到该标签标识了哪个组件。nJLabel(String text)使用左对齐字符串来构造一个标签参数：text标签中的文本nJLabel(Icon icon)使用左对齐图标来构造一个标签参数：icon标签中的图标nJLabel(String text,int align)参数：text标签中的文本 align取如下常量之一：SwingConstants.LEFT,SwingConstants.CENTER或者SwingConstants.RIGHTnJLabel(String text,Icon i

41、con,int align)同时使用文本和图标来构造一个标签。图标显示在文本的左侧参数：text标签中的文本 icon标签中的图标 align取如下常量之一： SwingConstants.LEFT,SwingConstants.CENTER或者SwingConstants.RIGHTnvoid setText(String text)参数：text标签中的文本nvoid setIcon(Icon icon)参数：icon标签中的图标复选框nJCheckBox(String label)参数：label复选框上的标签nJCheckBox(String label,boolean state)参

42、数：label复选框上的标签 state该复选框的初始状态nJCheckBox(String label,Icon icon)构造一个初始未被选择的复选框参数：label复选框上的标签 icon复选框上的图标nboolean isSelected()返回复选框的状态nvoid setSelected(boolean state)设置复选框的状态n例子：package temp;import java.awt.*;import java.awt.event.*;import javax.swing.*;public class CheckBoxDemo extends JFrameJCheckB

43、ox 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

44、(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.s

45、etFont(new Font(Serif,mode,15);bold.addActionListener(listener);italic.addActionListener(listener);public static void main(String args)new CheckBoxDemo();单选按钮nJRadioButton(String label,boolean state)参数：label单选按钮上的标签 state单选按钮的初始状态nJRadioButton(String label,Icon icon)构造一个初始未被选择的单选按钮参数： label单选按钮上的标签

46、icon单选按钮上的图标nButtonGroup()构造一个按钮组nvoid add(AbstractButton b)把按钮添加到组中nButtonModel getSelection()返回被选择按钮的按钮模型nString getActionCommand()返回此按钮模型的动作命令nvoid setActionCommand(String s)为该按钮及其模型设置动作命令n例子：package src;import java.awt.*;import javax.swing.*;import java.awt.event.*;public class RadioDemo extends

47、 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 ButtonG

48、roup();radioSmall = new JRadioButton(Small,true);radioLarge = new JRadioButton(Large);group.add(radioSmall);group.add(radioLarge);panel.add(radioSmall);panel.add(radioLarge);contentPane.add(panel,BorderLayout.SOUTH);pack();setSize(200,100);setVisible(true);radioSmall.addActionListener(new ActionList

49、ener()public void actionPerformed(ActionEvent event)label.setFont(new Font(Serif,Font.PLAIN,15););radioLarge.addActionListener(new ActionListener()public void actionPerformed(ActionEvent event)label.setFont(new Font(Serif,Font.PLAIN,20););public static void main(String args)new RadioDemo();边界n如果在一个窗

50、口中有多组单选按钮，那么你需要从视觉上说明哪些按钮属于同一组。Swing提供了一组有用的边界来解决该问题。你可以在一个面板周围设置一种边界，然后用其他用户界面元素（如单选按钮）来填充该面板。n有几种不同边界可供选择，使用它们的步骤完全一样：n调用BorderFactory的一个静态方法来创建边界。可选风格如下：n低斜面n凸斜面n蚀刻n直线n不光滑n空（只是在组件周围创建一些空白地方）n给边界添加一个标题BorderFactory.createTitledBorder(String t)n把几种边界组合起来BorderFactory.createTitledBorder(Border b)n把结