小程序个人中心教程-微信小程序制作-即速应用

小程序个人中心教程-微信小程序制作

浏览量：2423 时间：2020-03-28 来源：即速应用

一、功能展示图

二、功能介绍
每个app将自动生成个人中心页面，用户可在编辑器页面中维护页面内容。
个人中心分为两部分【个人中心】【自由编辑】
注：本次更新个人中心页面不支持web预览，如果需要预览可在微信开发中工具中查看。
1、个人中心板块
【头部展示类型选择】
（1）普通版：普通版提供三个选项供用户选择展示。
普通版样式一：
普通版样式二：
普通版样式三：
（2）会员版：会员版提供三个选项供用户选择展示。
会员版样式一：
会员版样式二：
会员版样式三：
【数据展示组件】
数据样式组件设置，可设置数据样式是否展示（默认展示，如需关闭需要用户手动关闭~）（2）点击组件，可增加、删除展示列，一共五个展示列供用户选择（优惠券、积分、储值、足迹、收藏）
（2）列数：可设置页面展示列数，至少展示2个~最多展示4个，具体展示内容以及展示内容也可修改~
（3）间距：可设置此组件间距，目前只支持向上间距，如图：

（4）行高：行高为组件中整体高度

【微分商城】
微分商城开关：可设置在个人中心页面是否展示微分商城入口，默认开启，如果需要关闭需要用户手动进行关闭。
微分商城具体教程：
http://bbs.zhichiwangluo.com/thread-18334-1-1.html
2、个人中心组件样式
（1）尺寸：头像尺寸，设置个人中心用户头像大小；高度尺寸，头部会员卡位置高度，最低50。
（2）颜色：背景颜色，设置头部底色；设置背景图，设置头部背景底图。
注：
如果头部样式选择会员模式，设置的颜色与背景图仅限默认，具体会员等级展示样式需要在会员卡的配置中设置。
（3）透明：头部样式透明度设置。默认100%不透明。文字：昵称，设置头部昵称字体样式；名称，字
注：
字体样式分别可设置：字体大小、是否加粗、是否倾斜、是否增加下划线、字体颜色；
（4）按钮颜色：可设置会员卡中按钮颜色。（部分样式不显示按钮颜色）
（5）按钮文字：可设置会员卡中按钮上面文字字体。（部分样式不显示按钮文字）
3、区块设置
（1）添加区块：点击添加区块弹出设置区块弹框，已经添加的图标会在右侧显示，并且可拖拽顺序，图标添加完成后点击“确定”区块添加成功。
区块内按钮介绍：区块分为四个类别，单个功能按钮、电商订单状态、到店预约订单状态、行业预览订单状态。
（2）区块增加图标：点击区块中间添加按钮打开设置区块弹框，也可维护之前添加功能。

（3）编辑区块图标：点击某一区块中间功能按钮进入功能编辑页面；可更换图标、更换标题、查看此功能链接进对应的功能，也可删除此按钮。

（4）区块设置：可对选中区块进行页面样式进行设置；
【区块内容】：区块名称是否展示以及名称设置；区块图标是否展示以及图标上传；
注：必须展示区块名称才会展示区块图标。
【区块样式】
展示：区块三个展示样式供用户选择。间距：区块上方间距设置。图标大小：区块中图标大小统一设置。颜色：区块背景颜色设置。行高：区块高度设置列数：区块一行展示数据，最多展示5个，最少展示2个。
【文本设置】：区块所有文字大小。

（5）删除区块：讲选区块删除。
（6）移动区块：区块之间上下移动。
4、区块-组件样式
（1）主题
【彩色块状】：个人中心所有的图标更换为如下图：

【单色线醒：个人中心所有的图标更换为如下图：

（2）透明度设置：设置所有区块透明度，默认不透明。
5、单页模板使用
在普通页面中可点击模板，弹出选择模板框后选择个人中心模板。

选择模板：
注：使用模板的个人中心页面为普通页面，但是系统个人中心页面还是存在的。如果需要跳转到普通个人中心页面需要在入口设置点击事件进入普通个人中心页面。