Java 图形用户界面设计.docx
- 文档编号:9610974
- 上传时间:2023-02-05
- 格式:DOCX
- 页数:31
- 大小:117.55KB
Java 图形用户界面设计.docx
《Java 图形用户界面设计.docx》由会员分享,可在线阅读,更多相关《Java 图形用户界面设计.docx(31页珍藏版)》请在冰豆网上搜索。
Java图形用户界面设计
Java图形用户界面设计
深入了解布局管理器
前言
随着Internet的飞速发展,Java技术也得到了越来越广泛的应用。
而无论我们是采用J2SE、J2EE还是J2ME,GUI都是不能回避的问题。
现在的应用软件越来越要求界面友好、功能强大而又使用简单。
而众所周知,在Java中进行GUI设计相对于其跨平台、多线程等特性的实现要复杂和麻烦许多。
这也是很多Java程序员抱怨的事情。
但GUI已经成为程序发展的方向,所以我们也必须了解Java的GUI设计方法和特点。
其实,采用Java提供的布局管理器接口和相应的布局管理类,我们也可以做出相当漂亮的界面来,当然实现起来肯定要比VB麻烦许多。
本文试图通过自己的开发经历介绍一些具体的应用实例,希望能给那些曾经象我一样苦闷的Java痴迷者一些帮助。
Java中的布局管理器
2.1为什么要使用布局
在实际编程中,我们每设计一个窗体,都要往其中添加若干组件。
为了管理好这些组件的布局,我们就需要使用布局管理器。
比如说,设计一个简单的计算器,或一个文本编辑器等等。
这些组件是让JVM自己任意安排呢?
还是按照一定的位置关系进行规范的安排呢?
当然应该选择后者。
将加入到容器的组件按照一定的顺序和规则放置,使之看起来更美观,这就是布局。
在Java中,布局由布局管理器(LayoutManager)来管理。
那么,我们在什么时候应该使用布局管理器?
应选择哪种布局管理器?
又该怎样使用布局管理器呢?
如果你写的是GUI程序,在使用AWT/Swing组件时就不应硬性设置组件的大小和位置,而应该使用Java的布局管理器(LayoutManager)来设置和管理可视组件的大小和位置,否则就有可能造成布局混乱。
不信,你可以新建一个Frame(或JFrame),通过setBounds()方法往其中添加几个Button(或JButton),一旦你将窗体拉大或缩小时,你会发现组件的排列完全不是按你所预想的那样。
为了解决这个问题,即当窗体(或容器)缩放时,组件位置也随之合理调整,我们就需要使用布局管理器。
为此,我们首先要知道Java的布局方式,Java提供的API中有些什么布局管理器,它们的布局特点是什么。
2.2Java的布局方式
我们都知道,Java的GUI界面定义是由AWT类包和Swing类包来完成的。
它在布局管理上采用了容器和布局管理分离的方案。
也就是说,容器只管将其他组件放入其中,而不管这些组件是如何放置的。
对于布局的管理交给专门的布局管理器类(LayoutManager)来完成。
现在我们来看Java中布局管理器的具体实现。
我们前面说过,Java中的容器类(Container),它们只管加入组件(Component),也就是说,它只使用自己的add()方法向自己内部加入组件。
同时他记录这些加入其内部的组件的个数,可以通过container.getComponentCount()方法类获得组件的数目,通过container.getComponent(i)来获得相应组件的句柄。
然后LayoutManager类就可以通过这些信息来实际布局其中的组件了。
Java已经为我们提供了几个常用的布局管理器类,例如:
FlowLayout、BorderLayout、GridLayout、GridBagLayout等。
下面列表说明它们的布局特点:
包
类
特点
java.awt
CardLayout
将组件象卡片一样放置在容器中,在某一时刻只有一个组件可见
java.awt
FlowLayout
将组件按从左到右而后从上到下的顺序依次排列,一行不能放完则折到下一行继续放置
java.awt
GridLayout
形似一个无框线的表格,每个单元格中放一个组件
java.awt
BorderLayout
将组件按东、南、西、北、中五个区域放置,每个方向最多只能放置一个组件
java.awt
GridBagLayout
非常灵活,可指定组件放置的具体位置及占用单元格数目
Javax.swing
BoxLayout
就像整齐放置的一行或者一列盒子,每个盒子中一个组件
Javax.swing
SpringLayout
根据一组约束条件放置子组件
Javax.swing
ScrollPaneLayout
专用于JScrollPane,含一个Viewport,一个行头、一个列头、两个滚动条和四个角组件
Javax.swing
OverlayLayout
以彼此覆盖的形式叠置组件
Javax.swing
ViewportLayout
JViewport的默认布局管理器
事实上,在大多数情况下,综合运用好这些布局管理器已可以满足需要。
当然对于特殊的具体应用,我们可以通过实现LayoutManager或LayoutManager2接口来定义自己的布局管理器。
下面我们通过几个实例来了解几个常用的布局管理器的使用方法。
GUI设计应用实例
3.1FlowLayout/GridLayout/BorderLayout的应用实例
3.1.1应用背景
假设我们要编写一个简单的计算器JApplet,其基本界面如下:
3.1.2解决方法
通过其界面要求可知,我们可以通过将"BackSpace"和"Clear"JButton放置在一个JPanel
(1)中,采用FlowLayout布局;将显示结果的JTextField和该JPanel一起放置到另外一个JPanel
(2),采用GridLayout布局;而将其它的JButton则放置在另外一个JPanel(3)中,采用GridLayout布局;再将JPanel
(2)和JPanel(3)加入该JApplet,即可实现界面需求。
具体实现方法如下:
/**以FlowLayout布局JPanel
(1)*/
JPanelp1=newJPanel(newFlowLayout());//默认组件从居中开始
//加入"BackSpace"和"Clear"JButton
p1.add(backButton);
p1.add(clearButton);
/**以GridLayout布局JPanel
(2)*/
JPanelp2=newJPanel(newGridLayout(2,1));//放置2行,每行1个组件
//加入显示结果的JTextField和JPanel
(1)
p2.add(displayField);
p2.add(p1);
/**以GridLayout布局JPanel(3)*/
JPanelp3=newJPanel(newGridLayout(4,5));//放置4行,每行5个组件
StringbuttonStr="789/A456*B123-C0.D+=";
for(inti=0;i this.addButton(p3,buttonStr.substring(i,i+1)); //addButton方法 privatevoidaddButton(Containerc,Strings) { JButtonb=newJButton(s); if(s.equals("A")) b.setText("sqrt"); elseif(s.equals("B")) b.setText("1/x"); elseif(s.equals("C")) b.setText("%"); elseif(s.equals("D")) b.setText("+/-"); b.setForeground(Color.blue); c.add(b); b.addActionListener(this); } /**以BorderLayout布局JApplet*/ this.setLayout(newBorderLayout()); this.add(p2,"North"); this.add(p3,"Center"); 这样,就一切OK啦。 具体的实现代码可参见附件中的CalculateApplet.java文件。 3.2带工具栏和状态栏的GridLayout/BorderLayout应用实例 3.2.1实际问题 在很多情况下我们需要动态设置工具栏和状态栏,看下面的应用实例: 以上是在视图的工具栏和状态栏都被复选的时候,以下分别为某一个没选或都未选的情况。 3.2.2解决方法 /**工具栏JToolBar采用从左开始的FlowLayout布局*/ JToolBartoolBar=newJToolBar(); toolBar.setBorderPainted(false);//不画边界 toolBar.setLayout(newFlowLayout(FlowLayout.LEFT)); /**窗体采用动态的BorderLayout布局,通过获取工具栏或状态栏的复选标记进行界面的动态调整*/ JSplitPanesplitPane=newJSplitPane(); splitPane.setOrientation(JSplitPane.VERTICAL_SPLIT);//设置统计窗口分隔条的方向 splitPane.setDividerLocation(300);//设置分隔条的位置 splitPane.setOneTouchExpandable(true); JCheckBoxMenuItemtoolBarItem=newJCheckBoxMenuItem("工具栏(T)",true); JLabelstatusLabel=newJLabel("当前统计目标: "); JCheckBoxMenuItemstatusBarItem=newJCheckBoxMenuItem("状态栏(S)",true); /**设置系统窗体布局并动态设置工具栏和状态栏*/ privatevoidsetLayout() { if(toolBarItem.getState()&&'statusBarItem.getState()) { this.getContentPane().add(BorderLayout.NORTH,toolBar); this.getContentPane().add(BorderLayout.CENTER,splitPane); this.getContentPane().add(BorderLayout.SOUTH,statusLabel); } elseif(toolBarItem.getState()&&! statusBarItem.getState()) { this.getContentPane().add(BorderLayout.NORTH,toolBar); this.getContentPane().remove(statusLabel); } elseif(statusBarItem.getState()&&! toolBarItem.getState()) { this.getContentPane().add(BorderLayout.SOUTH,statusLabel); this.getContentPane().remove(toolBar); } elseif(! toolBarItem.getState()&&! statusBarItem.getState()) { this.getContentPane().remove(toolBar); this.getContentPane().remove(statusLabel); } this.show();//添加或移去组件后刷新界面 } 通过该方法即可实现界面的动态刷新与调整。 3.3GridBagLayout应用实例 3.3.1实际问题 GridBagLayout是JavaAPI提供的一个较复杂的布局管理器,利用好它可以解决许多实际编程中的令人烦恼的界面设计问题。 看下面的界面应用实例: 3.3.2解决方法 这个界面的设计比较复杂,涉及多个标签域(JLabel)、文本域(JTextField、JTextArea),且标签域的大小还不一样,如附件标签;并当窗体缩放时,标签域的大小应不改变,而文本域则必须自适应缩放。 如何来实现呢? 请看下面的代码: (工具栏的实现不再赘述) /**系统的界面布局实现*/ GridBagConstraintsgridBag=newGridBagConstraints(); gridBag.fill=GridBagConstraints.HORIZONTAL;//以水平填充方式布局 gridBag.weightx=0;//行长不变 gridBag.weighty=0;//列高不变 fromLabel.setForeground(Color.blue); fromLabel.setFont(newFont("Alias",Font.BOLD,16)); this.add(fromLabel,gridBag,0,1,1,1);//指定发信人标签位置 receiveLabel.setForeground(Color.blue); receiveLabel.setFont(newFont("Alias",Font.BOLD,16)); this.add(receiveLabel,gridBag,0,2,1,1);//指定收信人标签位置及大小 ccLabel.setForeground(Color.blue); ccLabel.setFont(newFont("Alias",Font.BOLD,16)); this.add(ccLabel,gridBag,0,3,1,1);//指定抄送人标签位置及大小 subjectLabel.setForeground(Color.blue); subjectLabel.setFont(newFont("Alias",Font.BOLD,16)); his.add(subjectLabel,gridBag,0,4,1,1);//指定主题标签位置及大小 accessoryLabel.setForeground(Color.blue); accessoryLabel.setFont(newFont("Alias",Font.BOLD,16)); this.add(accessoryLabel,gridBag,0,5,1,1);//指定附件标签位置及大小 gridBag.weightx=100;//行自适应缩放 gridBag.weighty=0;//列高不变 fromField.setText("admin@"); this.add(fromField,gridBag,1,1,2,1);//指定发信人文本域(JTextField)位置及大小 this.add(receiveField,gridBag,1,2,2,1);//指定收信人文本域(JTextField)位置及大小 this.add(ccField,gridBag,1,3,2,1);//指定抄送人文本域(JTextField)位置及大小 this.add(subjectField,gridBag,1,4,2,1);//指定主题文本域(JTextField)位置及大小 accessoryArea.setEditable(false); //设置不显示水平滚动条(该JTextArea置于JScrollPane中) accessoryScroll.setHorizontalScrollBarPolicy(JScrollPane.HORIZONTAL_SCROLLBAR_NEVER); this.add(accessoryScroll,gridBag,1,5,2,1);//指定附件文本区(JTextArea)位置及大小 gridBag.fill=GridBagConstraints.BOTH;//采用全填充方式布局 gridBag.weightx=100;//行自适应缩放 gridBag.weighty=100;//列自适应缩放 mailArea.setBackground(Color.blue); mailArea.setForeground(Color.yellow); mailArea.setTabSize(4); //指定信件主体区(JTextArea)的位置及大小。 (该JTextArea也置于JScrollPane中) this.add(scroll,gridBag,0,6,3,1); 在上面用到一个方法add(),这个方法是自己定义的: privatevoidadd(Componentc,GridBagConstraintsgbc,intx,inty,intw,inth) { gbc.gridx=x; gbc.gridy=y; gbc.gridheight=h; gbc.gridwidth=w; this.getContentPane().add(c,gbc); } 在用到GridBagLayout布局管理器的组件添加方法中,都可以重用它。 事实上,你还可以在方法最前面加一个参数Containercn,而将方法中的this相应的改为cn,就可以通用于所有需要使用GridBagLayout进行布局管理的容器中。 在下面的复杂例程中我们就会用到。 3.4综合多个布局的复杂应用实例 3.4.1实际问题 请看下面的实际应用界面要求: (图3.4-1) (图3.4-2) (图3.4-3) 在这个具体应用中,底部的JButton组是确定的,但JTabbedPane的每一个选项都不同,如何实现呢? 3.4.2解决方案 首先我们可以采用BorderLayout确定主题对话框的布局方式,实现方法如下: JTabbedPanedbTabPane=newJTabbedPane(); ……//下面需要用到的JButton等组件变量定义(或声明) privatevoidinitLayout() { initDBTabPane();//初始化JTabbedPane: DBTabPane组件 this.getContentPane().add(BorderLayout.CENTER,dbTabPane); //将JTabbedPane组件: dbTabPane布局于JDialog对话框的中间 initButtonPanel();//初始化JPanel: ButtonPanel组件 this.getContentPane().add(BorderLayout.SOUTH,buttonPanel); //将JPanel组件: buttonPanel布局于JDialog对话框的底部(南面) } privatevoidinitDBTabPane() { JPanelloginPanel=newJPanel(newGridLayout(10,1)); //为保证两个JCheckBox组件位于顶端,设置为共10行,每行一个组件的布局,但只 //放置界面要求的两个组件,这样就保持了界面的美观,否则如定义为 //Gridlayout(2,1)则会使两个组件居中,而且中间会隔开较长的距离。 pwdBox.setMnemonic('P'); loginPanel.add(pwdBox); dspBox.setMnemonic('D'); loginPanel.add(dspBox); dbTabPane.add("Login",loginPanel);//设置"Login"JPanel(图3.4-1)的布局 needRadio.setMnemonic('N'); allRadio.setMnemonic('A'); cacheRadio.setMnemonic('U'); radioPanel.setBorder(newTitledBorder("LoadOption"));//加上边界标题 radioPanel.add(needRadio); radioPanel.add(allRadio); radioPanel.add(cacheRadio); //以上为加入需要的JRadioButton组件到指定的JPanel: radioPanel queryPanel.add(radioPanel);//加入含JRadioButton组的JPanel到queryPanel reqBox.setMnemonic('R'); boxPanel.add(reqBox); saveBox.setMnemonic('S'); boxPanel.add(saveBox); autoBox.setMnemonic('t'); boxPanel.add(autoBox); //以上为加入需要的JCheckBox组到指定的JPanel: boxPanel queryPanel.add(boxPanel);//加入含JCheckBox组的JPanel到queryPanel dbTabPane.add("Query",queryPanel);//设置"Query"JPanel(图3.4-2)的布局 initDrvPanel(); } /**设置"Drivers"JPanel(图3.4-3)的布局*/ privatevoidinitDrvPanel() { gridBag.fill=GridBagConstraints.HORIZONTAL; gridBag.weightx=100; gridBag.weighty=0; tipLabel.setForeground(Color.black); this.add(drvPanel,tipLabe
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Java 图形用户界面设计 图形 用户界面 设计
![提示](https://static.bdocx.com/images/bang_tan.gif)