高端响应式模板免费下载

响应式网页设计、开放源代码、永久使用、不限域名、不限使用次数

什么是响应式网页设计?

2024年微信小程序结论(热门4篇)

微信小程序结论 第1篇

      组件是页面视图层(WXML)的基本组成单元,组件组合可以构建功能强大的页面结构。小程序框架为开发者提供了容器视图、基础内容、表单、导航、多媒体、地图、画布、开放能力等8类(30多个)基础组件。

每一个组件都由一对标签组成,有开始标签和结束标签,内容放置在开始标签和结束标签之间,内容也可以是组件。组件的语法格式如下:

<标签名 属性名=“属性值”>内容...标签名> 组件通过属性来进一步细化。不同的组件可以有不同的属性,但它们也有一些共用属性,如id、class、style、hidden、data-∗、bind∗/catch∗等。

 1、id组件的唯一表示,保持整个页面唯一,不常用。 2、 class组件的样式类,对应WXSS中定义的样式。 3、 style组件的内联样式,可以动态设置内联样式。 4、 hidden组件是否显示,所有组件默认显示。 5、 data-∗ 自定义属性,组件触发事件时,会发送给事件处理函数。事件处理函数可以通过传入参数对象的currentTarget. dataset方式来获取自定义属性的值。 6、 bind∗/catch∗ 组件的事件,绑定逻辑层相关事件处理函数。

容器视图组件是能容纳其他组件的组件,是构建小程序页面布局的基础组件,主要包括view、scroll-view和swiper组件。

view

通过组件实现页面布局示例代码如下:

效果: 

 通过设置scroll-view组件的相关属性可以实现滚动视图的功能,其属性如下表所示

【注意】

1、在使用竖向滚动时,如果需要给scroll -view组件设置一个固定高度,可以通过WXSS设置height来完成。 2、请勿在scroll-view组件中使用textarea、map、canvas、video组件。 3、scroll-into-view属性的优先级高于scroll-top。 4、由于在使用scroll-view组件时会阻止页面回弹,所以在scroll-view组件滚动时无法触发onPullDownRefresh。 5、如果要实现页面下拉刷新,请使用页面的滚动,而不是设置scroll-view组件。这样做,能通过单击顶部状态栏回到页面顶部。  通过scroll-view组件可以实现下拉刷新和上拉加载更多,代码如下:  

swiper swiper组件可以实现轮播图、图片预览、滑动页面等效果。一个完整的swiper组件由两个标签组成,它们不能单独使用。中只能放置一个或多个,若放置其他组件则会被删除;内部可以放置任何组件,默认宽高自动设置为100%。swiper组件的属性如下表所示。

基础内容组件包括icon、text和progress,主要用于在视图页面中展示图标、文本和进度条等信息。

icon组件即图标组件,通常用于表示一种状态,如success、info、warn、waiting、cancel等。其属性表如下图所示。

text组件用于展示内容,类似HTML中的, text组件中的内容支持长按选中,支持转义字符“\”,属于行内元素。text组件的属性如下表所示:

progress.                                                                                                                                            progress组件用于显示进度状态,如资源加载、用户资料完成度、媒体资源播放进度等。progress组件属于块级元素,其属性如下表所示:

表单组件的主要功能是收集用户信息,并将这些信息传递给后台服务器,实现小程序与用户之间的沟通。表单组件不仅可以放置在

微信小程序结论 第2篇

微信小程序是一种新型的应用程序形态,它可以在微信内被快速获取、使用,无需下载安装,为用户提供轻便、便捷的服务体验。相较于传统APP,微信小程序更加灵活、省资源,无需占用用户手机存储空间,具有使用即走、方便分享的特点。深受用户喜爱的微信,通过小程序的引入,为用户打开了一个全新的应用场景。

小程序特征 1. 零门槛使用:无需下载安装,用户可以直接通过微信扫码或搜索小程序名称进入使用,极大地方便了用户的操作。

