十天学会易语言_易语言教程_第⑦章__组件的使用

7.1 如何用组件设计程序界面 7.2 动态修改组件属性 7.3 初步了解组件事件 7.4 事件的应用—电子表 7.5 了解组件的方法 7.6 组件实际应用-网络电视 7.7 课后练习 第七章 组件的使用 本章主要介绍“易语言”中的组件是如何添加和使用的，并用几个简单的小例程来了解组件的属性，事件，和方法。 本章学习内容： 7.1 如何用组件设计程序界面 7.5 了解组件的方法 7.2 动态修改组件属性 7.6 组件实际应用——网络电视 7.3 初步了解组件事件 7.7 课后练习 7.4 事件的应用——电子表 相信大家已经使用过易语言中的好多种组件了，对组件已经不陌生了，但你知道吗，组件中的很多属性都有他特殊的用途，并且，有很多组件都有它特有的事件和方法，只有对这些事件和方法都了解了以后，以后的编程就更加得心应手了。 看到很多软件都有它漂亮的界面，这些软件漂亮的界面是如何获得的呢？这就是组件的作用了，本章教大家如何为自己的程序设计一个漂亮的界面。 要想对程序的界面进行设计，我们就要先了解组件的各种不同的属性。 ⑤将超文本浏览框1的可视属性设置成假。 ④选择超文本浏览框组件，拉出一个和刚才窗体底图上黑色部分大小相同的超文本浏览框，形成了“超文本浏览框1”。 选好图片后，点击“打开”按钮。 ③拉出3个按钮组件，分别将标题属性改成“播放cctv1”、“播放cctv9”、“结束播放”。 选择一张图片，作为播放器的界面。 ①点击底图属性的小按钮。 ②在弹出的窗口中选择一张精美的图片。 ③然后点击打开按钮。 图片没有完全显示，怎么办呢？ ④如果底图过大，可以将底图方式属性设置成“图片居中”。 用修改标签1的方法，来修改标签2的属性。不同的是将标签2的标题改成“密码：” 注意：如果添加了图片后又想将图片删除怎么办？ 可以选中底图属性，然后点击鼠标右键，在弹出菜单中选择删除内容即可。 可者选中“底图”属性后，按[Del]键删除。 ⑥在窗体上拉出2个编辑框组件。形成了“编辑框1”和“编辑框2”。 都用过自动提款机吧？输入密码的地方是不能显示出来了，我们设计的登陆窗体中的“编辑框2”也是用来输入密码的，所以也要作好保密工作呀！ 你还想得到更加特别，更加与众不同的窗口吗？易语言可以帮助你实现。易语言为你准备了29种精美而特别的窗体外形。 ⑤拉出2个标签组件。形成“标签1”和“标签2”。 动态改变组件属性的基本方法是： 组件名.组件属性＝要给组件属性的值 把刚才编写的登陆窗口保存好，记住保存在哪，下面会使用到它。 下面跟着例子新建一个易程序。 ⑦将“标签1”的标题属性改成“用户名：” ⑨将标签1的背景颜色属性设置成深青色。 ⑧将标签边框属性设置成“单线边框式”。 好啦，一个登陆窗口就做好了，怎么样，好看吗？这个窗口可以用来控制一个软件的使用，只有输入正确的用户名和密码以后，才可以继续使用软件，这样其他人就不能乱用你编写的程序了。 当然，光有窗口是不行的，还要在按钮组件被单击的事件中输入其他的代码才行。组件的事件如何使用呢？下面将在介绍控件事件的时候做详细介绍。 ⑩将编辑框2，即输入密码的编辑框的输入方式属性设置成“密码输入”。 将2个按钮的标题属性，分别改成“登陆”和“退出”。 最后，再添加2个按钮组件，就形成了“按钮1”和“按钮2”。 仅仅给窗体了一张图片，就得到了一个与众不同的窗口，我们继续将这个窗口设计成一个软件的用户登陆界面吧！ 刚加完底图的窗口。 这个窗口显示了被选中组件所有的属性。可以直接在这里改变组件的属性。 首先，新建一个程序，产生一个窗口。 这个窗口，列出了易语言提供的所有的组件。 刚才的大图片已经调整成合适的大小了。 运行以后，由于编辑框2的输入方式改成“密码输入”，输入的内容就保密了，输入的密码都用星号显示。 外形属性的小按钮被点击后，就列出了29中外型的被选项。可以给窗体更换不同的外型。 ②将窗体的外形属性设置成“五角星”。 外形是“五角星”的窗体。 设计完更加特别的窗体外形以后，你的窗体就焕然一新了。 还可以换上其他的外形看看，哪个更漂亮？ 修改了这么多组件的属性，都是手动的去修改，这些修改工作是要在编写程序以前就做好的。 那在编写程序的时候想要随时的用代码修改组件的属性可以吗？ 其实组件的属性都可以用代码的形式在程序运行的过程中动态的去改变。动态改变组件属性的方法也是最常用和最灵活的方法。下面就介绍一下如何动态的来修改组件的属性。 ①点击标签组件后，在窗体中拉出一个标签组件。形成“标签1”。 ②点击按钮组件后，在窗体中拉出一个按钮组件。形成“按钮1”。 ③双击“按钮1”。 双击按钮1后，进入了“_按钮1_被单击”子程序的程序设计界面。然后输入代码… 标签的边框和标题都改变了。并且，每次单击按钮，标签的位置和颜色都会发生改变。 注意：在给组件动态改变属性的时候，一定要注意属性本身的数据类型。也就是说，文本型的属性就给这个属性一个文本型的数据，整数型的属性就给这个属性一个整数型的数据。 比如： 标签1.标题 ＝ “动态改变标签属性” 标签的标题属性是文本型的，所以改变它的时候就要把给它的值用双引号括起来，这样就表示了一段文本型的数据。即代码中的“动态改变标签属性”。 标签1.边框 ＝ 6 标签的边框属性是整数型的，所以改变边框属性时就要给边框属性一个整数 型的数据，即代码中的6。 最后。点击“F5键”试运行程序。 每个组件都有它的事件，组件的事件就是当在一个组件上发生了某种事件后，就会运行这个事件相应的子程序。比如，_启动窗口的鼠标右键被按下的事件，选中后就会产生“_启动窗口_鼠标右键被按下”的子程序，我们在下面输入了代码，当程序运行以后，在启动窗口上点击鼠标右键，就会运行“_启动窗口_鼠标右键被按下”的子程序，同时，就执行了在这个子程序下输入的全部代码。 有些事件是每个组件都有的，叫做基本事件，还有些事件是某些组件所独有的，叫这个组件的自有事件。 动态的改变标签的标题属性。 让标签的位置发生改变，代码运行时反复调用该属性的前一个值。 随机改变标签的背景颜色。由于颜色属性其实是一个数值型的，所以用 取随机数 (255000, 255255000) 改变标签的边框。 �� 在一个组件的事件菜单中选择了一个事件以后，就会产生这个组件发生该事件的子程序。 每个组件属性窗口的最下方，都有一个列出这个组件所有事件的菜单。 如果发生了在_启动窗口中右键被按下的事件以后，就会执行这个事件下编写的代码。 还记得前面编写的有背景图案的登陆窗口吗？找到并打开它。 ②选中保存过的登陆窗口程序。 ①点击打开按钮。 ③点击打开按钮，打开选中的程序。 ④将窗口的边框改回初始的普通固定边框。 ⑤将窗口的外形改成初始的矩形 ①创建一个新程序，并将启动窗口的边框属性设置成“无边框”。 ⑥在启动窗口上点击鼠标右键，在弹出菜单中选择“插入新窗口”，就会添加一个新的窗口。 输入代码： 判断 (编辑框1.内容 ＝ “123” 且 编辑框2.内容 ＝ “456”) 判断编辑框1的内容是否等于“123”，并且，编辑框2的内容是否等于“456”，如果都满足条件，就运行判断中的代码。（即判断用户名和密码是否正确。） ⑦在新建的窗口1中，拉出一个标签，形成“标签1”。 ⑧将标签1的标题属性中的内容改成“程序主的窗口”。 ⑨选中字体属性，然后点击字体属性上出现的小按钮，在弹出的字体对话框中，将字体大小改成“初号”。 双击按钮1，就会产生“_按钮1_被单击”的子程序。 按钮被单击的事件是按钮最常使用的事件，运行程序后，只要按钮组件被单击就触发这个事件，并运行这个事件下的代码。 双击启动窗口，回到启动窗口界面。 改变窗体外型：①将窗体组件的边框属性设置成“无边框”的样式。 当编辑框1内容等于“123”并且编辑框2的内容等于“456”的时候，就运行这2行代码，运行后，启动窗口的可视属性被设置成假，并载入窗口1。 当组件的可视属性被设置成假以后，这个组件就处于隐藏状态 也就是看不到了。下面我们就按下“F5键”，来试运行上面的程序。 当输入正确的用户名和密码以后，点击“登陆”按钮，就会弹出窗口1，而登陆窗口就消失不见了。 手表已经成为了生活中不可缺少的东西，而且现在有很多都是电子表，本章利用组件的各种事件，大家跟着图例自己动手做一个可以改变颜色的电子表。 ②拉出一个按钮组件，形成“按钮1”。 ①拉出一个标签组件，形成“标签1”，然后将它的标题属性清空。 ③拉出一个时钟组件，形成“时钟1”。 ⑤拉出一个颜色选择器组件，形成“颜色选择器1”。 ④将按钮1的标题改成“显示电子表”。 时钟组件虽然过多的使用会占用很多系统资源，但它仍然是一个非常 实用的组件，时钟组件是在规定的时钟周期里，不断的执行时钟组件独有的“周期事件”的子程序下的代码。所以，在使用时钟组件时，都要先规定时钟组件的时钟周期。例如： 时钟1.时钟周期=1000 时钟周期规定1000就代表了每1秒钟执行一次周期事件子程序下的全部代码，依次类推，100就代表了时钟周期0.1秒，10就代表了时钟周期0.01秒。 ⑥双击“按钮1”，进入_按钮1_被单击子程序的程序设计界面。 ⑦输入代码： 时钟1.时钟周期＝1000 按下按钮后，就将时钟1的始终周期设置成1000，表示时钟1已经开始运转了。 ⑧双击“时钟1”，进入_时钟1_周期事件子程序的程序设计界面。 ⑨输入代码： 标签1.标题＝到文本（取现行时间（）） 每个时钟周期都执行此行代码。即按下按钮1后就每1秒钟取一次现行时间。 由于取现行时间命令返回的是日期时间型的数据，所以用到文本命令进行转换。 注意：想要在时钟的周期下执行代码，一定要在时钟组件的周期事件子程序下输入代码，不要在设置时钟组件的时钟周期时编写代码。 例如：想要每1秒钟都让变量加1： � � 错误的输入，变量1只在按钮被按下时才会加1。而不是每1秒都加1。 正确输入，在周期事件子程序下输入代码，按钮按下以后，每秒钟变量都加1。 下面就要考虑如何让标签的颜色随着颜色选择器的改变而改变颜色呢？要在什么事件触发时去改变标签的颜色呢？ 只要颜色选择器的颜色被改变，就执行这个子程序下的代码，即将标签的背景颜色改变。 （1）对每个组件是属性，事件和方法做详细了解，观察哪些属性是某组件的子有属性，哪些事件是某组件的子有事件，组件的方法都有哪些： ⑩在颜色选择器1的事件选单中，选择颜色被改变事件。 颜色被改变事件也是颜色选择器最常用的事件，也可以双击它来产生这个事件的子程序。 选中颜色选择器。 最后，在“_颜色选择器1_颜色被改变”子程序下输入代码： 标签1.背景颜色 ＝ 颜色选择器1.颜色 将标签的背景颜色改变成颜色选择器的颜色。 按“F5键”运行一下制作好的电子表，并试着在颜色选择器中选择不同的颜色。 按下按钮，就显示出了当前的时间。 可以随意选择电子表颜色。 组件除了有属性、基本事件和自有事件外，有些组件还有自己的方法。组件方法的用法和命令的用法差不多，格式是： 组件名.方法名(参数) 组件的方法运行后就会对相应的组件产生不同的效果。 用画板组件就可以制作一个精美的小九九表。 下面先来设计一下小九九表的外观。 ②在画板上拉出一个按钮组件，形成“按钮1 ”，并将“按钮1”的标题改成“九九表”。 ④将画板的背景颜色改成白色。 ③将画板的边框属性改成“镜框式”。 ①拉出一个画板组件，形成“画板1”。 双击按钮，进入按钮1被单击的子程序。 ⑥在按钮1被单击的子程序下输入代码： 计次循环首 (9, 被乘数) 变量循环首 (1, 被乘数, 1, 乘数) 要显示的内容 ＝ 到文本 (被乘数) ＋ “×” ＋ 到文本 (乘数) ＋ “=” ＋ 到文本 (被乘数×乘数 ) 画板1.定位写出 (乘数 × 40 － 30, 被乘数 × 20 － 10, 要显示的内容) 变量循环尾 () 计次循环尾 () 要想在画板上将九九表显示出来，首先考虑小九九表中有哪些数，他们有什么规律呢，只要把九九表中，每一个算式的乘数和被乘数依次取出，就可以得到要显示在画板上的内容，然后用画板组件的方法显示出来就可以了。 取出九九表中的乘数。 取出九九表中的的被乘数。 在双击“结束播放按钮”后产生的子程序下输入代码： 结束 () 用来关闭播放器 一个精美的 “网络电视播放器”就制作完成了，可以在线收看中央1台和中央9台的节目了，大家也可以收集更多的网址，让这个网络电视机收到更多的台，但要提醒大家的是，这个播放器是要在安装了“Windows Media Player9”以后才可以正常使用的，快去： � HYPERLINK "http://www.microsoft.com/windows/windowsmedia/download/" ��http://www.microsoft.com/windows/windowsmedia/download/�下载吧。 然后按下“F5键”试运行刚才编写的网络电视。 ②点击底图属性上的小按钮。选择播放器的界面图片。 用简单的几行代码就可以实现播放网络电视的功能，是不是很有意思呢？ ⑤用[Ctrl+L]键，新建3个变量，并给变量起名和定义变量的类型。 取出每个算式的文本。并保存在“显示的内容”变量中。 用画板的定位写出的方法，将要“显示内容”变量，显示在画板的指定位置上，定位写出方法的前两个参数规定了写出文本的坐标，是用一个公式表示的，只要了解定位写出方法的使用就可以了，公式仅做了解。 让我们按下“F5键”，运行九九表程序吧。按下“九九表”按钮，熟悉的九九表就显示出来了。是不是很神奇呢？ 现在是网络时代了，看到众多的播放软件，都可以在网上直接观看电视节目，是不是也想自己动手做一个属于自己的网络电视呢。其实易语言可以用简单的代码，就能实现这个功能。 下面首先来设计网络电视的界面。 双击“播放CCTV1”按钮，进入“_按钮1_被单击”子程序下 在“_按钮1_被单击”子程序中输入以下程序代码： 超文本浏览框1.可视 ＝ 真 超文本浏览框1.地址＝ “http://www.cctv.com/prime/zxzb/cctv1.html” 按钮1被单击后就让超文本浏览框1的可视属性为真，即让超文本浏览框显示出来。 这个超文本浏览框浏览网址： http://www.cctv.com/prime/zxzb/cctv1.html 该网址是中央电台在线直播的网址。大家可以直接在IE浏览器中输入这个网址。 然后按照编写“播放cctv1”按钮的方法，回到启动窗口，双击“播放cctv9”按钮，和“结束播放按钮”，然后在相应的子程序下输入代码。 在双击“播放CCTV9”按钮后产生的子程序下输入代码： 超文本浏览框1.可视 ＝ 真 超文本浏览框1.地址 ＝“http://www.cctv.com/prime/zxzb/cctv9.html” 这个子程序下输入的代码和_按钮1_被单击子程序下输入的代码是相同的，只是将网址改成了中央9台的直播网址。 （2）动手做一个可以旋转的字。提示： 1使用时钟组件 2使用字体属性中的字体角度属性，表示为：组件名.字体.字体角度=？？ 效果如下： 162 161