微信小程序课程-第五章 微信小程序作业

第五章背景音乐播放与页面分享填空题1.小程序中背景音乐通过_______对象进行控制。答案：BackgroundAudioManager2.BackgroundAudioManager对象属性中必填属性为_______答案：title3.BackgroundAudioManager常用的方法有________。答案：play()、pause()、stop()微信小程序中使用______方法，实现页面分享到朋友和微信群答案：onShareAppMessage方法5.微信小程序通过________方法，实现页面分享到朋友圈答案：onShareTimeline方法判断题1.小程序中可以通过wx.playBackgroundAudio(Objectobject)实现背景音乐播放，但更加推荐使用wx.getBackgroundAudioManager

代替(√)2.微信小程序中，通过wx.getBackgroundAudioManager()可以获取全局唯一的背景音乐管理器对象(√)3.BackgroundAudioManager对象的URL属性表示音频数据源，并且为必填属性(×)4.BackgroundAudioManager.onStop()监听方式事件表示音乐播放完毕执行的回调方法(×)onShareTimeline方法表示页面分享到朋友圈的功能，但目前微信小程序只能支持Andorid的手机系统(√)选择题微信小程序BackgroundAudioManager对象属性包含(ABCD)。A.

srcB.

titleC.

coverImgUrlD.

webUrl2.下列选项中，属于BackgroundAudioManager监听方法(ABCD)。A.onPlayB.onStopC.onEndD.onError3.下列选项中，不属于Page回调函数是(A)A.onLaunch(Objectobject)B.onShareAppMessage(Objectobject)C.onShareTimeline()onAddToFavorites(Objectobject)4.下列关于小程序背景音乐使用说法错误是(C)A.微信小程序中，通过wx.getBackgroundAudioManager()可以获取全局唯一的背景音乐管理器对象B.小程序切入后台，如果音频处于播放状态，可以继续播放,但需要在app.json中配置requiredBackgroundModes。C.BackgroundAudioManager的src属性设置播放音乐来源，但目前只能支持本地音乐，不支持云IDD.在BackgroundAudioManager的监听方法中，对于监听音乐自动播放完成需要使用BackgroundAudioManager.onEnded(functioncallback),不能使用BackgroundAudioManager.onStop(functioncallback)5.下列关于微信小程序页面分享朋友和朋友圈的使用说法正确是(B)。A.onShareAppMessage表示分享朋友或微信群，方法必须返回一个Object对象，这个对象可以包含属性是title、desc、path。B.onShareTimeline表示页面分享到朋友圈，但必须在onShareAppMessage使用后才能使用C.onShareTimeline方法功能可以同时支持 Android和IOSD.onShareTimeline的分享朋友圈只能通过“单页模式”方式进行分享。简答题请描述在微信小程序中如何实现单页面的背景音乐功能？在微信小程序中Page对象有哪些主要的页面处理函数？编程题查阅文档完成文章页面的收藏功能？参考实现步骤：查阅微信官方文档，关于Page对象处理页面收藏功能介绍如图5-1所示：图5-1onAddToFavorites(Objectobject)使用说明文档按照文档的参考示例，我们需要在post-detail.js中添加文章收藏的方法，示例代码如下：

//

添加收藏

onAddToFavorites:

function

(res)

{

let

post

=

this.data.post;

return

{

title:

post.title,

imageUrl:

post.postImg

}

}保存代码，自动编译在模拟器测试运行效果如图5-2所示：图5-2文章收藏功能运行效果实现从swiper组件跳转到文章详情页面的功能？参考实现步骤：在data.js中重新设置轮播数据格式，示例代码如下：//

添加文章编号的轮播对象数据格式var

bannerListData

=

[{

img:

'/images/post/post-1@text.jpg',

postId:

3

},

{

img:

'/images/post/post-2@text.jpg',

postId:

4

},

{

img:

'/images/post/post-3@text.jpg',

postId:

5

}];在posts.wxml中修改轮播显示的内容，参考代码示例如下：

<!--

文章轮播

-->

<swiper

indicator-dots="{{true}}"

indicator-active-color="#fff"

indicator

autoplay="true"

interval="5000"

circular="{{true}}">

<swiper-item

bindtap="onSwiperTap"

wx:for="{{bannerList}}"

wx:for-item="bannerItem"

wx:for-index="index"

wx:key="index">

<image

src="{{bannerItem.img}}"

data-post-id="{{bannerItem.postId}}"></image>

</swiper-item>

</swiper>在posts.js中处理轮播的事件方法onSwiperTap的代码如下，参考示例代码如下：

//

从swiper-item跳转到文章详情页面

onSwiperTap(event){

console.log('onSwiperTap',event);