2. 快速加载:小程序具有轻快的加载速度,用户打开小程序即可即时使用,无需等待应用程序的下载和安装。

3. 占用空间少:与传统APP卸载繁琐的流程不同,微信小程序不会占用用户手机的存储空间,使用即走,让用户更简单地释放手机存储空间。

4. 方便分享:微信小程序内置了方便的分享功能,用户可以快速将小程序分享给朋友群或社交媒体上的关注者。同时,开发者也可以通过朋友圈、微信群等方式快速推广自己的小程序。

5. 独立性和便捷性:微信小程序具有独立运行的环境,用户使用小程序不会受到其他应用的影响。而且,小程序可跨平台使用,用户可以在不同的设备上便捷地使用同一个小程序。

小程序应用场景 1. 电商购物:许多知名电商平台都有自己的微信小程序,用户可以通过小程序浏览商品,下单购买,享受快捷的购物体验。

2. 生活服务:很多餐饮、酒店、快递等行业都开设了微信小程序,用户可以通过小程序预订餐厅、酒店,查询快递情况等,提高生活便捷性。

3. 金融服务:包括银行、支付、投资等金融行业也纷纷推出了自己的微信小程序,用户可以通过小程序进行转账、支付账单、查看股票行情等操作。

4. 教育培训:一些知名在线教育平台也推出了微信小程序,用户可以通过小程序学习课程、参与在线考试等,提升自己的知识水平。

5. 社交娱乐:微信小程序也有很多有趣的社交娱乐应用,如小游戏、音乐播放器等,让用户在闲暇时间享受娱乐。

总结:微信小程序是一种轻量级、快速加载的应用程序形态,具有零门槛使用和快捷分享的特点。它不仅可以在电商购物、生活服务、金融服务、教育培训等领域得到广泛应用,还可以满足用户在社交娱乐方面的需求。微信小程序的兴起为用户打开了一个全新的应用场景,让用户在更为便捷、快速的环境下获取所需服务。

我的第一个小程序:

js:

wxml:

wxss:

 json:

微信小程序结论 第3篇

主目录: pages、utils 文件夹:、、、 pages:所有项目的子目录,展开子目录有:index、logs,每个子目录保存着一个页面的相关文件。 通常,一个页面包含 4 个不同扩展名 (.、.js 和.json) 的文件,分别用于表示页面结构文件、页面样式文件、页面逻辑文件和页面配需文件。按照规定,同一个页面的4个文件必须具有相同的路径与文件名。

utils: 目录用来存放一些公共的文件,当某个页面需要用到 us. 函数时,可以将其引人后直接使用。在微信小程序中,可以为一些图片、音频等资源类文件单独创建子目录用来存放。

主体文件: 微信小程序的主体部分由3 个文件组成,这3 个文件必须放在项目的主目录中,负责小程序的整体配置,它们的名称是固定的。

APP: :小程序逻辑文件,主要用来注册小序全局实例。在编译时,app. js 文件会程序的整体配置,它们的名称是固定的。和其他页面的逻辑文件打包成一个JavaScript 文件。该文件在项目中不可缺少。

:小程序公共设置文件,配置小程序全局设置。该文件在项目中不可缺少。

:小程序主样式表文件,类似HTML的cs文件。在主样式表文件中设置的样式在其他页面文件中同样有效。该文件在项目中不是必需的。

页面文件: 小程序通常是由多个页面组成的,每个页面包含4个文件,同一页面的这4 个文件必具有相同的路径与文件名。当小程序被启动或小程序内的页面进行跳转时,小程序会根据设置的路径找到相对应的资源进行数据绑定。

index: is文件页面逻辑文件,在该文件中编写 JavaScript 代码控制页面的逻辑。该文件在每个小程序的页面中不可缺少。 wxml文页面结构文件,用于设计页面的布局、数据绑定等,类似HTML页面中的.html文件。该文件在页面中不可缺少。 wxss文件页面样式表文件,用于定义本页面中用到的各类样式表。当页面中有样式表文件时,文件中的样式规则会层叠覆盖 中的样式规则;否则,直接使用 中指定的样式规则。该文件在页面中不可缺少 ison 文件 页面配置文件。该文件在页面中不可缺少。

