Java的图形用户界面设计.ppt

《Java的图形用户界面设计.ppt》由会员分享，可在线阅读，更多相关《Java的图形用户界面设计.ppt（59页珍藏版）》请在三一办公上搜索。

1、第7章 Java的图形用户界面设计,Java的图形用户界面（GUI）由组件（component）容器（container）构成。,组件和容器类间的基本继承关系,组件和容器类间的基本继承关系如下图：,创建图形用户界面,容器和组件,Java抽象窗口工具集AWT（abstract window toolkit）的核心内容是组件和容器。组件通常为图形用户界面中的可见部分，例如按钮（button）和标签（label）等。,容器和组件,通过add()方法可将组件加入容器并显示出来。容器是图形用户界面中容纳其他组件的部分，一个容器中可容纳一个或多个组件，甚至还可以容纳其他容器。,组件的定位,容器中组件的位置

2、由容器的布局管理器（layout manager）决定。每个容器中都包含一个指向LayoutManager实例的引用，称为该容器的布局管理器。,组件的大小,由于组件的大小由容器的布局管理器决定，通常情况下无需再在程序中对组件的大小进行设定。如果自己设定了组件的大小或位置，布局管理器通常会将其忽略。,组件的大小,可以使用setLayout()方法使容器的布局管理器失效：setLayout(null)；用setLocation()方法、setSize()方法或setBound()方法对组件的大小和位置进行设定。,框架,框架（Frame）类是Window类的子类，它是一种带标题框并且可以改变大小的窗

3、口。,创建一个简单的框架,使用Frame类的构造方法Frame(String)可以创建Frame的实例，该实例是一个不可见的对象，它带有标题框，构造方法中的String型参数指定了标题内容。,创建一个简单的框架,使用从Component类继承过来的setSize()方法可以改变Frame实例的大小。必须调用setVisible()方法和setSize()方法才能使Frame的实例可见。,创建一个简单的框架,import java.awt.*；public class MyFrame extends Framepublic static void main(String args)MyFrame

4、 fr=new MyFrame(HelloOutThere!)；fr.setSize(400,200)；fr.setBackground(Color.blue)；fr.setVisible(true)；public MyFrame(String str)super(str)；.,这里调用来自Component类的setSize()方法,面板,面板（Panel）与框架类似，也是一种容器，可以容纳其他GUI组件。面板通过构造方法Panel()进行创建。当一个Panel对象被创建之后，使用Container类的add()方法将它加入到某个Window对象或Frame对象中。,面板示例,import

5、java.awt.*；public class FrameWithPanel extends Frame public FrameWithPanel(String str)super(str)；public static void main(String args)FrameWithPanel fr=new FrameWithPanel(Frame with Panel)；Panel pan=new Panel()；,构造函数,fr.setSize(300,200)；fr.setBackground(Color.blue)；fr.setLayout(null)；pan.setSize(100,

6、100)；pan.setBackground(Color.yellow)；fr.add(pan)；fr.setVisible(true)；,布局,Java语言中包含以下几种布局管理器：FlowLayout Panel类和Applet类的默认布局管理器。BorderLayoutWindow类、Dialog类和Frame类的默认布局管理器。GridLayout CardLayout GridBagLayout,一个简单的例子,import java.awt.*；public class ExGui private Frame f；private Button b1；private Button b

