《十天学会易语言图解教程》第七章控件的添加与使用.docx

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