利用Java来创建图形用户界面,最苦恼的事情莫过于选择用哪种布局管理器了。
许多应用程序使用嵌套的Border和GridLayout来进行布局, 但是得到的结果要么变得太死板、太嵌套了以至于都无法工作了,要么就是窗口在变化的时候布局太不合理了,这样往往解决方法只有启用多个窗口,还有要么就是固定窗口的大小不允许改变。
无论是那种选择都不是很好,因为它使得应用程序从界面看上去不太美观,同样也会让应用程序的界面在使用上受到很多的限制。
但还好有一个工具能够解决所有的这些问题—那就是GridBagLayout。可惜很多人因为看到这个布局管理器感觉它太复杂了认为很难而不敢去学习,他们一直都不愿意尝试下去使用这个布局管理器。
试着用用你会发现其实GridBagLayout真的能解决几乎所有界面布局的问题,窗口大小的随意改变也不会影响到整体布局,更重要的是它可以实现任何你想要的布局设计,只要你做到更有计划和更有耐心一点就行了。
三思而后行
GridBagLayout 不是用于简单的示例程序界面。使用GridBagLayout搭建界面就像是在起居室中搭脚手架清除画钩一样。
对于简单的程序使用Boborderlayout和Gridlayout就绰绰有余了, 但如果要把程序提到实际应用上你就得考虑使用GridBagLayout。当然, 做复杂的应用程序时,一开始就使用GridBagLayout就会更有效率。
一旦你决定使用GridBagLayout,接下来一步便是要找一些纸和铅笔,只有你准确知道你的界面看上去需要成什么样子,你就可以敲键盘。这就是说,你应该在编码之前进行妥善规划。
下面将介绍一个很小的应用程序来帮助我们学习GridBagLayout,这个例子是从一个Flickr RSS fead中显示一系列照片, 最后的界面就像下面这样:
下面的是这个界面的一个原始草图:
正如你所看到的,最终的结果看上去和计划的想法完全一样。
你应该能看到在草图里有一些线,这些线是用来把总界面分成若干行和列的,这样你就很清楚每一个组件放置的格子位置。这就是GridBagLayout里"格"的那一部分,而图上的数字就是格的号码。
在某种意义上说, 我们可以把GridBagLayout想象成为早些年的HTML3和4,它们都是基于表的布局,Grid的概念就类似rowspan和colspan的意思,只不过换了个名字罢了。
随着我们的界面和表格的设置完成,是时候该进行界面布局并开始写代码了。
工作过程
这一节我假定你已经了解了基本的窗口和组件创建知识。
通过这篇文章我们最终能在一个frame中布局组件,我们将在以后的文章对界面进行改进使它更适用。因此,为了了解这整个工作的过程,我们列出了所有的目标代码。
import java.awt.*; import java.awt.event.*; import javax.swing.*; public class GridBagWindow extends JFrame { private JButton searchBtn; private JComboBox modeCombo; private JLabel tagLbl; private JLabel tagModeLbl; private JLabel previewLbl; private JTable resTable; private JTextField tagTxt; public GridBagWindow() { Container contentPane = getContentPane(); GridBagLayout gridbag = new GridBagLayout(); contentPane.setLayout(gridbag); GridBagConstraints c = new GridBagConstraints(); //setting a default constraint value c.fill =GridBagConstraints.HORIZONTAL; tagLbl = new JLabel("Tags"); c.gridx = 0; //x grid position c.gridy = 0; //y grid position gridbag.setConstraints(tagLbl, c); //associate the label with a constraint object contentPane.add(tagLbl); //add it to content pane tagModeLbl = new JLabel("Tag Mode"); c.gridx = 0; c.gridy = 1; gridbag.setConstraints(tagModeLbl, c); contentPane.add(tagModeLbl); tagTxt = new JTextField("plinth"); c.gridx = 1; c.gridy = 0; c.gridwidth = 2; gridbag.setConstraints(tagTxt, c); contentPane.add(tagTxt); String[] options = {"all", "any"}; modeCombo = new JComboBox(options); c.gridx = 1; c.gridy = 1; c.gridwidth = 1; gridbag.setConstraints(modeCombo, c); contentPane.add(modeCombo); searchBtn = new JButton("Search"); c.gridx = 1; c.gridy = 2; gridbag.setConstraints(searchBtn, c); contentPane.add(searchBtn); resTable = new JTable(5,3); c.gridx = 0; c.gridy = 3; c.gridwidth = 3; gridbag.setConstraints(resTable, c); contentPane.add(resTable); previewLbl = new JLabel("Preview goes here"); c.gridx = 0; c.gridy = 4; gridbag.setConstraints(previewLbl, c); contentPane.add(previewLbl); addWindowListener(new WindowAdapter() { public void windowClosing(WindowEvent e) { System.exit(0); } }); } public static void main(String args[]) { GridBagWindow window = new GridBagWindow(); window.setTitle("GridBagWindow"); window.pack(); window.setVisible(true); } }
构造方法前的代码都不是很特殊,都是一些相当标准的import和变量定义。但是进入构造方法后,事情就变得有趣了。
Container contentPane = getContentPane();
GridBagLayout gridbag = new GridBagLayout();
contentPane.setLayout(gridbag);
我们以GridBagWindow的内容面板作为开始来创建一个GridBagLayout对象,准确地说,这个方法与过去我们所创建GridLayout对象和BorderLayout对象的方法是一样的。那么,现在我们就开始来设置GridBagLayout对象使它作为内容面板的布局。
GridBagConstraints c = new GridBagConstraints();
然后我要提到这整个进程中的一个独特的对象,那就是GridBagConstraints。这个对象在GridBagLayout中控制所有被安置在其中组件的约束。为了把一个组件增加到你的GridBagLayout中去,你首先必须将它与一个GridBagConstraints对象建立连接。
GridBagConstraints可以从11个方面来进行控制和操纵,也可以给你提供一些帮助。这些内容是:
可能对于一个组件的每一个实例你都需要为它建立一个单独的GridBagConstraints;然而,这种方法我们并不推荐使用。最好的方法是,当你调用它的时候把对象设置为默认值,然后针对于每一个组件改变其相应的域。
这个方法具有通用性,因为在一些域中,比如insets、padx、pady和fill这些域,对于每一个组件来说一般都是相同的,因此这样对一个域进行设置就会更轻松了,也能更轻松的在另外的组件中改变某些域的值。
如果在改变了某些域值之后,你想回到原始的域值的话,你应该在增加下一个组件之前进行改变。这种方法使你更容易明白你正在修改的内容,也能使你更容易明白在一连串对象中的这11个参数的作用。
也许你现在对这些内容还是一知半解,不过事实上一旦你理解了GridBagConstraints,值得安慰的是你以后做再困难的工作都会游刃有余了。
所以,如果我们已经明白了GridBagConstraints的详细用法了,那么现在就让我们来看看在实际应用中应该如何来实现它:
tagLbl = new JLabel("Tags");
c.gridx = 0; //x grid position
c.gridy = 0; //y grid position
gridbag.setConstraints(tagLbl, c); //设置标签的限制
contentPane.add(tagLbl); //增加到内容面板
我们所做的是示例我们的标签、分配给它一个格位置,将它与一个约束对象联系起来并把它增加到我们的内容面板中。
tagModeLbl = new JLabel("Tag Mode");
c.gridx = 0;
c.gridy = 1;
gridbag.setConstraints(tagModeLbl, c);
contentPane.add(tagModeLbl);
请注意,虽然我们已经在我们的约束对象中把gridx的值设置为0,但是在这里我们仍然要对它进行重新设置——这样做没有其它原因,只是为了增加可读性。
下面,我们增加一个文本域以便能存储我们希望能搜索到的关键字,再增加一个组合框以便用来搜索多个关键字。除了我们希望的文本域有两列之外,这个概念其他的方面都与上面所说的是相同的,所以,我们需要在增加组合框之前重新设置文本域的值。
tagTxt = new JTextField("plinth");
c.gridx = 1;
c.gridy = 0;
c.gridwidth = 2;
gridbag.setConstraints(tagTxt, c);
contentPane.add(tagTxt);
String[] options = {"all", "any"};
modeCombo = new JComboBox(options);
c.gridx = 1;
c.gridy = 1;
c.gridwidth = 1;
gridbag.setConstraints(modeCombo, c);
contentPane.add(modeCombo);
做了这些之后,我们再在内容面板中增加一些其余的简单组件,这时候我们就能够浏览它了;其余的代码应该不会出现任何问题了。
到这个阶段,我们应该已经得到了一个类似于我们先前所设计的界面了。
进一步学习
当然,界面不是智能的。重新设置窗口的大小,看看将会发生些什么事情。为什么它会那样呢?那是因为我们设置了约束对象的weightx、weighty和fill的值。
关于其他类似的一些内容我们将在后面的章节中进行介绍,但是如果你希望能自己试试的话,参考GridBigLayout和GridBagConstraintsAPI文档会对扩充你的知识提供很好的帮助。
类GridBagLayout
讲外观管理器如果不讲GridBagLayout外观管理器就好像讲《岳飞传》不讲岳母刺字一样,最精彩的部分没有讲。
虽说GridBagLayout和GridLayout只有一点差别,它的作用却是出奇的大。这是因为GridBagLayout一改其他的外观管理器的死板模样,具有很多的灵活性。它不再像其他的外观管理器那样,使得各个组件的大小都一样。GridBagLayout通过类GridBagConstraints的帮助,按照设计的意图,改变组件的大小,把它们摆在设计者希望摆放的位置上。
在GridBagLayout中,每个组件都有一个GridBagConstraints对象来给出它的大小和摆放位置。我们在使用GridBagLayout的时候,最重要的就是学会使用这个类GridBagConstraints的使用方法,学会如何设置组件的大小、位置等限制条件。我们先看一个用GridBagLayout外观管理器生成的窗口——
( 图 14.8 ):
图14.8程序14.5的执行结果
这个窗口里面的几个按钮有的大、有的小,其大小、位置均不同,没有一定的规律可循,这即是发挥了GridBagLayout外观管理器的灵活性。生成此窗口的程序为:
程序14.5
importJava.awt.*;
//输入所有的java.awt类
public class window7 extends java.Applet.Applet
{
public void init(){
resize(300,100);//设置窗口的大小
GridBagConstraints gbc=new GridBagConstraints();//使用类GridBagConstriants
setLayout(new GridBagLayout());//设定外观管理器为GridBagLayout外观管理器
gbc.fill=GridBagConstraints.BOTH;//★所有的按钮都会把分配的剩余空间填满
gbc.gridwidth=1;//★设置第一个按钮的大小
gbc.gridheight=1;//★
Button Button1=new Button("东");
((GridBagLayout)getLayout()).setConstraints(Button1,gbc);
add(Button1);
gbc.gridwidth=GridBagConstraints.REMAINDER;//★第二个按钮填满整行空间
Button Button2=new Button("西");
((GridBagLayout)getLayout()).setConstraints(Button2,gbc);
add(Button2);
gbc.gridheight=4;//设置第三个按钮的大小
gbc.gridwidth=1;
Button Button3=new Button("南");
((GridBagLayout)getLayout()).setConstraints(Button3,gbc);
add(Button3);
gbc.gridheight=2;//设置第四个按钮的大小
gbc.gridwidth=2;//GridBagConstraints.REMAINDER;
Button Button4=new Button("北");
((GridBagLayout)getLayout()).setConstraints(Button4,gbc);
add(Button4);
gbc.gridwidth=GridBagConstraints.REMAINDER;
Button Button5=new Button("中");
((GridBagLayout)getLayout()).setConstraints(Button5,gbc);
add(Button5);
gbc.insets=new Insets(5,6,7,8);//★设置第五个按钮的位置
Button Button6=new Button("好酒在张弓");
((GridBagLayout)getLayout()).setConstraints(Button6,gbc);
add(Button6);
}
}
★注释:程序14.5里面有星号的语句都将做详细的解释
下面就详细地解释一下程序14.5,通过对这个小程序的分析可以从中了解GridBagLayout外观管理器的工作原理和工作方法。
GridBagLayout外观管理器实际上是根据类GridBagConstraints所给出的条件限制以及组件本身的一向特性条件(例如每个组件程序允许的最小尺寸),来决定各个组件的外观的。
让我们把程序14.5之中出现的新鲜的语句一条一条地看个明白吧:
1.gbc.fill=GridBagConstraints.BOTH;
每个组件有一定的原始大小,例如在类FlowLayout外观管理器的管理之下显示的就都是组件的本身原始大小。如果我们分配给一个组件的空间比它原本所需要的空间大时,就需要一定的方式方法来决定如何处理这一部分多余的空间。这时就用到了fill值。Java根据人们给这个fill设定的值来决定如何处理比组件原始空间大的那部分空间。
fill可以取四种不同的值,它们分别代表了四种不同的剩余空间处理方式:
2.gbc.gridwidth=1; 和 gbc.gridheight=1;
这两句话像是一对孪生兄弟,应该同时给以同样的重视。它们一个负责组件的水平宽度(gridwidth),一个负责组件的垂直高度(gridheight)。由此我们可以知道,组件的大小是可以变化的。
组件的形状是不能改变的,永远是矩形的。
好了,这两条语句的意义很简单,就讲到这里吧。
喂!等一等,我看到下面有一条语句是:
gbc.gridwidth=GridBagConstraints.REMAINDER;
这是什么意思?
怎么gridwidth的值不是一个数,而是“GridBagConstraints.REMAINDER”?
原来,这是Java精心为大家设计的一个特别有用的变量,使用它就可以通知外观管理器让组件占据本行的所有剩余空间,而不必去计算宽度值是多少,很自动化。
3.gbc.insets=newInsets(5,6,7,8);
这条语句里面提到了两个拼写几乎完全相同的词:insets和Insets,虽然只相差一个字母:一个是大写I,一个是小写i,但是它们代表的意义可大不相同。
Insets是AWT里面一个类的名字,代表着类Insets,它的用途是用来定义组件容器周围的空间大小,其中带有四个参数:
Insets(第一个参数,第二个参数,第三个参数,第四个参数)
第一个参数代表距上面有几个点的空白,第二个参数代表距左边有几个点的空白,第三个参数代表距下边有几个点的空白区域,第四个参数代表距右边留几个点的空白区域。
形象一点的表示如图14.9:
图14.9参数的设定顺序
insets是类GridBagConstraints的一个限定条件。
insets和Insets既然起的名字相同,两者之间也一定有相同之处,它们的相似之处就在于它们的用法和用途。insets用来设置
一个组件和其他的组件之间的距离的。所以在上面程序里的按钮和其他的按钮不同,它和其他的按钮之间都有一定的距离,而不是和其他的按钮挨在一起。
总之,使用外观管理器给我们带来了许多的方便之处,使得我们可以轻轻松松地完成各种窗口的外观处理工作。
使用外观管理器除了使得程序设计变得方便以外,还使得程序变得容易在各种不同的窗口环境下运行,从而协助实现了Java的多平台之梦。
小结