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为后缀)。