图形界面设计与项目.pptx

《图形界面设计与项目.pptx》由会员分享，可在线阅读，更多相关《图形界面设计与项目.pptx（109页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、通过大量实例阐明了文本对象常用控件的属性、方法。并将常用的文本处理过程与函数集中讲解。进一步阐明了代码编辑器的使用，包括代码编辑器的一些重要功能。解释了项目的概念，以及如何使用项目管理器。返回本章首页第1页/共109页3.1 菜单的设计菜单的设计3.1.1 菜单界面3.1.2 主菜单设计3.1.3 弹出型菜单设计返回本章首页第2页/共109页3.1.1 菜单界面菜单界面菜单命令被选中后，一般来说有以下三种作用：用于执行某种应用程序的操作。用于设置某特殊选项的状态，这些命令常用复选标记“”或单选标记“”来表明该选项是否处于有效状态。用于打开对话框，具体操作在对话框中进行。第3页/共109页图3-

2、1WordXP中文版“插入”菜单返回本节第4页/共109页3.1.2 主菜单设计主菜单设计1、MainMenu控件的设计用鼠标右键单击MainMenu控件图标，打开一个弹出式菜单，从中选择MenuDesigner命令。先在窗体中单击MainMenu控件图标，然后在对象监视器中单击Items属性编辑框右边的省略号按钮。打开后的主菜单设计器窗口如图3-2所示。鼠标双击窗体中的MainMenu控件图标。第5页/共109页图3-2主菜单设计器窗口第6页/共109页2菜单设计方法（1）增加菜单项（如图3-3所示）（2）编辑菜单项（3）插入菜单项（如图3-4所示）（4）删除菜单项（5）增加分隔条（如图3-

3、5所示）（6）定义加速键和快捷键（如图3-6、3-7所示）（7）调整菜单位置（见图3-8）（8）创建子菜单（9）菜单模板（如图3-9所示）第7页/共109页图3-3设置中的“文件”菜单第8页/共109页图3-4插入菜单项窗口第9页/共109页图3-5设计了分隔条的“文件”菜单第10页/共109页图3-6“文件”菜单示例第11页/共109页图3-7加速键设计图第12页/共109页图3-8菜单设计器的弹出式菜单第13页/共109页图3-9菜单模板窗口第14页/共109页图3-10保存模板对话框返回本节第15页/共109页3.1.3 弹出型菜单设计弹出型菜单设计选中Form对象后转换到属性页，并单击

4、“PopupMenu”右边的空白框，选中设计完的弹出型菜单名称，最后运行程序即可如图所示。图3-11激活的弹出式菜单返回本节第16页/共109页3.2 工具栏的设计工具栏的设计（1）启动新窗口（2）添加按钮（如图3-12所示）（3）为按钮提供位图（如图3-1315所示）（4）为各个按钮添加提示信息（5）分别为有关工具按钮添加有关事件代码。返回本章首页第17页/共109页图3-12工具栏设计菜单第18页/共109页图3-13选择图像窗口第19页/共109页图3-14设置Images特性第20页/共109页图3-15添加完图标的工具栏返回本节第21页/共109页3.3 状态栏的设计状态栏的设计（1

5、）单击Win32页中的StatusBar状态栏控件见图3-16（2）双击状态栏的Panels属性，并从中选择“Panels Editor”命令即可，如图3-17所示。（3）单击窗口中的“New”按钮，就会增加一个子面板。（4）在对象监视器中设置子面板的属性。（5）关闭Editing StatusBar1.Panels窗口。返回本章首页第22页/共109页图3-16具有状态栏的窗口第23页/共109页图3-17EditingStatusBar1.Panels窗口返回本节第24页/共109页3.4 按钮及面板的设计按钮及面板的设计3.4.1 基本命令按钮3.4.2 位图命令按钮3.4.3 单选按钮

