第8章-信息系统的界面设计

1、2021/8/142021/8/142第8章 信息系统的界面设计本章知识导航 理论指导 知识技能目标(1) 了解友好用户界面的基本要求(2) 一般掌握用户界面的组成元素(3) 重点掌握用户界面的设计方法(4) 学会设计常见的用户界面本章知识要点(1) 友好用户界面的基本要求(2) 用户界面的组成元素(3) 用户界面的设计方法(4) 常见用户界面的设计教学方法理论实践一体化，教、学、做合一课时建议8课时2021/8/1438.1 友好用户界面的基本要求图书管理系统的界面由窗口构成，一般分为登录窗口、主窗口、多个子窗口、对话框、报表等。子窗口的设计要和系统功能联系，以不同的系统功能来构建相应的窗口

2、。v(1) 直观的设计v(2) 及时的帮助v(3) 有益的提示v(4) 方便的导航v(5) 快捷的输入v(6) 得体的外观v(7) 合理的布置v(8) 有效的检验v(9) 一致的风格v(10) 迅速的响应2021/8/1448.2 信息系统的界面设计8.2.1 用户界面的组成元素v(1) 窗口v(2) 菜单v(3) 工具栏v(4) 状态栏v(5) 对话框v(6) 控件2021/8/1458.2.2 用户界面的设计(1) 设计初始用户界面(2) 创建导航图和流程图(3) 设计提示信息和帮助信息(4) 设计输入的有效性验证(5) 设计用户身份验证界面(6) 设计错误处理2021/8/1468.3

3、图书管理系统的界面设计 8.3.1 图书管理系统用户登录界面设计v图书管理系统用户登录窗体如图8-1所示。v用户登录窗体的属性设置如表8-1所示。项目实战 属 性 名属 性 值说 明(Name)frmLogin窗体对象名称AcceptButtonbtnOk设置窗体的“确定”按钮，用户按Enter键相当于单击该按钮CancelButtonbtnCancel设置窗体的“取消”按钮，用户按Esc键相当于单击该按钮Icon指定一个ico文件指示窗体的图标，该图标在窗体的系统菜单中显示，以及当窗体最小化时显示MaximizeBoxFalse设置窗体标题栏的右上角不显示最大化按钮Size320，190设置

4、窗体的大小(像素为单位)StartPositionCenterScreen确定窗体第一次出现时的位置为屏幕中央Text用户登录设置窗体标题文本2021/8/1478.3.2 图书管理系统主界面设计v图书管理系统主界面如图8-2所示。v图书管理系统主界面中菜单项的主要属性如表8-4所示。控件的Text属性值对应Name属性值控件的Text属性值对应Name属性值系统设置mnuSystemSet借阅管理mnuBorrow数据备份mnu01_01图书借阅mnu04_01数据恢复mnu01_02分隔线mnu04_02数据导出mnu01_03图书续借mnu04_03分隔线mnu01_04图书归还mnu0

5、4_04用户切换mnu01_05分隔线mnu04_05用户管理mnu01_06超期罚款mnu04_06分隔线mnu01_07数据查询mnuQuery系统退出mnu01_08图书信息查询mnu05_01图书管理mnuBookManage读者信息查询mnu05_02图书类别管理mnu02_01借阅信息查询mnu05_03图书信息管理mnu02_02报表打印mnuPrint读者管理mnuReaderManage图书信息mnu06_01读者类型管理mnu03_01借阅信息mnu06_02读者信息管理mnu03_02帮助mnuHelp关于mnu07_012021/8/1488.3.3 图书信息管理界面设

6、计1. 图书类型管理界面设计2. 管理与浏览图书信息界面设计3. 新增图书信息界面设计4. 选择出版社界面设计2021/8/1498.3.4 读者信息管理界面设计1. 读者类型管理界面设计v读者类型管理窗体如图8-11所示。2. 管理与浏览读者信息界面设计v管理与浏览读者信息窗体如图8-12所示。2021/8/14108.3.4 读者信息管理界面设计3. 新增读者信息界面设计v新增读者信息窗体如图8-13所示。4. 选择读者界面设计v选择读者窗体如图8-14所示，该窗体只包含一个DataGrid控件。2021/8/14118.3.5 图书借阅管理界面设计1. 图书借阅界面设计v图书借阅窗体如图

7、8-15所示。2. 图书续借与归还界面设计v图书续借与归还窗体如图8-16所示。2021/8/14128.3.5 图书借阅管理界面设计3. 选择图书界面设计v选择图书窗体如图8-17所示，该窗体只包含一个DataGrid控件。4. 图书借阅查询界面设计v图书借阅查询窗体如图8-18所示。2021/8/14138.3.6 图书罚款界面设计1. 图书罚款管理界面设计v罚款管理窗体如图8-19所示。2. 浏览超期未罚款图书界面设计v浏览超期未罚款图书窗体如图8-20所示，该窗体中包含了一个DataGrid控件和一个Label控件。NoImage2021/8/14148.3.7 数据输出界面设计1.

8、打印图书信息v(1) 图书信息报表设计界面设计v(2) 打印图书信息界面设计2. 打印图书借阅信息v(1) 图书借阅信息报表设计界面设计v(2) 打印借阅表界面设计2021/8/14158.3.8 图书管理系统用户管理界面设计用户管理窗体如图8-25所示。NoImage2021/8/1416任务描述v (1) 设计进销存管理系统的登录窗体。v(2) 设计进销存管理系统的主窗体。v(3) 设计进销存管理系统的员工基本信息管理窗体。v(4) 设计进销存管理系统的员工基本信息增加窗体。v(5) 设计进销存管理系统的商品类别和商品信息管理窗体。v(6) 设计进销存管理系统的商品信息增加窗体。v(7)

9、设计进销存管理系统的供货商基本信息管理窗体。v(8) 设计进销存管理系统的供货商基本信息增加窗体。v(9) 设计进销存管理系统的入库单录入窗体。v(10) 设计进销存管理系统的入库查询窗体。同步训练2021/8/1417参考资料v(1) 登录窗体的参考界面如图8-26所示。v(2) 主窗体的参考界面如图8-27所示。v(3) 员工基本信息管理窗体参考界面如图8-28所示。v(4) 员工基本信息增加窗体参考界面如图8-29所示。v(5) 商品类别和商品信息管理窗体的参考界面如图8-30所示。v(6) 商品信息增加窗体的参考界面如图8-31所示。v(7) 供货商基本信息管理窗体的参考界面如图8-32所示。v(8) 供货商基本信息增加窗体的参考界面如图8-33所示。v(9) 入库单录入窗体的参考界面如图8-34所示。v(10) 入库查询窗体的参考界面如图8-35所示。 2021/8/1418本 章 小 结本章介绍了用户界面的一般要求、信息系统用户界面的组成元素、用户界面的主要形式、用户界面的