校友会小程序开发笔记二十四:不同学校校友会动态换肤方案设计

 


功能说明

 

在开发校友会小程序的时候,只需要开发一套模板,

但是可能不同学校校友会小程序需要做 定制化配色方案,很多学校都有自己的VI(视觉识别系统),校友会小程序也是延续该VI风格

比如上海交大红色主体的 VI:

 

中国农业大学绿色VI

北京理工大学深绿色VI

 

 

 北京大学深红色VI

 

 

 

 

 

 

 

也就是说,同一个校友会校友录小程序个体需要对页面的元素(比如:按钮,字体等)进行不同的配色设置,

 

一般来说,有两种解决方案可以解决小程序动态换肤的需求:

  1. 小程序内置几种主题样式,通过更换类名来实现动态改变校友会小程序页面的元素色值;

  2. 后端接口返回色值字段,前端通过 内联 方式对页面元素进行色值设置。

 

当然,每种方案都有一些问题,问题如下:

  • 方案1较为死板,每次更改主题样式都需要发版小程序,如果主题样式变动不大,可以考虑这种;

  • 方案2对于前端的改动很大,内联 也就是通过 style 的方式内嵌到wxml 代码中,代码的阅读性会变差,但是可以解决主题样式变动不用发版校友会小程序的问题。

 

 

UI设计

 

 

 

 

 


数据库设计

 

 


 


后台管理

 

 

 

 

 

 

作者交流微信:cclinux0730
项目代码GIT: https://gitee.com/cclinux2/cc-alumni

posted @ 2021-03-31 20:05  CC同学呀  阅读(148)  评论(0编辑  收藏  举报