1.2.3 设计简单的用户界面

　　首先从空白窗体开始工作。我们将设计一个简单的程序:在屏幕上开一个窗口，窗口中有一个图框，用三个按钮来改变图框的形状;再用一个图标按钮来进行图框的颜色设置，通过颜色编辑对话框来选择变成哪一种颜色。

　　在菜单上选用File|New Application菜单项来生成新的工程文件。这时，屏幕上出现图1.2所示的窗体。

　　1.2.3.1 选取部件加入到窗体中

　　部件(Component)是建立Delphi应用程序的要素。Delphi为用户提供了丰富的部件库，既有可视的部件(如编辑框、按钮)等，也有不可视的部件(如系统定时器、数据表等)。它们按照功能分别排列在Component Panel的各页上。

　　移动鼠标到Component Panel上，在部件按钮上“犹豫”一、两秒钟，一个黄色小提示框就会弹出，写有该部件的名称，我们称之为提示(Hint)。在要选择的部件上单击左键，则该部件按钮被按下，表示部件已被当前选择。然后，将鼠标移动到窗体上，按下左键，该部件被放到窗体中。部件的轮廓线上会显现八个被称为尺寸调整器(Sizing Handles)的黑色小方块。它除了供用户调整尺寸使用之外，还可以表示该对象处于当前编辑状态。此时，按“Delete”键可以将该部件删除。

　　在Component Panel上，点动写有“Additional”的页标签，切换到Additional页，再移动鼠标，逐个用观看Hint的办法查看部件的名称，找到“Shape”部件(其图标为圆、方形、三角形三个几何体)，将其放到窗体的左方。

　　再按动“Standard”页标签，找到“Button”部件(图标上画有OK按钮)。Delphi允许在添加多个同类型的部件时，不必每次到部件选项板上选取。按住“Shift”键，同时在“Button”部件上单击鼠标左键，这时“Button”部件处于按下状态，并有蓝色边框，表示已经被选择固定。依次在窗体右方的三个位置单击左键，则会放置三个相同的Button部件。把鼠标光标移到部件选项板左侧的箭头图标处，这是“取消选择”按钮，它没有提示。按动它，会发现“Button”部件按钮恢复弹起状态。否则，每次“Form1”上的鼠标单击左键动作，都会导致增加一个按钮部件。

　　再次进入“Additional”部件页，选择一个“BitBtn”按钮(图标是有绿色对号的OK按钮),把它放到其它三个按钮部件的下面。

　　点动“Dialog”页标签，选择以16色网格做图标的ColorDialog部件并把它放到窗体的任意位置。因为这一部件是不可视部件，所以它的位置并不影响大局。

　　1.2.3.2 部件的调整与对齐

　　一般来讲，此时放置到窗体的部件是分散排列的，而且其大小不是真正需要的尺寸。除了不可视的ColorDialog部件外，其它的部件都需要进行位置、大小和显示字样的调整。Delphi提供的对齐工具和窗口栅格为这些调整提供了方便。

　　1、移动部件

　　只需把鼠标落到想移动的部件上，按住左键并移动光标，到合适的位置再释放左键，整个部件即被移到新位置。

　　2、调整尺寸

　　先把鼠标光标移动到要改变尺寸的部件上，单击左键，选中该部件，尺寸调整器会出现，把鼠标移动到其中的一个小黑色方块上，当鼠标变成拖动方向指示时，按下并拖动鼠标左键，可以放大或缩小部件。上下左右的小方块用来移动对应的各边，四个角的方块可以移动相连的两条边。如果要精确地表述部件的尺寸，可以在Object Inspector上，改变Left(表示部件左边缘到窗体左边框的象素点数)、Top(表示窗体上边框到部件上边缘的象素点数)、 Width(部件本身的宽度)、Height(部件本身的高度)等属性。关于改变部件的属性，下文还将仔细讲解。

　　3、使得一组部件对齐

　　用调整位置的方法可以对齐部件，但操作步骤复杂。Delphi提供的对齐工具可以使多个部件的对齐极为迅速方便。下面我们来使四个按钮对齐。先将四个按钮选为一组：按住并向右下方拖动鼠标左键，在窗体上画出围绕四个按钮的矩形，释放左键后，被选中的按钮周边会出现暗灰色的边框。选用Edit|Align命令，或使用弹出式菜单(在被固定的部件上单击鼠标右键激活)，可以显示图1.4所示的对话框。

