3.3 浮层视图组件
一般情况下可能不需要使用浮层视图。浮层视图组件主要用于自定义原生组件。在小程序开发中,一些提供特殊功能的组件会采用原生组件的方式进行渲染,原生组件包括map、video、canvas、camera、live-player、live-pusher。
例如,map组件专门用来创建地图视图,作为原生组件,map组件内部是不能嵌套一般的小程序视图组件的,原生组件的层级非常高,向其中加入其他视图组件不会产生任何效果。
①注意:
对于原生组件,模拟器和真机的表现形式差异很大,所以最好使用真机进行测试。
3.3.1 cover-view浮层文本视图
cover-view组件专门用于在原生组件上添加文本浮层,也可以继续进行嵌套,示例代码如下。在index.wxml文件中编写如下测试代码:
map组件会在页面上渲染出一个地图视图,运行上面的代码可以看到地图效果。
cover-view组件支持定位、布局及文本样式的设置,如果要在原生组件上覆盖图片视图,则需要使用cover-image组件。
3.3.2 cover-image浮层图片视图
cover-image组件的使用和应用场景与cover-view基本一致,其拥有加载图片的功能。示例代码如下:
运行上述代码,可以看到图片会被加载到地图视图上。cover-image组件的常用属性如表3-7所示。
表3-7 cover-image组件的常用属性
cover-image组件与cover-view组件通常会组合使用,用来扩展和定制原生组件的功能。