微信团队为小程序的开发提供了 MINA 框架。MINA 架通过微信客户端提供文件系统网络通信、任务管理、数据安全等基础功能,对上层提供了一整套 JavaSeript API,让开发者能够非常方便地使用微信客户端提供的各种基础功能快速构建应用。

小程序MINA框架将整个系统划分为视图层和逻辑层。视图层 (View) 由框架设计的标签语言WXML(WeiXin Markup Language)和用于描述WXML组件样式的WXSS(WeiXinStyle Sheets)组成,它们的关系就像HTML和CSS的关系。逻辑层(App Service) 是MINA框架的服务中心,由微信客户端启用异步线程单独加载运行。页面数据绑定所需的数据、页面交互处理逻辑都在逻辑层中实现。MINA框架中的逻辑层使用JavaScript来编写交互逻辑网络请求、数据处理,但不能使用JavaScript 中的 DOM操作。小程序中的各个页面可以通过逻辑层来实现数据管理、网络通信、应用生命周期管理和页面路由。      MINA框架为页面组件提供了 bindtap、bindtouchstart 等与事件监听相关的属性,并与逻辑层中的事件处理函数绑定在一起,实现面向逻辑层与用户同步交互数据。MINA 框架还提供了很多方法将逻辑层中的数据与页面进行单向绑定,当逻辑层中的数据变更时,小程序会主动触发对应页面组件的重新数据绑定。      微信小程序不仅在底层架构的运行机制上做了大量的优化,还在重要功能 (如 page 切换、tab 切换、多媒体、网络连接等) 上使用接近于系统层 (Native) 的组件承载。所以小程序 MINA 框架有着接近原生 App 的运行速度,对 Android 端和iOS 端能现得高度一致并为开发者准备了完备的开发和调试工具。 

①视图层:MINA框架的视图层由WXML与WXSS 编写由组件来进行展示。对F微信小程序而言,视图层就是所有wxml文件与.wxss文件白集合:.wxml 文件用于描述页面的结构;文件用于描述页面的样式wxsS 微信小程序在逻辑层将数据进行处理后发送合视图层展现出来,同时接收视图层的事件反馈。视图层以给定的样式展现数据并反馈时间给逻辑层,而数据展现是I组件来进行的组件是视图的基本组成单元。

②逻辑层:逻辑层用于处理事务逻辑。对于微信小程序而言,逻辑层就是所有·js 脚本文件的集合微信小程序在逻辑层将数据进行处理后发送给视图层,同时接受视图层的事件反馈。 微信小程序开发框架的逻辑层是采用JavaScript 编写的。在JavaScript 的基础上,微信团队做了适当修改,以便提高开发小程序的效率。主要修改包括: (1)增加 app()和 Page()方法,进行程序和页面的注册。 (2) 提供丰富的 API,如扫一扫、支付等微信特有的能力。 (3)每个页面有独立的作用域,并提供模块化能力。    逻辑层就是通过各个页面的.js 脚本文件来实现的。由于小程序并非运行在浏览器中所以JavaScript在 Web 中的一些功能在小程序中无法使用,如 document、window 等 开发者开发编写的所有代码最终会被打包成独立的 JavaScript 文件,并在小程序启动的时候运行,直到小程序被销毁。

③数据层:数据层在逻辑上包括页面临时数据或缓存、文件存储(本地存储) 和网络存储与调用。

1.页面临时数据或缓存 在Page()中,使用 setData 函数将数据从逻辑层发送到视图层,同时改变对应的 的值。 setData()函数的参数接收一个对象,以 (key,value) 的形式表示将 key 在中对应的值改变成 value。 2.文件存储 (本地存储) 使用数据 API接口,如下: 获取本地数据缓存。 设置本地数据缓存。 清理本地数据缓存。 3.网络存储与调用 上传或下载文件API接口,如下: 发起网络请求。 上传文件。 下载文件 调用URL的API接口,如下: 新窗口打开页面 原窗口打开页面。