　　要使按钮沿左边对齐并使它们在垂直方向上均匀分布，先在Alignment对话框的Horizontal栏内选择“Left sides”，在“Vertical”栏内选择“Space equally”，按动OK按钮，Delphi就会自动将它们对齐。然后，您可以将它们　　利用对齐模板来对齐部件也是很方便的。首先要将要对齐的部件选成一组，选择View|Alignment Palette显示对齐模板。按照所示的方式选择即可达到对齐的目的

　　4、锁定部件

　　如果部件已经对齐，为防止不小心移动部件，可以将部件位置锁定。选择主菜单上的Edit|Lock Controls选项，使得部件不能进行移动操作。解锁只需再次选择此项即可。

　　调整“Shape”部件的大小，使之与右边的按钮组相匹配。再改变窗体的大小，按住并拖动窗体右下方使之刚好包容窗体上的全部部件。这样，您的用户界面就会比较美观。

　　1.2.3.3 保存所做的工作

　　及时地保存所做的工作至关重要。对设计者来讲，有两个文件需要保存：库单元文件(以.PAS为后缀)和工程文件(以.DPR为后缀)。

　　从主菜单上选择File|Save Project As...项，Delphi会显示标题为“Save Unit1 As”的文件保存对话框，Delphi 2.0 允许用户更改存储路径，您可以在下拉式列表框中选择。最好将您的文件保存在自己的目录中。在编辑框中键入demoform.pas以保存库单元文件;然后显示标题为“Save Project As”的另一个文件保存对话框，键入sample.dpr。Delphi保存这两个文件并返回窗体窗口。不要把库单元和工程存成一样的文件名，Delphi要求两者不同。

　　第一次保存后，以后可以随时通过Speed Bar中的“Save All”和“Save file”来保存工程文件和库单元文件。一般来讲，当确认文件的改变后，要同时存储这两个文件。

　　1.2.3.4 运行工程

　　以上的操作使您有了一个自己的应用程序界面。在速度条中按动“Run”按钮(绘有绿色三角图标)，您可以看到，所生成的界面与您设计的界面是完全一致的。

　　1.2.4 改变对象的属性

　　上述的工程虽能够运行，但它对您的按动按钮操作是没有什么反应的，而且，所有部件上还写着我们不需要的字样。双击窗口的关闭按钮结束运行，回到设计界面。下面，我们将仔细讲述如何在Object Inspector中改变部件的各种属性。

　　1.2.4.1 用Properties页改变部件的属性值

　　首先要改变各种部件的标题。先给窗口命名为“Demo”。按动Object Inspector上端的Object Selector的题条或者其右端的下拉标志，找到Form1项，并点动左键，窗体被选中。在Object Inspector的Properties页中，找到Caption属性并用左键选中，将其右端的Form1改为Demo,同时，您会发现窗体的标题已经相应地做了改变。

　　用鼠标点中窗体中的Shape部件，Object Inspector列出了它的属性。选中Shape属性，您会发现右端出现了下拉标志。点动这一标志，可以查看对象的Shape属性可选值。它的形状可以是矩形、圆形、圆角矩形、方形等几种。这是我们设计后续功能的基础。

　　选中Button1按钮，此时Object Inspector已经显示出此按钮的一应属性。将它的Caption属性改为“&Rectangle”,“&”号使得Delphi特殊处理它后面的字符，在这里，按钮中的R字母被做了下划线处理，运行时，可以用“Alt-R”热键来按动这一按钮。同样，您可以将其它的两个按钮Button2和Button3的Caption属性改成需要的形状指示，譬如“RoundRec”、“Ellipse”。

　　1.2.4.2 设置窗体的缺省按钮

　　可以把某个按钮作为窗口上的缺省按钮，Delphi会为按钮加上有黑色的边缘。运行时，回车即相当于被按下。只需将此按钮的Default属性从False改成True，即将它设为窗体的缺省按钮。点动Default属性，在右端的值后面双击左键，或从下拉菜单中选取True，即可改变这一属性。Delphi中有许多只有True、False两个属性的部件，双击左键可以在这两个值之间切换。