首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

一起来做一个点名器吧!

首先让我们看一下完成后的效果:

跟着我一起做吧!

1. 首先还是让我们来新建一个项目,项目名叫:点名器。

2. 打开以后看到我们的默认屏幕,空空如也。

3. 我们更改Screen1组件的属性。找到Screen属性中的屏幕尺寸和标题。

更改屏幕尺寸为自动调整是为了让我们的屏幕尺寸更好的适配我们不同的手机。

再将标题更改为点名器。

更改完以后如下:可以看到屏幕的左上角已经变成了点名器

4. 接下来我们从用户界面的组件中找到按钮,并将其拖拽到屏幕上任何一点,松手。

5. 拖拽完成后的按钮1是这个样子。

6. 按钮1很可怜,委屈的蹲在墙角,我们要让它勇敢地站在屏幕地最中间。

所以我们需要更改Screen1的相关对齐属性:

你看。我们将Screen1的水平对齐改为居中,将垂直对齐改为居中。

所以呢,所有在Screen1内部的组件都会在水平方向和垂直方向在最中间。

7. 更改以后的按钮是这个样子。

8. 但是还是很丑,怎么办呢?

我们再仔细看看按钮1的相关属性

发现我们可以将按钮的高度和宽度设置为200像素。

设置完成以后的按钮1是不是大变样?

9. 好吧,你可能认为它还是很丑。

那我们再将按钮的属性中的形状改为椭圆。

再看看效果:

10. 按钮1这三个字似乎太小了点。而且叫做按钮1比较奇怪。

那我们再将按钮1属性面板中的显示文本改为“点我”,将字号调整为30。

更改之后的效果:

11. 这样子似乎顺眼很多了。我们可以尝试去修改按钮1的属性面板中的任何一项属性,观察更改后的变化。

12. 接下来,该编程了。

我们点击绿色条栏的右上角的编程按钮转到编程界面。

13. 点名器的原理。

点名器需要用到一个东西:列表

列表这东西其实就是一种数据的组合方式。我们可以把列表想象成排队。

排队我们有队首,队尾,还可以插队。

那么对于列表是一样的。

我们以后会用到列表的更多用法。

但是列表需要有一个名字,

我们用到了“变量”。

变量,顾名思义,就是会变的量,

即这个“变量”存的东西是不固定的,

我们可以进行更改。

比如我们做数学题:

a=1,b=2,a+b=1+2=3。

在这里,a,b都是变量。

点名器:我们将备选的名字全部放到列表里,随机从列表里选择一个。

(如果没有读懂也没有关系,跟着做一次你肯定明白)

14. 我们从变量代码块中选择一个声明全局变量为什么,将它拖出来放到工作区域。

15. 更改一下这个“我的变量”,改为“名字”。

16. 从列表代码块中找到列表:

将它插到刚刚拖出来的“声明全局变量名字为”的插槽中。

17. 再从文本代码块中找到第一个。

将它插在列表的插槽的后面,并且将需要点到的名字输入:

列表的插槽相当于排队的人数,现在只能排两个人。

18. 你可能会发现列表后面只有两个插槽,不太够,所以需要增加插槽。

点击列表左上角的蓝色小齿轮,弹出一个框框。

将框中的 项 拖到框中的列表其余项的下面。

多拖几个。

19. 我拖了五个,够了。继续重复17步,将列表后面的插槽填满。

其实我们也可以选中后复制,这样更快。

20. 所有的一切都需要我们点击按钮1,所以从按钮1的代码块中找到“当按钮1被点击时,...”,将它拖到工作区域。

21. 当按钮1被点击时,我们需要从列表中随机抽取一个。

所以,找到列表中的“列表...的任意项”。

22. 我们将按钮1的显示文本设置为从列表中取出的任意项,所以从按钮1的代码块中找到设置按钮1的显示文本为。

插到“当按钮1被点击时”的下面

23. 将“列表...的任意项”插到“设按钮1的显示文本”的后面。

24. 列表中的任意项。是那个列表呢,当然是名字这个列表了,我们只有这么一个列表哟。

用鼠标的指针指着之前的声明全局变量的“名字”

发现弹出一个框,我们将第一个“global 名字”拖出,放入:

25. 连接调试一下,还记得怎么调试吗?

推荐用手机AI伴侣,直接扫二维码连接。

连接后:

点击“点我”。

26. 到这里我们已经完成了最基本的点名器,但是还有一缺点,那就是这个点名器不能自动将我们点中的名字读出来。

所以我们还需要一个步骤,将上面的“大脑斧”读出来。

从组件面板的多媒体中找到语音合成器。拖到手机的屏幕里。

会发现它在这里:非可视组件。

非可视组件,其实就是看不见的组件。这是一个功能组件,而不是界面设计的组件。

27. 返回到编程界面。

28. 从语音合成器的代码块中找到:

29. 将它放到按钮被点击的下面:

30. 我们可以看到紫色的合成语音代码块后面需要一个参数,这个参数就是我们想让它自动读出的一句话。

而这句话是什么呢,就是上面我们设置好的按钮1的显示文本。

所以,从按钮1的代码块中找到:

31. 将这个浅绿色的代码块插到紫色的合成语音的后面:

32. 再调试一下看看。

PS:如果你在电脑AI伴侣调试的时候,无法正确读出汉字,是因为让语音合成器合成语音是调用了手机的一个语音模块的。

在电脑上调试,肯定是没有手机的这个语音模块,所以我们可以在手机上调试。

但是因为Android系统是美国人的。肯定没有文的语音模块,所以我们可以通过安装第三方软件来实现说出中文,比如讯飞语记,搜狗听写等。

扩展

到这里,点名器功能基本完成。

如果你觉得界面并不是太美观,我们可以通过更改Screen1的背景图片,调整按钮1的背景颜色来使它更漂亮,我们还可以在Screen1里找到图标上传一个帅气的图标,让你的应用更有个性。

我在素材里分享了一些背景图片和图标,大家可以任意选择使用。

素材

https://pan.baidu.com/s/1ZeOU43ZZ3m9dc6qDAhr6nw

完成之后,还记得如何生成手机安装包吗?

MrCode

专注编程与分享,教普通人学编程

关注

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180608G0JEA300?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券