启动微信开发工具,创建新的项目demo2.此处不勾选“创建 QuickStart 项目”复选项, 单击“确定”按钮后,可以看到开发工具中的“目录结构”界面只显示项目配置文件(),同时系统提示错误信息

继续在项目主目录下新建一个pages目录,在pages目录下新建一个list目录文件夹,并在list目录下新建、、和空文件。

如下图:

打开项目配置文件,输入如下代码;

这段代码将list页面注册到小程序中,这个对象的第一属性pages接受了一个数组,该数组的每一项是一个字符串,该字符串由“路径”+“文件名”组成,不包括扩展名。pages属性用来指定这个项目由哪些页面组成,多个页面之间用“,”分隔。

打开文件,输入如下代码:

在文件中,只需加入一对空“{}”即可。

打开文件,输入如下代码:

只需引入Page()方法,保证文件不为空即可。 

小程序的配置文件按其作用范围可以分为全局配置文件()和页面配置文件(*.json)。全局配置文件作用于整个小程序,页面配置文件只作用于当前页面。由于页面配置文件的优先级高于全局配置文件的优先级,因此,当全局配置文件与页面配置文件有相同配置项时,页面配置文件会覆盖全局配置文件中的相同配置项内容。

全局配置文件  小程序的全局配置保存在全局配置文件()中,使用全局配置文件来配置页面文件(pages)的路径、设置窗口(window)表现、设定网络请求API的超时时间值( networkTimeout)以及配置多个切换页(tabBar)等。

全局配置项如下表所示:

pages配置项  pages 配置项接受一个数组,用来指定小程序由哪些页面组成,数组的每一项都是字符串,代表对应页面的“路径”+“文件名”。pages 配置项是必填项。 

设置pages配置项时,应注意以下3点:

1、数组的第一项用于设定小程序的初始页面。 2、在小程序中新增或减少页面时,都需要对数组进行修改。 3、文件名不需要写文件扩展名。小程序框架会自动寻找路径及对.js、.json、.wxml和.wxss文件进行整合数据绑定。

 window 配置项负责设置小程序状态栏、导航条、标题、窗口背景色等系统样式。

window配置项可以配置的对象参考表:

当需要在程序顶部或底部设置菜单栏时,可以通过配置tabBar配置项来实现。tabBar配置项可以配置的属性如下表

 

小程序中各种网络请求 API的超时时间值只能通过networkTimeout配置项进行统一设置不能在 API中单独设置。networkTimeout可以配置的属性如下表

debug配置项  debug 配置项用于开启开发者工具的调试模式,默认为false。开启后,页面的注册、路由数据由更新、事件触发等调试信息将以info的形式输出到Console(控制台)面板上。

页面配置文件 页面配置文件(*.json) 只能设置本页面的窗口表现, 而且只能设置window配置项的内容。 在配置页面配置文件后, 页面中的window配置值将覆盖全局配置文件() 中的配置值。

项目逻辑文件:项目逻辑文件中可以通过App()函数注册小程序生命周期函数、全局属性和全局方法, 已注册的小程序实例可以在其他页面逻辑文件中通过getApp()获取。

App()函数用于注册一个小程序,参数为Object,用于指定小程序的生命周期函数,用户自定义属性和方法,其参数如下表所示:

页面逻辑文件 页面逻辑文件的主要功能有: 设置初始数据; 定义当前页面的生命周期函数; 定义事件处理函数等。 每个页面文件都有一个相应的逻辑文件, 逻辑文件是运行在纯javaScrict引擎中。 因此, 在逻辑文件中不能使用浏览器提供的特有对象(document、window) 及通过操作DOM改变页面, 只能采用数据绑定和事件响应来实现。

在逻辑层,Page()方法用来注册一个页面,并且每个页面有且仅有一个,其参数如下表:

 

