单元八 图形用户界面授课学时:16学时主讲:教学目标教学重点与难点新课导入与项目展示项目1-学习建立软件用户界面项目2-保存和清除信息项目3 -设计网报信息登记表主要内容教学目标教学重点及难点新课导入与项目展示项目1:某公司销售部为了提高销售业绩,计划通过电脑软件让客户 选择性的了解公司产品,开发人员要使用Java进行软件开发,需要完成网站主页面整体框架规划,实现框架内各模块合理布局;同时要求软件界 面美观大方,并能在网站中嵌入“欢迎访问”页面。那现在学习如何通过Java来完成。项目2:某同学想在填写信息后,希望对填写的内容可以 清除,也可以进行保存。项目3:某公司要招聘新员工,报名的人员需要通过网上报名,公司人力资源部门需要设计建立网报个人信息登记表。项目 描述任务1-1:感知图形化用户界面任务分析感受图形人机交互界面,添加按钮控件;相关知识点GUI是Graphical User In terface的简称,即图形化用户界面,准确来说GUI就是屏幕产品的视觉体验和互动操作部分。美观的GUI图形化用户界面,方便用户与 计算机的交互。同样在个人应用程序中,也需要提供GUI图形化用户界面。GUI主要由图标、按钮、菜单、标签等组成。任务1-1:感知图形 化用户界面任务实施设计过程:创建窗体类FirstGUIapp,该类继承于Frame类,并在该窗体中添加按钮控件;代码实现:【程序文 件:FirstGUIapp.java】技能拓展任务对程序文件1进行修改,实现当单击“停止”按钮时,可以将用户所摇号码输出到一个“编 辑框”之中。任务1-2:制作“欢迎访问”的小程序任务分析制作一个网页,要将该网页嵌入到某一网页中,可以使用Applet小程序;相关 知识点java.awt包;javax.swing包;Applet类;任务1-2:制作“欢迎访问”的小程序任务实施代码实现:【程序文 件: HelloApplet.java 】技能拓展任务在主网页中嵌入自动更新的“日历”页面。任务1-3:独立显示GUI界面,且其大 小可以伸缩任务分析独立显示GUI基本界面,可以使用Frame类,且其默认布局为边界布局管理器可以对界面大小进行伸缩;相关知识点Fr ame类是最常用的一个容器类,它可以独立显示,对应一个基本的图形化窗口,其大小可以伸缩,其默认的布局管理器是BorderLayou t。任务1-3:独立显示GUI界面,且其大小可以伸缩任务实施代码实现:【程序文件: FrameDemo.java】技能拓展任务利用 框架类建立校园网站的主页面框架结构。任务1-4:建立可以进行人机交互的界面任务分析进行人机交互的界面可以使用Dialog类;相关知 识点Dialog类也是一个独立容器类,它对应一个大小固定的对话框,通常用来提示用户或让用户输入/输出数据。任务1-4:建立可以进行 人机交互的界面任务实施代码实现:【程序文件:DialogDemo.java】技能拓展任务在网站中嵌入帮助对话框,询问用户是否需要帮 助,里面包含“确定”、“取消”两个按钮。任务1-5:建立指定布局的GUI界面任务分析该内容包含在窗体中,且不带有标题栏、菜单栏,可 以使用Panel类;相关知识点Panel容器类不是一个独立的容器类,即它必须放在其他容器中,当然也可以放在另一个Panel中,实现 容器的嵌套。需要容器的嵌套是因为可以通过这样的办法实现复杂的布局,其默认的布局管理器是FlowLayout 。任务1-5:建立指定 布局的GUI界面任务实施代码实现:【程序文件:PanelDemo.java】技能拓展任务利用Java提供的GUI开发常用类建立腾讯 主页的框架布局结构。任务1-6:建立边界布局格式的GUI任务分析将容器组件的空间分为东、南、西、北、中5个部分,使用边界布局管理器 进行设置,先定义,再将组件添加至容器;相关知识点边界布局管理器BorderLayout的作用是在容器中最多放置5个组件。这些组件的 位置可能是容器4个边的任意一个,也可能是中心点。每个位置只能有一个组件。如果添加组件到一个已被使用的位置时,原来的组件就会被替换掉 。通过指定可选值为east、south、west、north和center的约束条件,就可选择边界。它们都是定义在Borderla yout类中的final static常量。任务1-6:建立边界布局格式的GUI任务实施代码实现:【程序文件:BorderLayo utDemo.java】技能拓展任务使用BorderLayout边界布局管理器设置校园网中相关的模块布局。任务1-7:建立流布局格 式的GUI任务分析组件以一行形式进行排列,可以使用提供的流布局管理器;相关知识点FlowLayout流布局管理器是以行的形式放置组 件,当一行放满时,它会自动溢出组件到下一行。一行组件的默认位置是在容器的中间,默认方向是从左到右。FlowLayout类中定义了5 种类型为int型的可能行位置选项,它们分别是Left(左)、Right(右)、Center(中)、Leading(头)、Taili ng(尾)。其中Leading和Tailing指定行应该对齐于组件边沿,前三个常量排列组件行时的效果如其名字所示。Center选项 是默认选项,在默认情况下,一行中的组件以5个单位的距离隔开,若组件太多一行无法显示时,FlowLayout会自动换行继续往右排下去 ,紧接着的行也是以相同距离隔开。任务1-7:建立流布局格式的GUI任务实施代码实现:【程序文件:FlowLayoutDemo.ja va】技能拓展任务使用FlowLayout流布局管理器设置校园网中相关的模块布局。任务1-8:建立网格布局格式的GUI任务分析组件 按对应的行列进行排列,可以使用提供的网格布局管理器;相关知识点GridLayout网格布局管理器在容器中是以矩形网格管理各种组件。 有3种构造函数可创建GridLayout对象:GridLayout() GridLayout(int rows, int cols ) GridLayout(int rows, int cols, int hgap, int vgap)任务1-8:建立网格布局格 式的GUI任务实施代码实现:【程序文件:GridLayoutDemo.java】技能拓展任务使用GridLayou网格布局管理器设 置校园网中相关的模块布局。任务1-9:建立卡片布局格式的GUI任务分析组件按对应的行列进行排列,可以使用提供的网格布局管理器;相关 知识点CardLayout卡片布局管理器创建一种组件的栈,组件之间互相叠加。添加到容器的第一个组件在栈的最顶端,所以是可见的,最后 添加的组件在最底部。可以构造函数CardLayout()创建CardLayout对象:CardLayout()CardLayout (int h, int v) 任务1-9:建立卡片布局格式的GUI任务实施代码实现:【程序文件:CardLayoutDemo.ja va】技能拓展任务使用CardLayout卡片布局管理器设置校园网中相关的模块布局。任务2-1:建立卡片布局格式的GUI任务分析要 输入相关内容,需要建立文本区,同时要对文本区的内容进行保存或清除,则需对事件进行处理;相关知识点事件处理的要素:事件源、事件、事件 监听和事件服务程序是事件处理;事件的产生及处理过程:任务2-1:建立卡片布局格式的GUI任务实施代码实现:【程序文件: Event Demo.java 】技能拓展任务尝试设计一个QQ登录页面,当点击“登录”后能够进入QQ页面。任务3-1:填写信息任务分析建立对应 的窗口布局,并添加相应button组件;相关知识点Button的构造函数:Button()建立另一个没有标题的button But ton(String label) 建立一个以label为标题的button任务3-1:填写信息任务实施代码实现:【程序文件: B uttonDemo.java 】技能拓展任务建立QQ登录界面中登录、缩小、关闭按钮。任务3-2:建立网报信息录入标签任务分析建立对 应的窗口布局,并增加信息登录标签;相关知识点Label的构造函数:Label()建立一个新的Label。Label(String text)以text建立一个新的Label。Label(String text, int align)以text和指定的布局建立一 个新的Label。任务3-2:建立网报信息录入标签任务实施代码实现:【程序文件: LabelDemo.java】技能拓展任务建立Q Q邮箱登录界面中账号、密码等标签。任务3-3:建立网报中个人工作经历说明文本区任务分析需要输入相关内容,则需建立文本区,并设置其位 置;相关知识点TextArea构造函数:TextArea()建立一个空的TextArea。TextArea (int r, int c)建立一个指定行数和列数的TextArea。TextArea(String text) 建立一个初始化值为text的TextA rea。TextArea(String text, int r, int c)建立一个指定行数和列数并且有初始化值的TextAre a。任务3-3:建立网报中个人工作经历说明文本区任务实施代码实现:【程序文件: TextAreaDemo.java 】技能拓展任务 学习建立信息登记表“备注”一项。任务3-4:建立网报中个人工作经历说明文本区任务分析密码输入也是文本,但是设置字符数有限,且无需换 行,不宜用文本区,应该适用文本框;相关知识点TextField构造函数:TextField ()建立一个空的TextField。T extField (int c)建立一个列数为c的TextField。TextField (String text)建立一个初始化 值为text的TextField。TextField (String text, int r, int c)建立一个列数为c并且初 始化值为text的TextField 。任务3-4:建立网报中个人工作经历说明文本区任务实施代码实现:【程序文件:TextFiel dDemo.java】技能拓展任务建立登录界面用户名、密码。任务3-5:建立网报信息中籍贯列表框任务分析籍贯是较为固定的几个选项, 可以让用户进行选择,可适用列表框;相关知识点List构造函数:List ()建立一个空的List。List(int r, Bool ean multipleSelections)建立一个r行的是否允许多行选择的List。任务3-5:建立网报信息中籍贯列表框任务实 施代码实现:【程序文件:ListDemo.java】技能拓展任务建立出生年月列表框。任务3-6:建立网报信息中个人爱好一项任务分析 个人爱好可以有多项,列表框的选择仅为一项,可以使用复选框;相关知识点CheckBox构造函数:CheckBox ()建立一个空的CheckBox。CheckBox (String label) 建立一个以label为标记的CheckBox。CheckBox (String label, CheckboxGroup,Boolean state) 建立一个以label为标记,属于group组的CheckBox。并设置初始状态为state。。任务3-6:建立网报信息中个人爱好一项任务实施代码实现:【程序文件:CheckBoxDemo.java】技能拓展任务建立课程选择复选框。 |
|