第9章 界面设计

9.6 平移或滚动设计
平移式布局是移动界面中比较常见的布局方式。大平移式布局主要是通过手指横向 滑动屏幕来查看隐藏信息的一种交互方式。这种设计语言来源于经典的瑞士图形设 计的设计原则，并成为微软Metro Design（城市地铁标识风格）设计语言。 平移式布局不仅能够展示横轴的隐藏信息，而且通过左右滑动可以横向显示更多的 信息，从而有效地释放了手机屏幕的容量，也使得用户的操作变得更加简便。
9.3 扁平化设计
在这个科技快速发展的时代，设计风格无疑会成为大众所关注的焦点。同样，艺术 风格的流行还与媒介密切相关。扁平化设计已成为今日UI设计的主流。扁平化设计 所有的元素的边界都干净利落，没有任何羽化，渐变，或者阴影。仅用简单的形体 和明亮的色块来表达，显的干净利落。尤其在手机界面上，更少的按钮和选项使得 界面干净整齐，使用起来格外简洁。可以更加简单直接的将信息和事物的工作方式 展示出来，减少认知障碍的产生
N APP要素 o 1 设计风格 2 LOGO 3 页面速度 感 4 页面布局 官 5 页面色彩 体 6 动画效果 验 7 页面导航 8 页面大小 9 图片展示 11 广告位置 13 栏目命名 浏 14 栏目层级 览 15 内容分类 体 16 更新频率 验 17 信息版式 18 新文标记
9.5 侧栏与标签设计
侧滑式布局也称作侧滑菜单，是一种在移动页面设计中频繁使用的用于信息展示的 布局方式。如果说，宫格式布局是从网页时代就开始出现，并通过网页设计影响到 手机移动界面设计的话，那么，侧滑式布局可以说是根据手机屏幕特点设计的布局 方式。
侧滑式布局的最大优势是能够减少界面跳转和信息延展性强。其次，该布局方式也 可以更好地平衡当前页面的信息广度和深度之间的关系。折叠式菜单也叫风琴布局， 常见于两级结构的内容。传统的网页树状目录就是这种导航的经典。用户通过点击 分类可展开并显示二级内容。

习题答案一、简答题1. 详细设计和信息系统体系结构设计之间存在什么关系？包括哪些基本工作？答：详细设计是信息系统体系结构设计的深入和细化，体系结构设计确定信息系统的宏观结构方案，详细设计则需要给出各子系统内部的设计方案，强调细节并指导实现。

详细设计的工作包括类与接口设计，功能逻辑设计，数据库设计和界面设计等工作。

2. 功能逻辑设计包括哪几部分的工作？答：功能逻辑设计包括分析用例的BCE类，以及用例功能逻辑分析与建模等工作。

3. 数据库设计分为哪几个步骤？答：包括数据库概念设计，逻辑设计和物理设计等。

4. 什么叫持久型类？答：指类的完整信息要在数据库中存储。

5 什么叫用户界面？用户界面设计包括那些工作？答：用户界面是对用户与系统之间进行交互所采用的方式、途径、内容、布局、结构的总称，用户界面也叫人机界面、人机接口、人机交互界面等。

用户界面设计包括界面需求分析、输入设计、输出设计、屏幕界面设计和编写用户手册等工作。

二、填空题1. 详细设计的工作包括（类和接口设计），功能逻辑设计，（数据库设计），界面设计。