6、3.4.4 分组框3.4.5 单选按钮组3.4.6 面板3.4.7 框架3.4.8 状态面板3.4.9 酷工具栏控件返回本章首页第25页/共109页3.4.1 基本命令按钮基本命令按钮属性数据类型说明NameString按钮的名称，编写程序代码时使用它CaptionString按钮的标题，就是按钮上显示的文字。可以为按钮指定快捷键CancleBoolean缺省值为False，当取值为True时，无论何时按下Esc键，按钮中Taborder值最小的按钮会产生Onclick事件DefaultBoolean当属性值为True时，按下Enter键，当前按钮产生Onclick事件，缺省值为TrueHin

7、tString按钮的提示文本保存在这里，当鼠标光标停留时，显示提示文本ShowhintBoolean确定是否显示提示文本，缺省值为False表3-1按钮的主要属性返回本节第26页/共109页3.4.2 位图命令按钮位图命令按钮属性数据类型说明KindGlyphLayoutMarginNumGlyphsSpaceTBitBtnKindTBitmapTbuttonlayoutIntegerTNumGlyphsTbuttonstyle用于确定按钮的类型，缺省值为自定义型bkcustom用于指定要显示在位图按钮上的位图决定位图按钮上图像和文字的位置，有Left，Right，Top，Bottom四个值分

8、别表示位图位于位图按钮的左、右、上、下用于设定图像与按钮的边界之间的距离（以像素为单位），默认值为1，表示图像和文字总是居中，设为0表示紧挨着按钮的边界指定位图按钮使用的位图的数目，只能为1，2，3，4确定位图按钮的外观显示方式，缺省为bsautodetect表3-2位图按钮的属性第27页/共109页表3-3各按钮属性属性属性Button1Button2BitBtn1BitBtin2BitBtn1BitBtn2CaptionButton1Button2对话框对话框&CloseOkCancelKindbkCustombkClosebkOkbkCancelCancelFalseTrueFalseF

9、alseFalseFalseDefaultTrueFalseFalseFalseFalseFalseModalResultmrNonemrNonemrNonemrNonemrOkmrCancel第28页/共109页属性说明Cancel该属性值为True时,则无论用户何时按Esc键,都会执行该按钮的OnClick事件。如果同一个窗体上具有多个这样的按钮,则会执行TabOrder值最小的按钮的OnClick事件Default这个属性和Cancel属性相似。当用户按下Enter键时，将执行该按钮的OnClick事件。但有一个例外，如果当前拥有输入焦点的控件为另一个按钮时，按Enter键时则只执行当前

10、按钮的OnClick事件Kind这个属性为位图按钮所特有，选择Kind属性的某个选项，用于决定该位图按钮的种类每一种位图按钮具有自己独特的功能。位图按钮常用于各种对话框或模态窗口中，根据按钮的ModalResult属性值来决定对模态窗口的操作ModalResult模态值。当单击位图按钮时，将把对话框的模态值设为相同的值。它将决定位图按钮的父窗体的关闭方式。如单击mbOk按钮,将关闭对话框，返回mrOk值表3-4各按钮属性说明返回本节第29页/共109页3.4.3 单选按钮单选按钮图3-22单选按钮实例第30页/共109页属性数据类型说明AlignmentTleftRight用于设置单选框的文字

11、与小圆圈的位置关系，taLeftJustify表示文字显示在小圆圈的左边；taRightJustify表示文字显示在小圆圈的右边CheckedBoolean这个属性用于设置选项是否被选中，当值为True时，表示选中；当值为False时，表示未选中表3-5单选按钮属性返回本节第31页/共109页3.4.4 分组框分组框图3-23分组框示例返回本节第32页/共109页3.4.5 单选按钮组单选按钮组图3-24单选按钮组示例第33页/共109页表3-6单选按钮组的常用属性属性数据类型说明ColumnsLongint用于设置单选按钮组中的栏数，默认值为1，最大可设为16ItemIndexInteger

12、用于返回单选按钮组中被选择的项的序号，第一项为0ItermsTstring在设计期，可以在编辑器中输入每个单选框的标题，在运行期，可以通过Tstrings对象来操纵Iterms特性返回本节第34页/共109页3.4.6 面板面板表3-7面板控件的常用属性(1)属性数据类型说明AlignTAlign用于设置面板控件在窗体中的放置位置BevelInnerTbevelCut用于设置面板的内部斜面样式，可以设为以下值：bvNone（没有斜面），bvLowered（沉降的斜面），bvRiased（升起的斜面）BevelOuterTBevelCut用于设置面板的外斜面形式第35页/共109页BevelWi

