[博客助手] 网页配置栈动画

548 阅读2分钟

前言

渣新又来辣大家眼睛,前不久开源了一个仿钉钉审批流程,在追加计算公式组件的时候,看大佬介绍逆波兰表达式时,大佬用了ppt动画来展示栈的数据动向。

当时觉得自己不会PPT,要不写一个简单的做栈动画的玩具,这才有了这个项目。

码云预览地址 码云仓库址 Github仓库

功能简介

t5M49H.gif

这是一个比较简单的项目,主要目的是为了做入栈出栈,交换数据等简单动画。

记录动作步骤

大佬写博客和示意图时,可能会想要一系列的入栈出栈等操作,连续播放并录制屏幕。记录动作步骤可以记录你操作的顺序,最后再一起执行动画。

t5MRAO.png

配置项

在配置面板,你可以自定义容器背景,元素背景,元素字体色,元素间隔,执行动画时间等。

t53sPO.gif

自定义拖拽文本

考虑到可能会需要一些简单的说明文字,我添加了一个可拖拽,能配置字体大小,颜色,padding等属性的文本功能。

tICAJK.gif

真实需求

其实写这个动画,还有一个很重要的目的就是——想让我的仿钉钉审批流程start破百! 哈哈, 刚刚发出来的那个星期涨了70个star,结果两个星期过来了 , 才涨了二十,现在还差一个就破百了,哈哈。再过不久可能要投身求职浪潮,所以特地再做个小玩意,捞一捞之前得项目。

Gitee预览入口

GitHub仓库

码云仓库

主要功能

  1. 表单配置(form-generator)
  • 拖拽表单,填写组件配置
  • 根据配置的JSON生成预览页面
  1. 流程节点配置(仿钉钉界面)
  • 创建审批流程(发起人,审批人,条件节点,抄送人), 配置节点详细数据
  • 必填节点校验

支持组件:

  • 单行输入框, 多行输入框, 数字输入框, 金额
  • 下拉选择, 级联选择, 省市区
  • 单选框组, 多选框组
  • 时间选择, 时间范围, 日期选择, 日期范围
  • 滑块, 组织机构, 附件, 计算公式
  • 布局容器, 表格

界面预览

YL5ip8.png

仿钉钉审批-掘金文章

感谢点击进来阅读得你们,祝大家摸鱼越来越爽,工资越来越高。