《微信小程序开发案例教程》教案 第15课 媒体API与位置API(一).docx
PAGE6
PAGE6
PAGE7
PAGE7
PAGE
PAGE6
PAGE
PAGE7
PAGE
PAGE1
课题
媒体API与位置API(一)
课时
2课时(90min)
教学目标
知识技能目标:
(1)掌握选择图片、预览图片、保存图片、获取图片信息API的相关知识
(2)掌握选择视频、保存视频、获取视频信息API的相关知识
素质目标:
?加强练习,在实践中提高专业技能和职业素养
教学重难点
教学重点:常用媒体API的相关知识和使用方法
教学难点:使用图片API对图片进行操作,使用视频上下文对象控制视频的播放,使用地图上下文对象操作地图
教学方法
案例分析法、问答法、讨论法、讲授法
教学用具
电脑、投影仪、多媒体课件、教材
教学设计
第1节课:?课前任务→考勤(2min)→问题导入(5min)→传授新知(38min)
第2节课:问题导入(5min)→任务实施(35min)→课堂小结(3min)→作业布置(2min)
教学过程
主要教学内容及步骤
设计意图
第一节课
课前任务
【教师】布置课前任务,和学生负责人取得联系,让其提醒同学通过APP或其他学习软件完成课前任务
请大家提前熟悉媒体API中图片、视频、音频、地图等常用API的相关知识,并对使用图片API、视频API和地图API对图片、视频和地图进行操作有个初步了解。
【学生】完成课前任务
通过课前任务,使学生了解所学课程的重要性,增加学生的学习兴趣
考勤
(2min)
【教师】使用APP进行签到
【学生】班干部报请假人员及原因
培养学生的组织纪律性,掌握学生的出勤情况
问题导入
(5min)
【教师】创设情景,并组织学生讨论下列问题:
微信小程序作为一种快速开发和轻量级应用的平台,提供了丰富的API接口,帮助开发者实现各种功能和交互效果。本文将总结和分享一些常用的微信小程序API,帮助开发者更好地利用这些接口,打造功能丰富、用户体验优秀的小程序应用。
(1)微信小程序有哪些API?
(2)媒体API分为哪几种?
【学生】聆听、思考、讨论、小组代表上台回答问题
【教师】总结学生的回答引入要讲的知识,板书“媒体API”
通过问题导入的方法,引导学生主动思考,激发学生的学习兴趣
传授新知
(38min)
【教师】通过学生的发言,引入新的知识,讲解常用媒体API的相关知识和使用方法等知识
一、图片
微信小程序的图片API包括选择图片、预览图片、保存图片、获取图片信息等,使用图片API可以对图片进行一些操作。
(一)选择图片
从基础库2.21.0版本开始,微信官方停止维护wx.chooseImageAPI(从本地相册选择图片,或者使用相机拍摄图片),并使用wx.chooseMediaAPI代替。
属性
类型
必填
说明
count
number
否
可选择文件个数,默认为9(基础库2.25.0之前的版本最多可选择9个文件,2.25.0及之后的版本最多可选择20个文件)
mediaType
array.string
否
文件类型,可选值有image(图片)、video(视频)和mix(图片和视频),默认为[image,video],表示可以选择图片或视频
sourceType
array.string
否
图片和视频的来源,可选值有album(从本地相册选择)和camera(通过相机拍摄),默认为[album,camera]
maxDuration
number
否
拍摄视频时的最长拍摄时间,取值范围为3~60,默认为10,单位为秒
camera
string
否
使用前置或后置摄像头,可选值有back(后置,默认)和front(前置),在sourceType的属性值为album时无效
wx.chooseMediaAPI参数支持的常用属性
属性
类型
说明
tempFiles
array.object
本地临时文件列表,包含tempFilePath(临时路径)、size(文件大小,单位为B)、duration(视频时长,单位为秒)、height(视频高度,单位为px)、width(视频宽度,单位为px)、thumbTempFilePath(视频缩略图的临时路径)、fileType(文件类型,有效值有image和video)
type
string
文件类型,与mediaType属性中的文件类型一致,有效值有image、video和mix
success回调函数的返回参数包含的属性
(二)预览图片
微信小程序使用wx.previewMediaAPI预览图片和视频(全屏显示),并且在预览过程中可以进行保存、分享等操作,该API传入一个object类型的参数。
属