2．PIM类模型的设计来源是（业务对象模型），而PSM类模型又来源于( PIM类模型）。

3．输入方式可以分为（批输入）和（联机输入）两种类型。

4．图形屏幕界面分为（注册界面）、（主控界面）、（数据处理界面）、（事务处理界面）四种类型。

三、选择题1．选择正确的（C）A：在设计阶段所设计的类一定能够找到对应的业务对象。

B：一般实体类有属性无操作。

C：一般控制类有操作无属性。

D：边界类需要设计人员重点设计。

2. （C）不属于类的三种基本类型。

A. 界面类B. 控制类C. 资源类D. 实体类3．用户界面（D）A：是信息系统客户的界面 B：反映信息系统功能C：也叫系统界面 D：分为输入界面、输出界面和混合界面答：1:C; 2: C；3:D；四、思考题1.简述PIM类模型在系统设计中的作用。

2.简述功能逻辑设计与需求分析阶段的功能分析的关系。

结束
1.通用对话框的常用属性 （1）Action（功能）属性 该属性直接决定打开何种类型的对话框。 例：commondialog1.action=2 (打开“另存为”对话框) 该属性只能在程序中赋值，不能在属性窗 口内设置，用于调出相应的对话框。 （2）DialogTitle（对话框标题）属性 DialogTitle属性是通用对话框标题属性， 可以是任意字符串。
结束
（3）CancelError属性 CancelError属性表示用户在与对话框进 行信息交互时，单击“取消”按钮时是否 产生出错信息。 True：表示单击对话框中的“取消”按 钮时，便会出现错误警告。 False（缺省）：表示单击对话框中的 “取消”按钮时，不会出现错误警示。
结束
2. 通用对话框的方法
结束
6. “字体”对话框 当Action=4时弹出“字体”对话框，供用户 选择字体。 “字体”对话框常用属性 （1）Color属性 用来设置字体的颜色，当用户在“颜色”下 拉列表框中选定某颜色时，Color属性值即 为所选颜色值。 （2）FontName属性 用来设置用户所选定的字体名称。
结束
结束
3. “打开”/“另存为”对话框常用属性设 置 （1）DialogTitle（对话框标题）属性 用来给出对话框的标题，缺省值为“打 开”/“另存为”。 （2）FileName（文件名称）属性 用于设置“文件名称”文本框中显示的文 件名，并返回用户所选定的文件名（包括 路径名），同时用此文件名为Filename赋 值。 （3）FileTitle（文件标题）属性 用于返回或设置用户所要打开的文件的文 件名，它不包含路径。
结束
例2：为上例中的“保存文件”按钮编写事件 过程，将文本框中的内容存盘。
程序代码如下： 也可以在属性页或 属性框中进行设置 Private Sub Command2_Click() Commondialog1.InitDir = "c:\my documents" Commondialog1.Filter="文本文件（*.txt）|*.txt " Commondialog1.FilterIndex = 2 Commondialog1.DefaulText = "txt" Commondialog1.Action = 2 Open Commondialog1.FileName For Output As #1 Print #1, Text1.Text Close #1 End Sub

4.具体代码 l 主窗口程序代码 Private Sub Command1_Click() „选择不同复选框显示不同求面积窗体 If Option1.Value = True Then three.Show Unload Me ElseIf Option2.Value = True Then four.Show Unload Me Else five.Show Unload Me End If End Sub
3.编写程序代码
a.程序分析：在完成任务“求多边形面积”程序代码设计编 写过程中，求多边形面积采用把多边形划分成三角形的方 式来求解面积的，即，求多边形面积就是求多个三角形面 积，为此在本程序编写设计过程中设立了一个用海伦公式 求三角形面积的公共模块，实现在其他窗体中可以随时调 用求三角形面积的公共模块中的过程。 具体代码包括：主窗口程序代码、公共模块程序代码、 三角形求面积程序代码、四边形求面积程序代码和五边形 求面积程序代码
同样，模块的添加也有两种方式，一种方式是通过点击 工程菜单命令，选择“添加模块”，出现如图9-5所示“添加 模块”对话框，选择模块，单击“打开”按钮，在工程窗体 中将会以默认的名字添加模块；另一种方式，在“工程”窗 体中，选择“窗体”，点击右键，出现弹出菜单，选择“添 加…”，出现下一级下拉菜单，选择“添加模块”，同样会出 现时打开多个文本文件”程序设计过程中， 采用设置一个子窗体，程序设计过程中采用 “tempfrm.Show”和“tempfrm.RichTextBox1.LoadFile (Names(0) & Names(i))”语句根据选择的文件数打开子窗体 个数。 6.课后练习 练习1：在理解掌握本课课业设计任务一、二的基础上，选 择其中一个课业设计任务，再次独立完成该程序的设计编 写任务。 练习2：在课堂任务2“同时打开多个文本文件”增加一个帮 助菜单，在帮助菜单下面，增加“软件使用说明”和“关 于我们”两个子菜单。所增加“帮助”菜单具有任务1所设 计的功能。