.. _component: 组件 ======= 版本:|release| 更新:|today| 视图容器 ----------- +---------------------+----------------------------------------------+ | 名称 | 功能说明 | +=====================+==============================================+ | :doc:`cover-image` | 覆盖在原生组件之上的图片视图 | +---------------------+----------------------------------------------+ | :doc:`cover-view` | 覆盖在原生组件之上的文本视图 | +---------------------+----------------------------------------------+ | :doc:`movable-area` | 的可移动区域 | +---------------------+----------------------------------------------+ | :doc:`movable-view` | 可移动的视图容器，在页面中可以拖拽滑动 | +---------------------+----------------------------------------------+ | :doc:`scroll-view` | 可滚动视图区域 | +---------------------+----------------------------------------------+ | :doc:`swiper` | 滑块视图容器 | +---------------------+----------------------------------------------+ | :doc:`swiper-item` | 仅可放置在组件中，宽高自动设置为100% | +---------------------+----------------------------------------------+ | :doc:`view` | 视图容器 | +---------------------+----------------------------------------------+ .. toctree:: :maxdepth: 1 :hidden: cover-image cover-view movable-area movable-view scroll-view swiper swiper-item view 基础内容 --------- +------------------+----------+ | 名称 | 功能说明 | +==================+==========+ | :doc:`icon` | 图标 | +------------------+----------+ | :doc:`progress` | 进度条 | +------------------+----------+ | :doc:`rich-text` | 富文本 | +------------------+----------+ | :doc:`text` | 文本 | +------------------+----------+ .. toctree:: :maxdepth: 1 :hidden: icon progress rich-text text 表单 ------------ +---------------------------+-------------------------------------+ | 名称 | 功能说明 | +===========================+=====================================+ | :doc:`button` | 按钮 | +---------------------------+-------------------------------------+ | :doc:`checkbox` | 多选项目 | +---------------------------+-------------------------------------+ | :doc:`checkbox-group` | 多项选择器，内部由多个checkbox组成 | +---------------------------+-------------------------------------+ | :doc:`editor` | 多项选择器，内部由多个checkbox组成 | +---------------------------+-------------------------------------+ | :doc:`form` | 表单 | +---------------------------+-------------------------------------+ | :doc:`input` | 输入框 | +---------------------------+-------------------------------------+ | :doc:`label` | 用来改进表单组件的可用性 | +---------------------------+-------------------------------------+ | :doc:`picker` | 从底部弹起的滚动选择器 | +---------------------------+-------------------------------------+ | :doc:`picker-view` | 嵌入页面的滚动选择器 | +---------------------------+-------------------------------------+ | :doc:`picker-view-column` | 滚动选择器子项 | +---------------------------+-------------------------------------+ | :doc:`radio` | 单选项目 | +---------------------------+-------------------------------------+ | :doc:`radio-group` | 单项选择器，内部由多个 组成 | +---------------------------+-------------------------------------+ | :doc:`slider` | 滑动选择器 | +---------------------------+-------------------------------------+ | :doc:`switch` | 开关选择器 | +---------------------------+-------------------------------------+ | :doc:`textarea` | 多行输入框 | +---------------------------+-------------------------------------+ .. toctree:: :maxdepth: 1 :hidden: button checkbox checkbox-group editor form input label picker picker-view picker-view-column radio radio-group slider switch textarea 导航 ---------- +----------------------------------+--------------------------------------+ | 名称 | 功能说明 | +==================================+======================================+ | :doc:`functional-page-navigator` | 仅在插件中有效，用于跳转到插件功能页 | +----------------------------------+--------------------------------------+ | :doc:`navigator` | 页面链接 | +----------------------------------+--------------------------------------+ .. toctree:: :maxdepth: 1 :hidden: functional-page-navigator navigator 媒体 ------------- +--------------------+----------------+ | 名称 | 功能说明 | +====================+================+ | :doc:`image` | 图片 | +--------------------+----------------+ | :doc:`audio` | 音频 | +--------------------+----------------+ | :doc:`video` | 视频 | +--------------------+----------------+ | :doc:`live-pusher` | 实时音视频录制 | +--------------------+----------------+ | :doc:`live-player` | 实时音视频播放 | +--------------------+----------------+ | :doc:`camera` | 系统相机 | +--------------------+----------------+ .. toctree:: :maxdepth: 1 :hidden: image audio video live-pusher live-player camera 地图 ---------- +------------+----------+ | 名称 | 功能说明 | +============+==========+ | :doc:`map` | 地图 | +------------+----------+ .. toctree:: :maxdepth: 1 :hidden: map 画布 ---------- +---------------+----------+ | 名称 | 功能说明 | +===============+==========+ | :doc:`canvas` | 画布 | +---------------+----------+ .. toctree:: :maxdepth: 1 :hidden: canvas 开放能力 ---------- +-------------------------+------------------------+ | 名称 | 功能说明 | +=========================+========================+ | :doc:`web-view` | 承载网页的容器 | +-------------------------+------------------------+ | :doc:`ad` | 广告 | +-------------------------+------------------------+ | :doc:`official-account` | 公众号关注组件 | +-------------------------+------------------------+ | :doc:`open-data` | 用于展示微信开放的数据 | +-------------------------+------------------------+ .. toctree:: :maxdepth: 1 :hidden: ad official-account open-data web-view 原生组件说明 ------------- +-------------------------+-------------+ | 名称 | 功能说明 | +=========================+=============+ | :doc:`native-component` | ## 原生组件 | +-------------------------+-------------+ 小程序中的部分组件是由客户端创建的原生组件，这些组件有： - camera - canvas - input（仅在focus时表现为原生组件） - live-player - live-pusher - map - textarea - video .. _ncur: 原生组件的使用限制 ------------------ 由于原生组件脱离在 WebView 渲染流程外，因此在使用时有以下限制： - 原生组件的层级是最高的，所以页面中的其他组件无论设置 z-index 为多少，都无法盖在原生组件上 .. toctree:: :maxdepth: 1 :hidden: native-component 无妨碍访问 ---------- .. toctree:: :maxdepth: 1 :hidden: aria-component +-----------------------+---------------+ | 名称 | 功能说明 | +=======================+===============+ | :doc:`aria-component` | ## 无障碍访问 | +-----------------------+---------------+ .. versionadded:: 2.5.0 为了更好地满足视障人士对于小程序的访问需求，支持部分ARIA标签