13、dthInteger面板的斜面宽度BorderStyleTBorderStyle面板的边框样式BorderWidthInteger面板的边框宽度Captionstring用于设置面板控件使用的标题ControlCountInteger用于设置面板中的子控件数目ControlsTControl用于设置面板中的控件数目EnabledBoolean用于设置面板中的所有子控件是允许还是被禁用HandleHWnd代表面板的窗口句柄表3-7面板控件的常用属性(2)返回本节第36页/共109页3.4.7框架框架1创建框架（图3-25表3-8）2框架的共享（1）添加框架到控件板上（如图3-27、3-28所示）

14、（2）添加框架到对象库中（如图3-29、3-30所示）3框架的使用（如图3-3133所示）第37页/共109页图3-25新建的框架第38页/共109页n表3-8框架的属性属性属性值NameFontHeightWidthMFrane华彩、五号160190第39页/共109页图3-27“ComponentTemplateInformation”对话框第40页/共109页图3-28新添加的框架图标第41页/共109页图3-29“AddtoRepository”对话框第42页/共109页图3-30添加了框架的对象库第43页/共109页图3-31确认添加单元文件对话框第44页/共109页图3-32添加了

15、框架的窗体第45页/共109页图3-33SelectFrametoInsert对话框返回本节第46页/共109页3.4.8 状态面板状态面板Bevel控件的常用属性如下：Shape：数据类型为TBevelShape，用于定义形状。可供选择的值如表3-10所示。Style：数据类型为TBevelStyle，用于确定斜面是否凹陷或凸起。当选择bsLowered值时，斜面凹陷；当选择bsRaised值时，斜面凸起。如图3-34所示。第47页/共109页值含义bsBox矩形框，根据Style属性决定客户区域的凹陷与凸起bsFrame矩形轮廓，客户区域由凹陷与凸起的轮廓包围bsTopLine在客户区域的

16、上边显示一条线bsBottomLine在客户区域的下边显示一条线bsLeftLine在客户区域的左边显示一条线bsRightLine在客户区域的右边显示一条线bsSpacer客户区域为空表3-10Shape取值第48页/共109页图3-34状态面板中Style属性的不同取值返回本节第49页/共109页3.4.9 酷工具栏控件酷工具栏控件表3-11TCoolbar控件的属性属性数据类型说明AlignTAlign用于设置TCoolBar控件建立的工具栏的位置AutoSizeBoolean用于对工具栏的尺寸的自动调节BandBorderStyleTBorderStyle用于设置工具栏上波段的边框风格

17、BandsTCoolBands用于编辑波段第50页/共109页BitmapTBitmap用于指定一个位图，作为背景显示在工具栏上FixedOrderBoolean当设为True，段可以进行拖曳，但段的顺序不变FixedSizeBoolean用于尺寸设置ImageTImageList用于指定一个图像列表，显示在每个段的左边ShowTextBoolean如果该特性设置为True，可以在运行期间把一个字符显示在段上，字符串由段的Text特性指定。如果该特性设置为False，段只能显示窗口类控制VerticalBoolean如果该特性设置为True，工具栏的段本身是垂直的，多个段从左到右排列。如果Ve

18、rtical为False，工具栏的本身是水平的，多个段从上到下排列返回本节第51页/共109页3.5 文本对象的设计文本对象的设计3.5.1 标签3.5.2 静态文本3.5.3 编辑框3.5.4 掩码编辑框3.5.5 列表框3.5.6 组合框3.5.7 多行文本编辑器3.5.8 复选框3.5.9 常用文本处理过程和函数返回本章首页第52页/共109页3.5.1 标签标签标签的常见属性如下：Caption：用于设置标签的标题，即标签的显示内容。FocusControl：该属性为标签控件独有，可以用来为一些无标题的控件提供快捷键。Autosize：用于决定标签是否随字体的变化而自动变动尺寸以配合这

