1、首先打开你的WxBit 项目库,选择“新建项目”

2、在弹出来的界面修改好自己项目的名称,注意不能含有中文,点击“确定”

3、接下来弹出来一个手机界面,我们就在这个界面上设计这个“你好猫咪”

4、既然是关于猫咪的APP,那么我们得先找到一张可爱的猫咪照片,这够可爱了吧?

5、我们要实现触摸猫咪的时候,让它触发一些功能,那就要通过按钮组件来实现,先将一个按钮添加到屏幕中

6、然后将按钮的图片属性改为猫咪图片




7、上传图片成功后,看到可穆螋湄澜爱猫咪的中间有按钮的文本,显得部太好看,我们要把它隐藏,点击“文本颜色”,选择“透明”,这样设置以后,猫咪的肚子就干净很多啦


8、我们希望点击,也就是触摸猫咪的时候,它能发出“喵”的声音,那么先去找到这个声音素材,这个大家自己网上找就可以了

9、接下来我们点击左侧的“多媒体”,在下拉菜单中选择“音频播放器”,拖入界面中,拖入之后,音频组件是不出现在用户界面中的,在界面的底部可以看到组件

10、现在我们将下载好的猫咪音频上传到音频播放器源文件中,上传成功之后,我们点击“素材列表”,我们将看到两个素材,一个是猫咪图片,另一个就是音频文件




11、好了,到这里我们的猫咪组件设塥骈橄摆计界面就完成了,接下来就是为组件添加特定的功能,让猫咪叫出来。我们点击“逻辑设计”,页面自动跳转到工作界面


12、我们点击按钮,我们是希望猫咪被触摸一次就叫一次,所以选择第一个,点击它,就会自动落入编辑界面

13、想让小猫咪叫起来,就用音频播放器播放猫叫声,所以现在点击“音频播放器”选择“调用音频播放器1开始”

14、最终的设计如下图,然后我们打包生成APP,用手机扫码安装




15、最后在手机上测试效果吧,我这里就不演示了,这个项目是最简单的一个APP开发了,开发过程却很有意思,大家慢慢去尝试吧