基本信息

---

下载

文档摘要

---

微信小程序开发

北方工业大学

案例

图片与声音

案例描述

设计一个小程序，小程序运行后显示一张猫图，

点击猫图后会发出猫叫的声音。

实现效果

手机录屏和猫叫声音

案例实现

电脑录屏

案例实现

本案例主要涉及image图片组件的使用方法，音频的

创建和使用方法，以及数据和事件绑定的实现方法。

image组件。

支持JPG、PNG、SVG格式，用src属性指定图片的路径。

使用音频。

首先要利用API函数wx.createInnerAudioContext()创建

音频上下文，然后设置该上下文的src，并利用play()

函数播放音频。

数据绑定。

WXML文件中的动态数据通过{{}}符号与JS文件中的

数据进行绑定，这样JS中的数据就可以传给WXML

文件。这种传递是单向的。

事件绑定。在WXML文件组件标签内利用“bind…=

函数名”绑定组件事件与函数，并在JS文件中定义

该事件函数。

案例

总结

本案例主要演示了image组件和音频的使用

方法，以及数据和事件绑定的实现方法。