19、些变化。Font：用于设置标签文字的字体格式和大小。返回本节第53页/共109页3.5.2 静态文本静态文本静态文本控件（StaticText）与标签控件基本相同，唯一不同之处在于静态文本控件是窗口型控件，具有窗口句柄。因此，当控件的快捷键必须属于窗口型控件的时候，应该使用静态文本控件，而不能使用标签控件。静态文本控件位于控件板的Additional选项页上，操作方法与标签相同。返回本节第54页/共109页3.5.3 编辑框编辑框编辑框的常用属性有：AutoSelect、AutoSize、BorderStyle、TextMaxLength、PasswordChar、ReadOnlyIMEMod

20、e、IMEName。第55页/共109页编辑框控件的常用事件如下：OnKeyPress事件的功能：在编辑框输入完文本后，按一下Enter键，程序就开始执行。编辑框的文本发生改变时触发OnChange事件。编辑框获得输入焦点时触发OnEnter事件。编辑框失去输入焦点时触发OnExit事件。返回本节第56页/共109页3.5.4 掩码编辑框掩码编辑框在窗体上将MaskEdit选中，在对象监视器中找到EditMask属性，双击它，弹出一个如图3-36所示的对话框。掩码格式可以分为三部分：（1）输入格式的第一部分是掩码本身，也就是数据输入格式(如表3-12所示)。（2）在输入格式中的第二部分只有0和

21、1两种选择（3）输入格式的第三部分用于表示数据中的空位用那个字符代替显示。第57页/共109页图3-36输入掩码编辑器第58页/共109页表3-12输入格式符(1)格式符意义l和Ll表示该位置只可能是一个字母，可以用光标键跳过它，但是不能是其他类型的字符。L该位置必须是一个字符a和Aa表示该位置只可能是一个字母或数字字符。A表示该位置必须是一个字母或数字字符c和Cc表示该位置只可能是一个字母，C表示该位置必须有一个字母第59页/共109页9和和09表示该位置只可能是一个数字，表示该位置只可能是一个数字，0表示该位置必须有一个数字表示该位置必须有一个数字格格式式字符或字符或格式符。格式符。格式符

22、则和格式符则和正好相反正好相反表表示示该该格格式式符符之之后后的的那那个个掩掩码码格格式式符符将将作作为为数数据据中中的的普普通通字字符符对对待待。当当用用户户想想在在数数据据中中放放进进一一个个掩掩码码格格式式符符时时，应应该该在在这这个个格格式式符符前前放放一个一个符号。如符号。如A，等等等等#表示该位置可能是一个数字或正符号表示该位置可能是一个数字或正符号!如如有有!表表示示数数据据前前的的空空格格将将不不被被保保存存在在数数据据中中，没没有有!则则数数据据后后的的空空格不被保存。格不被保存。!格式符只能放在掩码格式符的第一个字符处格式符只能放在掩码格式符的第一个字符处;和和/标标准准的

23、的分分隔隔符符，可可作作为为数数据据的的一一部部分分。其其中中/在在显显示示时时为为而而非非/表3-12输入格式符(2)返回本节第60页/共109页3.5.5 列表框列表框列表框控件的一些常用属性有：ExtendedSelect、Items、ItemIndex、MultiSelected、SelCount、Selected、Sorted。返回本节第61页/共109页3.5.6 组合框组合框组合框的常用属性有：Text、SelText、SelStart、SelLength、Style设计后的效果如图3-37所示。第62页/共109页图3-37列表框使用实例第63页/共109页（1）单击“File

24、”菜单的“Application”命令，开始一个新的应用程序。（2）设置窗体属性（如表3-13所示）。（3）设置完后往窗体中添加控件。（4）在对象编辑器中设置各个控件的属性值（如表3-14所示）。（5）为各个控件添加事件（如表3-15）。（6）添加完事件后，为各个事件编写事件代码（如图3-35所示）。第64页/共109页表3-13窗体属性属性属性属性值属性值Caption列表框的使用列表框的使用Font宋体、五号宋体、五号Height334Width350第65页/共109页表3-14控件属性设置第66页/共109页表3-15各控件的事件控件事件响应过程名ListBox1ComboBox1Bu

