微信小程序的开发

微信小程序的UI精讲

一、布局和样式基础
格子与格子之间的距离
二、组件使用
1.试图容器：

cover-image：覆盖在原生组件之上的图片视图 cover-view：覆盖在原生组件之上的文本视图 movable-view：可移动的视图容器，在页面中可以拖拽滑动。注：movable-view必须在 movable-area组件中，并且必须是直接子节点，否则不能移动。 movable-area：movable-view的可移动区域。 swiper：滑块视图容器。注：其中只可放置swiper-item组件，否则会导致未定义的行为。 swiper-item：仅可放置在swiper组件中，宽高自动设置为100%。 view：视图容器
2.基础内容： icon：图标。组件属性的长度单位默认为px，2.4.0起支持传入单位(rpx/px)。 progress：进度条。组件属性的长度单位默认为px，2.4.0起支持传入单位(rpx/px)。 rich-text：富文本。 text：文本。
3、表单组件： button：按钮 checkbox：多选项目。 checkbox-group：多项选择器，内部由多个checkbox组成。 editor：富文本编辑器，可以对图片、文字进行编辑。 form：表单。 input：输入框。 label：用来改进表单组件的可用性。 picker：从底部弹起的滚动选择器。 picker-view：嵌入页面的滚动选择器。注：其中只可放置 picker-view-column组件，其它节点不会显示。 picker-view-column：滚动选择器子项。注：仅可放置于picker-view中，其孩子节点的高度会自动设置成与picker-view的选中框的高度一致 radio：单选项目。 radio-group：单项选择器，内部由多个 radio 组成。 slider：滑动选择器。 switch：开关选择器。 textarea：多行输入框。注：该组件是原生组件，使用时请注意相关限制。
4、导航： functional-page-navigator：仅在插件中有效，用于跳转到插件功能页。 navigator：页面链接。
5、媒体组件： audio：音频 camera：系统相机。 image：图片。支持 JPG、PNG、SVG、WEBP、GIF 等格式。 live-player：实时音视频播放。 live-pusher：实时音视频录制。 video：视频。
6、地图：map
7、画布：canvas
8、开放能力： ad：Banner 广告。 official-account：公众号关注组件。 open-data：用于展示微信开放的数据。 web-view：承载网页的容器。会自动铺满整个小程序页面
9、导航栏：navigation-bar
三、项目实战
https://blog.csdn.net/bjyxszd2222/article/details/104580354
作者：bjyxszd2222

小程序 小程序的开发 程序 微信小程序