1)设置初始数据 设置初始数据是对页面的第一次数据绑定。对象data将会以JS0N(Javascript 0bject Notaton,Js对象简谱)的形式由逻辑层传至视图层。因此,数据必须是可以转成JSON的格式(字符串、数字、布尔值、对象、数组)。视图层可以通过WXML对数据进行绑定。

(2)定义当前页面的生命周期函数  在Page() 函数的参数中, 可以定义当前页面的生命周期函数。在Page() 函数的参数中, 可以定义当前页面的生命周期函数。 页面的生命周期函数主要有onload、onShow、onReady、onHide、onUnload。onload 页面加载函数。 当页面加载完成后调用该函数。 一个页面只会调用一次。 onShow 页面显示函数。 当页面显示时调用该函数。 每次打开页面都会调用一次。 onReady页面数据绑定函数。 当页面初次数据绑定完成时调用该函数。 一个页面只会调用一次, 代表页面已经准备就绪, 可以和视图层进行交互。  onHide 页面隐藏函数。 当页面隐藏时及当navigateTo 或小程序底部进行tab 切换时,调用该函数。 onUnload页面卸载函数。 当页面卸载、进行navigateBack 或redirectTo 操作时, 调用该函数。 (3)定义事件处理函数开发者在Page() 中自定义的函数称为事件处理函数。 视图层可以在组件中加入事件绑定, 当达到触发事件时, 小程序就会执行Page() 中定义的事件处理函数。

(4)使用setData 更新数据  小程序在Page对象中封装了一个名为setData() 的函数, 用来更新data中的数据。

  页面结构文件(WXML)是框架设计的一套类似HTML的标签语言,结合基础组件、事件系统,可以构建出页面的结构,即.wxml文件。在小程序中,类似HTML的标签被称为组件,是页面结构文件的基本组成单元。这些组件有开始(如)和结束(如)标志,每个组件可以设置不同的属性(如id、class等),组件还可以嵌套。WXML还具有数据绑定、条件数据绑定、列表数据绑定、模板、引用页面文件、页面事件等能力。

数据绑定 小程序在进行页面数据绑定时,框架会将WXML文件与逻辑文件中的data进行动态绑定,在页面中显示 data中的数据。小程序的数据绑定使用Mustache语法({{}})将变量或运算规则包起来。

简单绑定 简单绑定是指使用双大括号({{}})将变量包起来,在页面中直接作为字符串输出使用,简单绑定可以作用于内容、组件属性、控制属性等的输出。

注意:简单绑定作用于组件属性、控制属性时,双大括号外应添加双引号。

运算  在{{}}内可以做一些简单的运算(主要有算术运算、逻辑运算、三元运算、字符串运算等),这些运算均应符合JavaScript运算规则。

条件数据绑定 条件数据绑定就是根据绑定表达式的逻辑值来判断是否数据绑定当前组件。

(1)条件数据绑定

wx:if条件数据绑定是指使用wx:if这个属性来判断是否数据绑定当前组件。

(2)block 条件数据绑定

 当需要通过一个表达式去控制多个组件时,可以通过将多个组件包起来,然后在中添加属性即可。

列表数据绑定  列表数据绑定用于将列表中的各项数据进行重复数据绑定。

wx:for

在组件上,可以使用 wx:for 控制属性绑定一个数组,将数据中的各项数据循环进行数据绑定到该组件  与 block wx:if类似,在wxml中也可以使用包装多个组件进行列表数据绑定。 模版: 在小程序中,如果要经常使用几个组件的组合(如“登录”选项),通常把这几个组件结合定义为一个模板,以后在需要的文件中直接使用这个模板。定义模板: 模板代码由 wxml组成,因此其定义也是在 wxml 文件中,定义模板的格式为: 调用模板 

将模板定义后,就可以对其进行调用了。调用模板的格式为:引用页面文件  在WXML文件中,不仅可以引用模板文件,还可以引用普通的页面文件。WXML提供 了两种方式来引用其他页面文件。