25、tton1Button2Button3Button4OnClickOnChangeOnClickOnClickOnClickOnClickChangeTextChangeTextButton1ClickButton2ClickButton3ClickButton4Click返回本节第67页/共109页3.5.7 多行文本编辑器多行文本编辑器Memo控件常用的方法：（1）使用剪贴板（2）文本的添加（3）文件的保存和装载（程序的界面如图3-38所示）。第68页/共109页表3-16Memo控件常用属性属性说明Lines这是Memo控件最常用也是最有用的属性，它用来显示和保存Memo控件中的内容Sc

26、rollbar很多控件都有这个属性。用于设定控件有否滚动条。它有四个值：SSNone表示既无水平滚动条，也无垂直滚动条；SSHorizontal表示只有水平滚动条；SSVertal表示只有垂直滚动条；SSBoth表示两者都有。当用户要显示的文本或其他的内容较多时，建议选用SSBoth第69页/共109页WordWrap用于设定用于设定Momo控件是否具有自动折行功能控件是否具有自动折行功能WantTabs这个属性只在这个属性只在Memo、RichEdit和和DBMemo控件中使用。控件中使用。通常在切换当前焦点控件时，我们通常使用通常在切换当前焦点控件时，我们通常使用Tab键。但在上键。但在上

27、述三种控件中，编辑文本时常用述三种控件中，编辑文本时常用Tab键来跳过若干个空格使键来跳过若干个空格使文本对齐，这时就会有冲突。所以应将文本对齐，这时就会有冲突。所以应将WantTabs设置为设置为True，这样子在控件内就可以使用这样子在控件内就可以使用Tab键来编辑文本键来编辑文本第70页/共109页图3-38简单的文本编辑器返回本节第71页/共109页3.5.8 复选框复选框图3-39复选框示例第72页/共109页复选框的几个重要属性：Alignment：数据类型为TLeftRight，用于控制复选框标题的位置。Allowgrayed：数据类型为Boolean，用于确定复选框是否可以处于

28、灰色显示状态。Checked：数据类型为Boolean，用于确定复选框是否被选中，缺省为False。State：数据类型为TCheckBoxS 返回本节第73页/共109页3.5.9 常用文本处理过程和函数常用文本处理过程和函数（1）编辑框的常用处理过程与函数（2）列表框的常用处理过程与函数（3）组合框的常用处理过程与函数返回本节第74页/共109页3.6 有关窗体的操作有关窗体的操作3.6.1 向项目中加入新的Form3.6.2 在多个Form或单元间切换3.6.3 在一个Form中调用另一个Form3.6.4 在不同项目间共享Form3.6.5 把Form以ASCII格式储存3.6.6 使

29、用Form模板和向导3.6.7 在窗体上对控件进行编辑返回本章首页第75页/共109页3.6.1 向项目中加入新的向项目中加入新的Form（1）依次单击“Tools”“Repository”命令打开对话框如图3-40所示。（2）在Pages栏内选择Forms，这时Object栏中将显示所有的Forms模板，从中选择一个，本例选择Aboutbox型窗体。（3）确定该模板为新Form或主Form，通过单击下面的复选按钮来完成。本例全部选中，然后单击”OK”按钮即可，如图3-41所示。第76页/共109页图3-40“ObjectRepository”对话框第77页/共109页图3-41“Aboutb

30、ox”窗体返回本节第78页/共109页3.6.2 在多个在多个Form或单元间切换或单元间切换依次单击菜单“View”“Forms”命令，打开View Form对话框，如图3-42所示。从列表框中选择一个窗体后，单击”OK”按钮。在多个单元间切换同窗体一样。通过依次单击“View”“Units”命令，打 开 View Unit对 话 框，如 图 3-43所 示。或 单 击 工 具 栏 上 的“Units”按钮亦可。第79页/共109页图3-42ViewForm对话框第80页/共109页图3-43ViewUnit对话框返回本节第81页/共109页3.6.3 在一个在一个Form中调用另一个中调用

