墨刀

• 墨刀的好处和基本元素，可以参见15分钟认识墨刀基本元素
• 本次主要希望借助墨刀已有的模板和工具来实现模板复用和页面内动态效果实现

本文目的

• 认识墨刀已有模板
• 认识墨刀工作流程
• 实现原型的快速开发
  • “每天回家来个拥抱！” 迭代一

---

Ready Go!

借用前的思维准备

吾尝终日而思矣，不如须臾之所学也;吾尝跂而望矣，不如登高之博见也。登高而招，臂非加长也，而见者远;顺风而呼，声非加疾也，而闻者彰。假舆马者，非利足也，而致千里;假舟楫者，非能水也，而绝江河，君子生非异也，善假于物也。
－荀子《劝学》

• 也是有趣，年纪越大，越能够感受到古人所讲的智慧。借助已有工具开发，真的是要比单独开发快很多。
• 借用的基本原则：记住复用为了扩展能力而非投机取巧。这里参考 V.Anton Spraul 的原文
  复用的关键点

认识墨刀已有模板

• 这里介绍 “母版” 和“组合面板”中的工具。
• “组合面板”：

  • 内置组合面板完全 可以当基本组件来使用。这种复用是合适而且高效的。

    
    组合面板
  • 自定义组合面板：如何只是希望将一些页面设计结合起来，并被复用，使用自定义是非常好的选择
• 母版：在墨刀里是一种可以不断被重复使用的设计样式，使用的时候用先要通过“母版编辑器”来编辑。
  组合示例.gif
• “母版编辑器”：实际上就是新建了另一个工作区，只是整个工作局限在母版的范围内。通过返回键（在区域的左上角）回到原来工作区。（当时我找了半天回到原来工作区的按钮）。
  母版编辑器.gif

工作流：列表区

• 在进行组件布局和各种设计的时候，最重要的是需要面对各种页面和各种组件组合和选择，而列表区则显示也帮助呈现这种目录结构。
• 对页面进行处理：“页面列表” （图片来自官方文档），在这里多玩玩，很快就能上手
  页面列表示意.png
• 对组件进行选择：“组件列表” 组件多了，尤其是层叠多了，选择就困难了，直接在工作区点击不如在这里点击方便。
  组件列表示意.gif
• 在同一页面中进行动态操作：“页面状态” 这是超级酷的功能！ 官方参考文档 示例有些复杂了，读起来还有些费劲，这里做一些注解，并用一个简单的示例，
  • 所有页面必须有一个状态，没有则被显示为默认状态，全局状态不能被链接和操作；
  • 每一个页面状态都不同和彼此独立，包括链接；
  • 通过超链接实现触发和页面关联；

  • 增加组件只能在全局状态中进行

    
    页面状态示例，可以看到通过点击星星实现从默认状态到状态2的过渡

实现快速开发

• 第一版
• 更新changelog:
  • 实现 组合面板复用，将礼物，好吃的，甜言蜜语构建为一类附件；
  • 实现 页面状态 更新 通过“点亮星星”✨的方式实现页面内动画效果

甜蜜的秘密

愿拥抱每一天！