import方式  如果在要引用的文件中定义了模板代码,则需要用import方式引用。 include 方式

可以将源文件中除模板之外的其他代码全部引人,相当于将源文件中的代码复制到include所在位置。

页面事件      小程序中的事件是用户的一种行为或通信方式。在页面文件中,通过定义事件来完成页面与用户之间的交互,同时通过事件来实现视图层与逻辑层的通信。我们可以将事件绑定到组件上,当达到触发条件时,事件就会执行逻辑层中对应的事件处理函数。

要实现这种机制,需要定义事件函数和调用事件。

定义事件函数:在.js文件中定义事件函数来实现相关功能,当事件响应后就会执行事件处理代码。 调用事件: 调用事件也称为注册事件。调用事件就是告诉小程序要监听哪个组件的什么事件,通常在页面文件中的组件上注册事件。事件的注册(同组件属性),以“key=value形式出现,key(属性名)以bind 或 catch 开头,再加上事件类型,如 bindtap、catchlongtap。其中,bind 开头的事件绑定不会阻止冒泡事件向上冒泡,catch开头的事件绑定可以阻止冒泡事件向上冒泡。value(属性值)是在js中定义的处理该事件的函数名称,如click。  在小程序中、事件分为冒泡事件和非冒泡事件两大类型。

冒泡事件:冒泡事件是指某个组件上的事件被触发后级元素再向其父级元素传递,一直到页面的顶级元素。非冒泡事件:非冒泡事件是指某个组件上的事件被触发后,该事件不会向父节点传递。 在WXML中,冒泡事件共6个,如下所示:

七、页面样式文件  页面样式文件(WXSS)是基于CSS拓展的样式语言,用于描述WXML的组成样式,决 定WXML的组件如何显示。WXSS具有CSS的大部分特性,小程序对WXSS做了一些扩充和修改。

 尺寸单位 由于CSS原有的尺寸单位在不同尺寸的屏幕中得不到很好的呈现,WXSS在此基础上增加了尺寸单位rpx(respnesive pixel)。WXSS规定屏幕宽度为750px,在系统数据绑定过程中rpx会按比例转化为px。例如,iPhone6的屏幕宽度为375px,即750rpx需按比例转化为375px,所以,在iPhone6中,1rpx=.

选择器

 目前,WXSS 仅支持CSS 中常用的选择器,如.class、#id、element、::before、::aftert 等.

WXSS常用属性

 WXSS文件与CSS文件有大部分属性名及属性值相同,WXSS的常用属性及属性值如下表:

 

微信小程序结论 第4篇

       徽信小程序处理的数据通常从后台服务器获取、再将处理过的结果保存到后台服务器,文就委求徽信小程序要有与后台进行交互的能力。徽信限生开结后提供子各#接口实现前后端交互。       网络API可以帮助开发者实现网络URL访问调用、文件的上传和下载、网络套接字的用等功能处理。微信开发团队提供了10个网络API接口, ① (Object)接口 用于发起HTTPS 请求。 ② (Object)接口 用于将本地资源上传到后台服务器 ③ (Object)接口用于下载文件资源到本地。 ④ (0bject)接口 用于创建一个WebSocket 连接 ⑤ (0bjeet)接口用于实现通过WebSocket 连接发送数据 ⑥ (0bject)接口 用于关闭 WebSocket 连接。 ⑦ (CallBack)接口 用于监听WebSocket 连接打开事件 ⑧ (CallBack)接口用于监听WebSocket 错误 ⑨ (CallBack)接口用于实现监听WebSocket接收到服务器的消息 事件。 ⑩ (CallBack)接口用于实现监听WebSocket 关闭

(Object)实现向服务器发送请求、获取数据等各种网络交互操作,其相关参数如表6-1所示。一个微信小程序同时只能有5个网络请求连接,并且是HTTPS请求。

wx. uploadFile( Object)接口用于将本地资源上传到开发者服务器,并在客户端发起一个HTTPS POST 请求,其相关参数如表6-2所示。