7、2；public static void main(String args)ExGui that=new ExGui()；that.go()；,public void go()f=new Frame(GUI example)；f.setLayout(new FlowLayout()；b1=new Button(Press me)；b2=new Button(Dont press Me)；f.add(b1)；f.add(b2)；f.pack()；f.setVisible(true)；,说明,1 main()方法main()方法有两个作用。创建了一个ExGui类的实例，在这个实例创建之前，并没有实

8、际可用的f.b1和f.b2数据项。当ExGui实例创建好以后，main()又调用了该实例的go()方法，在这个方法中，程序的实际功能得以实现。,说明,2new Frame(GUI Example)功能是创建Frame类的一个实例。Java中的Frame 是一个顶级（top level）窗口，它带有标题框并且可以改变大小。在刚刚创建时，Frame的大小为0，并且不可见。,说明,3 f.setLayout(new FlowLayout()创建了一个FlowLayout型的布局管理器，调用setLayout()方法将该布局管理器指定给Frame实例。每个Frame都有一个默认的BorderLayou

9、t型布局管理器，它负责安排Frame中组件的布局，本例创建了FlowLayout型布局管理器。,说明,4 new Button(Press Me)这条语句的功能是创建java.Button类的一个实例，该实例是窗口中的标准按钮button，按钮上的标签由构造方法中String型参数Press Me指定。,说明,5 f.add(b1)Frame的实例f接收按钮组件b1，按钮b1的大小和位置便由f的FlowLayout型布局管理器来控制。6 f.pack()框架f设定一个适当的大小，以便能够以“紧缩”的形式包容各个组件。,布局管理器,FlowLayout布局管理器,FlowLayout型布局管理器

10、对容器中组件进行布局的方式是将组件逐个地安放在容器中的一行上，一行放满后就另起一个新行。,FlowLayout布局管理器,FlowLayout 有三种构造方法：public FlowLayout()public FlowLayout(int align)public FlowLayout(int align,int hgap,int vgap),FlowLayout布局管理器,在默认情况下，FlowLayout将组件居中放置在容器的某一行上FlowLayout的构造方法中提供了一个对齐方式的可选项align,FlowLayout布局管理器,align的可取值FlowLayout.LEFT左对齐

11、FlowLayout.RIGHT 右对齐FlowLayout.CENTER 居中如：newFlowLayout(FlowLayout.LEFT)创建了一个使用左对齐方式的FlowLayout的实例。,FlowLayout布局管理器,FlowLayout的构造方法中还有一对可选项hgap和vgap，可以设定组件的水平间距和垂直间距。FlowLayout布局管理器并不强行设定组件的大小，而是允许组件拥有它们自己所希望的尺寸。,FlowLayout布局管理器,示例：setLayout(new FlowLayout(FlowLayout.RIGHT,20,40)；setLayout(new FlowL

12、ayout(FlowLayout.LEFT)；setLayout(new FlowLayout()；,FlowLayout布局管理器,import java.awt.*；public class MyFlow private Frame f；private Button button1,button2,button3；public static void main(String args)MyFlow mflow=new MyFlow()；mflow.go()；,public void go()f=new Frame(Flow Layout)；f.setLayout(new FlowLayou

13、t()；button1=new Button(Ok)；button2=new Button(Open)；button3=new Button(Close)；f.add(button1)；f.add(button2)；f.add(button3)；f.setSize(100,100)；f.setVisible(true)；,BorderLayout布局管理器,BorderLayout是Dialog类和Frame类的默认布局管理器，它提供了一种较为复杂的组件布局管理方案，每个被BorderLayout管理的容器均被划分成五个区域：东(East)、南(South)、西(West)、北(North)、

14、中(Center)。North 在容器的上部，East在容器的右部，其他依此类推。Center当然就是East，South，West和North所围绕的中部。,BorderLayout布局管理器,BorderLayout布局管理器有两种构造方法：BorderLayout()构造一个各部分间距为0的BorderLayout实例。BorderLayout(int,int)构造一个各部分具有指定间距的BorderLayout实例。,BorderLayout布局管理器,在BorderLayout 布局管理器的管理下，组件必须通过add()方法加入到容器的五个命名区域之一。在容器的每个区域，只能加入一个

15、组件。,BorderLayout布局管理器,可以使用内部容器在BorderLayout的一个区域内间接放入多个组件。如果某个区域没有使用，那么它的大小将变为零，此时Center区域将会扩展并占据这个未用区域的位置。,BorderLayout布局管理器,如：f=newFrame(FrameTitle)；b=newButton(PressMe)；f.add(b,South)；将一个按钮加到框架的南部,BorderLayout布局管理器,import java.awt.*；public class ExGui2 private Frame f；private Button be,bw,bn,bs,b

16、c；public static void main(String args)ExGui2 that=new ExGui2()；that.go()；void go()f=new Frame(Border Layout)；be=new Button(East)；bs=new Button(South)；,bw=new Button(West)；bn=new Button(North)；bc=new Button(Center)；f.add(be,East)；f.add(bs,South)；f.add(bw,West)；f.add(bn,North)；f.add(bc,Center)；f.setSi

17、ze(350,200)；f.setVisible(true)；,GridLayout布局管理器,GridLayout是一种网格式的布局管理器，它将容器空间划分成若干行乘若干列的网格，组件依次放入其中，每个组件占据一格。,GridLayout布局管理器,GridLayout三种构造方法：public GridLayout()public GridLayout(int rows,int cols)public GridLayout(int rows,int cols,int hgap,int vgap),GridLayout布局管理器,第一种不带参数的构造方法创建一个只有一行的网格，网格的列数根据

18、实际需要而定。参数：rows和cols分别指定网格的行数和列数，hgap和vgap分别表示网格间的水平间距和垂直间距。,GridLayout布局管理器,如：new GridLayout(3,2)，可以创建一个三行乘两列的布局管理器。rows和cols中的一个值可以为0，但是两个值不能都是0。如果rows为0，那么网格的行数将根据实际需要而定；如果cols为0，那么网格的列数将根据实际需要而定。,GridLayout布局管理器,import java.awt.*；public class GridEx private Frame f；private Button b1,b2,b3,b4,b5,b

19、6；public static void main(String args)GridEx that=new GridEx()；that.go()；void go()f=new Frame(Gridexample)；f.setLayout(new GridLayout(3,2)；,b1=new Button(b1)；b2=new Button(b2)；b3=new Button(b3)；b4=new Button(b4)；b5=new Button(b5)；b6=new Button(b6)；f.add(b1)；f.add(b2)；f.add(b3)；f.add(b4)；f.add(b5)；f.

20、add(b6)；f.pack()；f.setVisible(true)；,CardLayout布局管理器,CardLayout是一种卡片式的布局管理器，它将容器中的组件处理为一系列卡片，每一时刻只显示出其中的一张。示例：为Frame类的实例f指定了一个 CardLayout类型的布局管理器，然后向其中加入了五张卡片，每张卡片都是Panel类的一个实例，并且具有不同的背景色。每当在程序窗口单击鼠标时，下一张卡片就会显示出来。,程序7-7:,import java.awt.*；import java.awt.event.*；public class CardTest extends MouseAd

21、apter Panel p1,p2,p3,p4,p5；Label l1,l2,l3,l4,l5；CardLayout myCard；Frame f；public static void main(String args)CardTest ct=new CardTest()；ct.init()；,声明一个CardLayout 对象,public void init()f=new Frame(Card Test)；myCard=new CardLayout()；f.setLayout(myCard)；p1=new Panel()；p2=new Panel()；p3=new Panel()；p4=n

22、ew Panel()；p5=new Panel()；/为每个Panel创建一个标签并设定不同的背景颜色，以便于区分l1=new Label(This is the first Panel)；p1.add(l1)；p1.setBackground(Color.yellow)；l2=new Label(This is the second Panel)；p2.add(l2)；p2.setBackground(Color.green)；,l3=new Label(This is the third Panel)；p3.add(l3)；p3.setBackground(Color.magenta)；l

23、4=new Label(This is the fourth Panel)；p4.add(l4)；p4.setBackground(Color.white)；l5=new Label(This is the fifth Panel)；p5.add(l5)；p5.setBackground(Color.cyan)；p1.addMouseListener(this)；p2.addMouseListener(this)；p3.addMouseListener(this)；p4.addMouseListener(this)；p5.addMouseListener(this)；,设定鼠标事件的监听程序,

24、f.add(p1,First)；f.add(p2,Second)；f.add(p3,Third)；f.add(p4,Fourth)；f.add(p5,Fifth)；myCard.show(f,First)；f.setSize(300,200)；f.show()；/处理鼠标事件，每当单击鼠标键时，即显示下一张卡片。/如果已经显示到最后一张，则重新显示第一张。public void mouseClicked(MouseEvent e)myCard.next(f)；,显示第一张卡片,将每个Panel作为一张卡片加入f,其他布局管理器,除了前面介绍的FlowLayout，BorderLayout，Gr

25、idLayout和CardLayout四种布局管理器之外，java.awt还提供了GridBagLayout布局管理器。GridBagLayout布局管理器以网格为基础，允许组件使用最适当的大小，既可以占多个网格，也可以只占一个网格的一部分。,容器,框架框架是一个带标题框的窗口，窗口的大小可以改变。默认情况下，框架使用BorderLayout布局管理器，可以使用setLayout()对此进行修改。,面板,面板是一个容器，并且是一个纯粹的容器，它不能作为独立的窗口使用。默认情况下，面板使用FlowLayout布局管理器，同样可以使用setLayout()方法对此进行修改。面板可以像按钮那样被创建

26、并加入到其他容器中。,面板,当面板被加入某个容器时，可以对它执行以下两项重要操作：（1）为面板指定一个布局管理器，使得在整个显示区域中，面板所在的部分具有特殊的布局。（2）向面板中加入组件。,创建面板和构造复杂布局,面板是通过构造方法panel()创建的。面板在创建之后，必须通过add()方法加入 到其他容器中才有意义。示例：建立一个框架，框架的布局管理器是BorderLayout，面板被放置在其North区域。在面板中，放置了两个按钮。,程序7-8:,import java.awt.*；public class ExGui3 private Frame f；private Panel p；p

27、rivate Button bw,bc；private Button bfile,bhelp；public static void main(String args)ExGui3 gui=new ExGui3()；gui.go()；,public void go()f=new Frame(GUI example 3)；bw=new Button(West)；bc=new Button(Work space region)；f.add(bw,West)；f.add(bc,Center)；p=new Panel()；f.add(p,North)；bfile=new Button(File)；bhelp=new Button(Help)；p.add(bfile)；p.add(bhelp)；f.pack()；f.setVisible(true)；,