囫·易语言图解教程一 第七章组件的使用 本章主要介绍“易语言”中的组 件是如何添加和使用的,并用几个简 单的小例程来了解组件的属性,事件, 和方法 本章学习内容 7.1如何用组件设计程序界面75了解组件的方法 72动态修改组件属性 76组件实际应用一—网络电视 7.3初步了解组件事件 77课后练习 74事件的应用一一电子表 相信大家已经使用过易语言中的好多种组件了,对组件已经不陌生了,但你 知道吗,组件中的很多属性都有它特殊的用途,并且,有很多组件都有它特有的事 件和方法,只有对这些事件和方法都了解,编程时才更加得心应手了 136
136 本章主要介绍“易语言”中的组 件是如何添加和使用的，并用几个简 单的小例程来了解组件的属性，事件， 和方法。 第七章 组件的使用 本章学习内容： 7.1 如何用组件设计程序界面 7.5 了解组件的方法 7.2 动态修改组件属性 7.6 组件实际应用——网络电视 7.3 初步了解组件事件 7.7 课后练习 7.4 事件的应用——电子表 相信大家已经使用过易语言中的好多种组件了，对组件已经不陌生了，但你 知道吗，组件中的很多属性都有它特殊的用途，并且，有很多组件都有它特有的事 件和方法，只有对这些事件和方法都了解，编程时才更加得心应手了
第章—组俳的使朋 71如何用组件设计程序界面 很多软件都有漂亮的可视化界面,那 么这些漂亮的软件界面是如何创建的呢? 这就是组件的作用了,本节就来教大家如 何为自己的程序设计一个漂亮的界面。 要想对程序的界面进行设计,我们就 要先了解组件的各种不同的属性 首先,新建一个 程序,产生一个窗 这个窗口显示了被选 中组件的所有属性。可以 直接在这里改变组件的属 芴E程 r工具窗口B帮助 这个窗 在程序后动后目 口,列出了圆國 易语言提供-字_F 的所有的组 国s非 件 回国到 「配标指 ]國 回回 扩展组件 在此处选择加入事件处理子程序 外部组件 数据类型为:文本型。本属性记录当前所选择对象的名称 79t出已改 137
137 7.1 如何用组件设计程序界面 很多软件都有漂亮的可视化界面，那 么这些漂亮的软件界面是如何创建的呢？ 这就是组件的作用了，本节就来教大家如 何为自己的程序设计一个漂亮的界面。 要想对程序的界面进行设计，我们就 要先了解组件的各种不同的属性。 首先，新建一个 程序，产生一个窗 口。 这个窗 口，列出了 易语言提供 的所有的组 件。 这个窗口显示了被选 中组件的所有属性。可以 直接在这里改变组件的属 性
·易语音图解教程一 ①点击底图属 ②在弹出的窗口中选择 性旁边的小按钮。 张精美的图片。 E程满辑y查 B数据库调试B行I工具留帮 「②园|m巴m,。 基本红件 字 国国 口回国 ]圆必 aam回 文件类型①D:所有文件() 望开刚止序性 外可事件氓件 效烈为:字节集,本属性指定易界在口背是上的图片按下D桃图可眼行内客 出Y225已改 刚加完底 ③然后点 图的窗口。 击打开按 哇!出现了 这么大的一个苹 果图片,怎么办 138
138 ①点击底图属 性旁边的小按钮。 ②在弹出的窗口中选择 一张精美的图片。 ③然后点 击打开按 钮。 哇！出现了 这么大的一个苹 果图片，怎么办 呢？ 刚加完底 图的窗口
第章—组俳的使朋 绣易语言一E:作第7章控件的添加与使用例程军果留口设计,。二W1n口程“[国口:启动窗口 程序E编辑查看1折入1数据库1调试B运行t工具窗口M帮助 动口(口 國 字_F 丽国国 口a ③ 四腿 ④如果底图过大,可以给底图 刚才的大图片 方式属性设置成“图片居中” 已经调整成合适的 大小了 注意:如果添加了图片后又想将图片删除怎么办? 可以选中底图属性,然后点击鼠标右键,在弹出菜单中选择删除内容即可。 默认底色 底图 有数报 底图方式图片L卫野除内容 背景音乐 並写到文件 次数循环播放 可者选中“底图”属性后,按[el]键删除 仅仅给窗体了一张图片,就得到了一个与众不同的苹果窗口,我们继续将 这个苹果窗口设计成一个软件的用户登陆窗口吧! 139
139 注意：如果添加了图片后又想将图片删除怎么办？ 可以选中底图属性，然后点击鼠标右键，在弹出菜单中选择删除内容即可。 可者选中“底图”属性后，按[Del]键删除。 ④如果底图过大，可以给底图 方式属性设置成“图片居中” 刚才的大图片 已经调整成合适的 大小了。 仅仅给窗体了一张图片，就得到了一个与众不同的苹果窗口，我们继续将 这个苹果窗口设计成一个软件的用户登陆窗口吧！
·易语音图解教程一 芴易语言-E:1工作第7章控件的添加与使用\例程\果登陆窗口设计,e一 Windows窗口程序 囫E程序編辐查看I插入B数据库卫调试B运行I工具窗口甚帮助 ⑤拉出2个标签组件。形成“标 基本组件 签1”和“标签2 字_ 国s 怨1丽必母 晋通团定边框 ⑥在窗体上k 式图片居中 拉出2个编辑框 后环插放 组件。形成了 “编辑框1”和 在此处选择加入事件处理子程序 编辑框2 持库国程序届性 数据类型为:整数型。如果设定了图,本属性指定菌口常景上底图的显示方式 山超出超出已改」 易语言一E:\工作1第7控件的添加与使用例程果登陆窗口设计,e- Windows窗口程序-L…回区 ⑦将“标签1”的标题 调试运行T工具窗口甚帮 属性改成“用户名:” 标签1(标签 将标签边框属性设1② 置成“单线边框式 加当园 国到 渐变育景 扩展组件 外部组件 序性 外部事件组件 数据类型:整数本性记录当前对票在前口或父组件中的顶边青,单位为 山超出超出已改 ⑨将标签1的背景颜色属 用修改标签1的方法,来修改标签2的 性设置成深青色 属性。不同的是将标签2的标题改成“密码:
140 ⑤拉出 2 个标签组件。形成“标 签 1”和“标签 2”。 ⑥ 在窗体上 拉出 2 个编辑框 组 件 。 形成 了 “编辑框 1”和 编辑框 2。 ⑦将“标签 1”的标题 属性改成“用户名：” ⑨将标签 1 的背景颜色属 性设置成深青色。 ⑧将标签边框属性设 置成“单线边框式”。 用修改标签 1 的方法，来修改标签 2 的 属性。不同的是将标签 2 的标题改成“密码：
第章—组俳的使朋 都用过自动提款机吧?输入 密码的地方是不能显示出来了 我们设计的登陆窗体中的“编辑 框2”也是用来输入密码的,所 以也要作好保密工作呀! ⑩将编辑框2,即输入密码的编辑 框的输入方式属性设置成“密码输入”。 易语言E:\工作第7亨一应件的深加与使用\例程\果登陆窗口设计 e- indows窗口程序- 里程序E编Y查看 库调基运行R窗口B帮助 国品》电 國國 字」 国目圉 节器 标当回 选择字符惹 林设计时不可用 A 数涯 岂品画g回 在此处选择加入事件处理子程序 印组件 空支库程序黑性 外部事件组件 数据类型为:整数型,本屈性记录当前对在窗口或父组件中的顶边位置小位为像常点 运行以后,由于编辑框2的输入方 式改成“密码输入”,输入的内容就保 密了,输入的密码都用星号显示。 141
141 ⑩将编辑框 2，即输入密码的编辑 框的输入方式属性设置成“密码输入”。 都用过自动提款机吧？输入 密码的地方是不能显示出来了， 我们设计的登陆窗体中的“编辑 框 2”也是用来输入密码的，所 以也要作好保密工作呀！ 运行以后，由于编辑框 2 的输入方 式改成“密码输入”，输入的内容就保 密了，输入的密码都用星号显示
·易语音图解教程一 易语言一E:\工作第7控件的添加与使用\绍生里在 E程序g编y查看工抵入B数鬼库p调 最后,再拉出2个按钮 ②品》。m田”组件,就形成了“按钮1” 和“按钮2”。 按钮1(按钮 基本组件 [囚國 停龆顺序 口回国 1圆必 ag国 在此处选挥加入事件处理子程序 外部魍件 ②支持库程序屈性 外部事件组件 数揭类型为:文本型,标题只有在图片为空时才有效,如果 将2个按钮的标题属性,分别 改成“登陆”和“退出”。 好拉,一个登陆窗口就做好了,怎么样,好看吗?这个窗口可以用来 控制一个软件的使用,只有输入正确的用户名和密码以后,才可以继续使 用软件,这样其他人就不能乱用你编写的程序了。 当然,光有窗口是不行的,还要在按钮组件被单击的事件中输入其他 的代码才行。组件的事件如何使用呢?下面将在介绍控件事件的时候做详 细介绍。 你还想得到更加特别,更加与众不同的 窗口吗?易语言可以帮助你实现。易语言为 你准备了29种精美而特别的窗体外形。 14
142 最后，再拉出 2 个按钮 组件，就形成了“按钮 1” 和“按钮 2”。 好拉，一个登陆窗口就做好了，怎么样，好看吗？这个窗口可以用来 控制一个软件的使用，只有输入正确的用户名和密码以后，才可以继续使 用软件，这样其他人就不能乱用你编写的程序了。 当然，光有窗口是不行的，还要在按钮组件被单击的事件中输入其他 的代码才行。组件的事件如何使用呢？下面将在介绍控件事件的时候做详 细介绍。 你还想得到更加特别，更加与众不同的 窗口吗？易语言可以帮助你实现。易语言为 你准备了 29 种精美而特别的窗体外形。 将 2 个按钮的标题属性，分别 改成“登陆”和“退出
第章—组俳的使朋 改变窗体外型:①将窗体组件的边框属性设置成“无边框”的 易易语言-E:f\第7章控件的添加与用\例程\果登陆窗口设计e-1 程序【看11%h区基运行工具留口B帮助 z田 启动窗口(留口) 外形是“ 角星”的窗体 片居中 环排 加当國 围口回国翅 逦舀 可否移动 ②将窗体的外形属性 设置成“五角星”。 设计完更加特别的窗体外形以后,你的窗体就焕然一新了 还可以换上其他的外形看看,哪个更漂亮? 环 在此处选择加入 支持库国6.左三角 外形属性的的 小箭头被点击 行四边形 后,就列出了29 10六边形 中外型的被选 11.梯形 项。可以给窗体 13.五角星 更换不同的外 17爆炸形2
143 设计完更加特别的窗体外形以后，你的窗体就焕然一新了。 还可以换上其他的外形看看，哪个更漂亮？ 外形属性的的 小箭头被点击 后，就列出了 29 中外型的被选 项。可以给窗体 更换不同的外 型。 ②将窗体的外形属性 设置成“五角星”。 外形是“五 角星”的窗体。 改变窗体外型：①将窗体组件的边框属性设置成“无边框”的 样式
·易语音图解教程一 72动态修改组件属性 修改了这么多组件的属性,都是手动的去修改,这些修改工作是要在编写 程序以前就做好的 那在编写程序的时候想要随时的用代码修改组件的属性可以吗? 其实组件的属性都可以用代码的形式在程序运行的过程中动态的去改变。 动态改变组件属性的方法也是最常用和最灵活的方法。下面就介绍一下如何动 态的来修改组件的属性。 动态改变组件属性的基本方法是: 组件名.组件属性=要给组件属性的值 把刚才编写的登陆窗口保存好,记住 保存在哪,下面会使用到它 下面跟着例子新建一个易程序 ②点击按钮组件后,在窗 ①点击标签组件后,在窗体中拉出 体中拉出一个按钮组件。形成 个标签组件。形成“标签1”。 “按钮1” 易易方一Tmh口序=m3动 曷E程序L描Y查着工插入B数拓调试B 自②固啪自c的m田 | 部程序数据 日全局变量 自定义数据类型 □启动窗口 扩展组件 Q资表 外部组件 持库国程序性厂 外部事件组件 数据类型为:文本型。本属性记录当前所选择对象的名称 x:2571:34已改 144
144 7.2 动态修改组件属性 修改了这么多组件的属性，都是手动的去修改，这些修改工作是要在编写 程序以前就做好的。 那在编写程序的时候想要随时的用代码修改组件的属性可以吗？ 其实组件的属性都可以用代码的形式在程序运行的过程中动态的去改变。 动态改变组件属性的方法也是最常用和最灵活的方法。下面就介绍一下如何动 态的来修改组件的属性。 动态改变组件属性的基本方法是： 组件名.组件属性=要给组件属性的值 把刚才编写的登陆窗口保存好，记住 保存在哪，下面会使用到它。 下面跟着例子新建一个易程序。 ①点击标签组件后，在窗体中拉出 一个标签组件。形成“标签 1”。 ②点击按钮组件后，在窗 体中拉出一个按钮组件。形成 “按钮 1
第章—组俳的使朋 标签 ③双击“按钮1”。 苏易语言- Windows窗口程序-程序集:窗口程序集1/启动窗口 E程序【編锡Y查看工插入E数据库卫调试B运行I工具里窗口g帮助 「国②显启cm日田· H 口程序集 注 序数据 定义数据类型 启动窗口 双击按钮1后, 常量表 ◇资没表 进入了按钮1被单 击子程序的程序设 支量程一 计界面。然后输入代 动态的改变标签的标题属性。屋序名返回值类型公开 按钮1_被单击 让标签的位置发生 求签1,标题=“动态改变标签属性” 改变,代码运行时 签1.左边=标签1.左边+10 反复调用该属性的 莓签1.顶边=标签1.顶边+1 前一个值。 标签1.边框=6 背 景色三取随机数(250025525000 改变标签的边框 凹入式 随机改变标签的背景颜色。由于颜色 入式 属性其实是一个数值型的,所以用 单线边框式 取随机数(255000,255255000) 145
145 ③双击“按钮 1”。 双击按钮 1 后， 进入了_按钮 1_被单 击子程序的程序设 计界面。然后输入代 码… 动态的改变标签的标题属性。 随机改变标签的背景颜色。由于颜色 属性其实是一个数值型的，所以用 取随机数 (255000, 255255000) 改变标签的边框。 让标签的位置发生 改变，代码运行时 反复调用该属性的 前一个值