31、另一个Form当项目中添加了一个新的窗体时，系统会自动将窗体的单元名加入到项目文件的Uses子句中。通常是把Uses子句放到各自单元的Implementation部分或者把一个单元的Uses子句放到Interface部分，另一个单元的Uses子句放到Implementation部分。通常的Form类型如图3-44所示。返回本节第82页/共109页3.6.4 在不同项目间共享在不同项目间共享For要与其他项目共享一个Form，有两种方法，其一为，把它加入到对象库中；其二为，把Form编译成动态链接库。如图3-45、46所示。第83页/共109页图3-44Form类的定义第84页/共109页图3-

32、45加入到对象库对话框返回本节第85页/共109页3.6.5 把把Form以以ASCII格式储存格式储存用鼠标右键在窗体上单击，打开弹出式菜单，并从中选择“View As Text”命令，如图3-46所示。若要保存，单击“File”菜单的“Save As”命令即可。第86页/共109页图图3-46窗体的窗体的.DFM文件文件返回本节第87页/共109页3.6.6 使用使用Form模板和向导模板和向导首先使用“File”菜单的“New”命令打开“New Iterms”对话框，如图3-47所示。然后从中指定一个Form模板，窗体中包含有对话框、数据列表框、主从式报表等。最后单击”OK”按钮。第88

33、页/共109页图3-47“NewIterms”对话框返回本节第89页/共109页3.6.7 在窗体上对控件进行编辑在窗体上对控件进行编辑（1）添加控件到Form上（2）在Form上重复添加同一个控件（3）在Form上选择控件的几种方法（4）移动、删除控件以及调整控件大小（5）排列控件（如图3-48所示）第90页/共109页图3-48Alignment对话框返回本节第91页/共109页3.7 有关代码编辑器的使用有关代码编辑器的使用3.7.1 代码编辑器窗口的打开和切换3.7.2 代码编辑器的功能返回本章首页第92页/共109页3.7.1 代码编辑器窗口的打开和切换代码编辑器窗口的打开和切换代码

34、编辑器是一个典型的多页窗口，可以通过用鼠标单击页头的方式，在各个页间切换。每一页显示一个已打开的单元。如图3-49所示。但是若想要编辑一个还没有打开的单元，则要使用“View”菜单下的“Unit”命令或单击工具栏上的按钮打开View Unit对话框，如图3-50所示。第93页/共109页图3-49代码编辑器窗口第94页/共109页图3-50ViewUnit对话框返回本节第95页/共109页3.7.2 代码编辑器的功能代码编辑器的功能1语句模板功能(如图3-51、3-52所示)2代码完成功能（如图3-53所示）3参数提示功能（如图3-54所示）第96页/共109页图3-51语句模板列表框第97页

35、/共109页图3-52使用语句模板完成的If语句第98页/共109页图3-53代码完成功能选单第99页/共109页图3-54参数提示实例窗口返回本节第100页/共109页3.8 项目管理项目管理3.8.1 项目的概念3.8.2 项目文件的打开和保存3.8.3 项目文件的编译和运行3.8.4 项目管理器返回本章首页第101页/共109页3.8.1 项目的概念项目的概念（1）项目文件：描述了整个应用程序的结构和启动代码，包含本项目使用的所有窗体和单元的引用（如图3-55所示）。（2）窗体文件：每一个窗体都有相应的窗体文件（.DFM），它保存着窗体和窗体内各个控件的属性如图3-56所示。（3）单元文

36、件：用来保存窗体事件的处理过程或单独的源代码，是应用源代码的主要部分。分为两种：有窗体的单元文件和无窗体的单元文件。第102页/共109页图3-55项目文件的内容第103页/共109页图3-56窗体文件返回本节第104页/共109页3.8.2 项目文件的打开和保存项目文件的打开和保存要打开一个你以前曾用过的项目，选择“File”菜单的“Open Project”命令，出现标准的Windows 打开文件窗口，从中选择一个项目即可。要保存当前项目，选择“File”菜单“Save”命令。返回本节第105页/共109页3.8.3 项目文件的编译和运行项目文件的编译和运行（1）编译链接（2）重建项目（3）只编译文件返回本节第106页/共109页3.8.4 项目管理器项目管理器图图3-57项目管理器项目管理器返回本节第107页/共109页THANK YOU VERY MUCH！本章到此结束，谢谢您的光临！结束放映返回本章首页第108页/共109页感谢您的观看。第109页/共109页