7.1 视图容器组件
7.1.4 movable-viewe和movable-area组件
scale属性用于设置是否支持双指缩放。默认支持缩放手势的区域是movable-view范围内,在movable-area组件上可以设置一个boolean类型的scale-area属性值为true时,可将缩放手势生效区域扩大为整个movable-area组件内。
movable-view与movable-area组件都需要设置width和height属性,如果不设置默认为10px。
7.1.5 cover-view组件和cover-image组件
在小程序中,微信创建了一些原生组件,包括camera、canvas、input(仅在focus时表现为原生组件)、live-player、live-pusher、map、textarea和video组件。
原生组件与非原生组件是不同的渲染流程,在界面显示有一些差异。原生组件的层级高于非原生组件。页面中的非原生组件无论将z-index设置为多少。都无法覆盖在原生组件之上。
小程序提供了cover-view和cover-image组件解决了原生组件层级最高的限制。这两是原生组件,可以覆盖部分原生组件上,包括camera、canvas、live-player、live-pusher、map、video组件。
cover-view是可覆盖原生组件上的容器组件,它内部只能包含文本或者嵌套cover-view、cover-image和button,只能包含文本、图片或按钮。
cover-image不是容器组件,作用和image组件类似,可以显示一张图片。但cover-image显示的图片可以覆盖在原生组件上,image组件不可以。cover-image的src属性,用于指定图片的路径、即网络路径或临时路径,自基础库2.2.3版本起支持云文件ID。
微信开发工具上的原生组件是用web组件模拟的,可能不能很好地还原真机的表现,开发者在使用原生组件时应该尽量在真机上进行测试。
7.2 基础内容组件
在页面中如果需要展示一些内容时,往往需要使用一些基础内容组件。
7.2.1 text组件
text组件是最常见的组件,用于在页面显示一些文本内容。可阅读第2章的text组件介绍
7.2.2 icon组件
icon是十分常见的组件,用于在页面显示一些图标。可阅读第3章的icon组件介绍
7.2.3 image组件
image组件在页面显示图片。可阅读第3章的image组件介绍