wx. downloadFile( Object)接口用于实现从开发者服务器下载文件资源到本地,在客户端直接发起一

多媒体 API 主要包括图片 API、录音 API、音频播放控制 API、音乐播放控制 APT等,其目的是丰富小程序的页面功能。

图片 API 实现对相机拍照图片或本地相册图片进行处理,主要包括以下4个 API 接口:

wx. chooselmage( Object)接口用于从本地相册选择图片或使用相机拍照。

(Object)接口 用于预览图片。 wx. getlmageInfo(Object)接口 用于获取图片信息。 wx. savelmageToPhotosAlbum ( Object) 接口用于保存图片到系统相册。

1. 选择图片或拍照 wx. chooseImage( Objeet)接口用于从本地相册选择图片或使用相机拍照。拍照时产生的临时路径在小程序本次启动期间可以正常使用,若要持久保存,则需要调用 wx. saveFile 保存图片到本地。其相关参数如表6-4所示。

(Object)接口主要用于预览图片,其相关参数如图:

(Object)接口用于获取图片信息,其相关数据如图:

(Objet)接口用于保存图片到系统相册,需要得到用户授权.。

2、录音API 录音 API 提供了语音录制的功能,主要包括以下两个 API 接曰: wx. startRecord (Object)接口 用于实现开始录音。 wx. stopRecord ( Object) 接囗用于实现主动调用停止录音。1. 开始录音 wx. startRecord (Object) 接口用于实现开始录音。当主动调用 wx. stopRecord ( Object)接口或者录音超过1分钟时,系统自动结束录音,并返回录音文件的临时文件路径。若要持久保存,则需要调用 ()接口。其相关参数如表6-8所示。

2、停止录音

(Objet)接口用于实现主动调用停止录音。

3、音频播放控制API: 音频播放控制API主要用于对语言媒体文件的控制,包括播放、暂停、停止及audio组件的控制,主要包括以下3个 API, 音频播放控制 API 主要用于对语音媒体文件的控制,包括攝放、暂停、停止及 audio 组 wx. play Voice(Object)接口 用于实现开始播放语音。 (Object)接口 用于实现暂停正在播放的语音。 (Object)接口 用于结束播放语音。 1.播放语音 Ix. play Voice( Object)接口用于开始播放语音,同时只允许一个语音文件播放,如果前一个语音文件还未播放完,则中断前一个语音文件的播放。其相关参数如表6-9所示。

2、结束播放:

 (Object)用于结束播放语音,示例代码如下:

4、音乐播放控制API: 音乐播放控制API主要用于实现对背景音乐的控制,音乐文件只能是网络流媒体,不能是本地音乐文件。音乐播放控制API主要包括以下8个API:

(1)(Object)接 用于播放音乐。

(2)wx. getBackgroundAudioPlayerState(Object)接口 用于获取音乐播放状态,

(3)(0bject)接口 用于定位音乐播放进度。

(4)()接口 用于实现暂停播放音乐。

(5)()接口 用于实现停止播放音乐。

(6)(CallBack)接日 用于实现监听音乐播放

(7)(CalBack)接口 用于实现监听音乐暂停

(8)(CallBack)接口 用于实现监听音乐停止。

1.播放音乐         (Object)用于播放音乐,同一时间只能有一首音乐处于播放状态,其相关参数如表所示

2、获取音乐播放状态:    

    wx. getBackgroundAudioPlayerState(Object)接口用于获取音乐播放状态,其相关参数如表所示

wx,seekBackgroundAudio(0bject)接口用于控制音乐播放进度,其相关参数如表所示

4.暂停播放音乐 wx. pauseBackgroundAudio()接口用于暂停播放音乐。

5.停止播放音乐

wx. stopBackgroundAudio()接口用于停止播放音乐。

6.监听音乐播放

wx. onBackgroundAudioPlay(CallBack)接口用于实现监听音乐播放,通常被wx. playBack-groundAudio(Object)方法触发,在CallBack中可改变播放图标。

