2.3　前面板布局

用户界面是进行信息交互的重要场所。考虑程序整体以何种途径收集和向用户显示各种信息是界面设计的一项重要工作，也是程序界面框架设计的主要步骤。通常在程序设计之初确定程序界面的总体框架和布局。

大多数虚拟仪器项目以对话框的形式来组织信息交互。当然也可以选择LabVIEW提供的其他方式（图2-5）来搭建用户界面框架。例如，可以使用纵向分隔条（Vert Splitter Bar）、横向分隔条（Hor Splitter Bar）创建分栏形式的主界面；可以使用选项卡（Tab Control）创建分页形式的主界面；还可以使用子面板（SubPanel）在项目窗口中调用不同的VI，等等。

确定界面的整体框架后，就可以选取控件并安排其在前面板上的位置。前面板上控件或控件分组的布局是前面板设计的关键和重要工作之一。

当按照需求确定了要使用的控件后，可以首先使用一些装饰部件（如组合框、矩形框等）或簇将功能或逻辑相关的控件进行分组，随后使用对齐工具（Align Objects）和排列工具（Distribute Objects）来摆放这些控件或控件的分组。表2-4列出了前面板布局的一些基本原则。

图2-5　LabVIEW提供的界面框架工具

表2-4　前面板布局原则

在摆放过程中一般遵循“控件对称排列”的原则，并使各控件或控件分组之间留有足够、等距离的间隔。控件和控件分组在前面板上总体排放位置则由常用度（频度）或自然顺序来定。例如可以将使用频率较高、较重要的控件或控件分组放在显眼的位置；可以按照人们习惯的、从左到右的阅读习惯来摆放逻辑分组（某些西方国家习惯从右至左）；可以将子VI前面板上用于输入/输出的控件与I/O端子定义的布局对应一致等。在整个过程中可以使用分隔线等装饰控件进一步区分不同逻辑显示单元，最后还可以在前面板上添加公司的图标或使用背景图片来美化界面。

图2-6给出了一个简单的例子。在这个例子中，首先采用一致风格的字体和配色；其次，使用从左到右的习惯来安排总体布局，在左边放置采集（Acquire）、分析（Analysis）和演示（Present）操作选择按钮，在右边安排信息显示和调整按钮。另外，由于显示的信息较多，使用了Tab控件将信息进行分类，并使用一个“概述”页对信息进行汇总。“基本控件”页左下方的按钮用于采集控制，因此将其放在一起，使用相同大小、相等间隔进行排列；右边使用组合框架，将相关的控件进行分类后对称摆放，既美观又清晰。最后，在页面上添加公司图标和“关于”按钮，不仅美化了界面，还增加了关于软件更详细的信息索引。整个界面布局合理，条理清楚，是一个值得参考的例子。

图2-6　页面布局的简单例子

进行VI前面板设计时，按照其用途可将所设计的VI前面板分为和用户进行交互的用户界面（GUI）VI和子VI两大类。由于子VI通常只是被主VI载入内存，运行后实现某种模块化的功能，因此其前面板一般不呈现给用户，而是被开发人员用来定义VI的输入/输出参数或进行调试诊断。基于这种考虑，笔者一般将子VI中的控件按照输入/输出的功能逻辑进行分类组织，并将其前面板背景色设置为与用户界面VI不同的较深的颜色，以示区别。

图2-7给出了一个子VI前面板的简单例子。其中虽然只包含一个错误簇输入控件和错误簇显示控件，但是还是使用了分类框将输入/输出控件分成两类，并将输入控件放置在左边，输出控件放置在右边，以便和子VI连线板的布局尽量保持一致。另外，子VI的背景色也被设置为和用户界面VI不同的深灰色。采用以上方式组织子VI中的控件，可以使设计人员对子VI的输入/输出参数一目了然。

图2-7　子VI前面板布局