7.监听音乐暂停 wx. onBackgroundAudioPause(CallBack)接口用于实现监听音乐暂停,通常被wx. pause-BackgroundAudio()方法触发。在CallBack中可以改变播放图标。8.监听音乐停止 wx. onBackgroundAudioStop(CallBack)接口用于实现监听音乐停止,通常被音乐自然播放停止或(Object)方法导致播放位置等于音乐总时长时触发。在CallBack中可以改变播放图标。9.案例展示 在此,以小程序music为案例来展示音乐API的使用。该小程序的4个页面文件分别为music. wxml、、music. json和music. cojs。

从网络上下载或录音的文件都是临时保存的,若要持久保存,需要用到文件API。文件API提供了打开、保存、删除等操作本地文件的能力,主要包括以下5个API接口:

① (Object)接口 用于保存文件到本地。 ② (Object)接口 用于获取本地已保存的文件列表。 ③ (Object)接口 用于获取本地文件的文件信息。 ④ (Object)接口 用于删除本地存储的文件。  ⑤(Object)接口 用于新开页面打开文档,支持格式:doc、xls、ppt、pdf、docx、xlsx、ppts。

wx. saveFile(Object)用于保存文件到本地,其相关参数如表6-14所示。   

wx. getSavedFileList(Object)接口用于获取本地已保存的文件列表,如果调用成功,则返回文件的本地路径、文件大小和文件保存时的时间戳(从1970/01/01 08: 00: 00到当前时间的秒数)文件列表。其相关参数如表6-15所示。

wx. getSaveFileInfo(Object)接口用于获取本地文件的文件信息,此接口只能用于获取已保存到本地的文件,若需要获取临时文件信息,则使用wx. getFileInfo(Object)接口。其相关参数如表6-16所示。

wx. removeSaveFile(Object)接口用于删除本地存储的文件,其相关参数如表6-17所示。

(Object)接口用于新开的页面打开文档,支持的格式有doc,xls,ppt,pdf,docx,xlsx,pptx,起相关参数如表6-18所示:

小程序提供了以键值对的形式进行本地数据缓存功能,并且是永久存储的,但最大不超过10MB,其目的是提高加载数据速度。数据缓存的接口主要有4个: (0bject)或(key,data)接口 用于设置缓存数据  (0bject)或(key)接口 用于获取缓存数据。   (Object)或(key)接口用于删除指定缓存数据。      ()或()接口用于清除缓存数据。

1. wx. setStorage( Object )

(0bject)接口将数据存储到本地缓存接口指定的key中,接口执行后会覆盖原来key 对应的内容。其参数如表所示

2. wx. setStorageSync ( key , data )

wx. setStorageSync(key,data)是同步接口,其参数只有 key 和 data。示例代码如下:

1. wx. getStorage( Object )

(0bject)接口是从本地缓存中异步获取指定key 对应的内容。其相关参数如表所示

 

. getStorageSync( key)

(key)从本地缓存中同步获取指定key 对应的内容。其参数只有key

1. wx. removeStorage( Object )

(0bject)接口用于从本地缓存中异步移除指定key。其相关参数如表所示

( key )

(key)接口用于从本地缓存中同步删除指定key对应的内容。其参数只有key

示例代码如下:

( )

()接口用于异步清理本地数据缓存,没有参数。示例代码如下:

( )

()接口用于同步清理本地数据缓存。示例代码如下

小程序可以通过位置信息API来获取或显示本地位置信息,小程序支持WGS84和GCj02标准,WGS84标准为地球坐标系,是国际上通用的坐标系;GCj02标准是中国国家_制定的地理信息系统的坐标系统,是由WGS84坐标系经加密后的坐标系,又称为火星坐标系。默认为WGS84标准,若要查看位置需要使用GCj02标准。主要包括以下3个API接口:

 (Object)接口用于获取位置信息。  (Object)接口 用于选择位置信息。  (Object)接口用于通过地图显示位置。

猜你喜欢