什么是Mind-Flow？中篇(有演示哦)

Adobe帮不了我们什么？

在演示我做的DEMO之前 先聊聊Adobe 我个人很喜欢A厂的产品 记得小学5年纪的时候电视上还有PS课程 跟着一点一点做 而且他们的软件界面一直很漂亮

A厂其实一直在这方面做努力 从早些年收购Flash 大紫大红。到Flash遭到围攻 A厂推出的AIR系列早几年诞生不会像今天这样尴尬。虽然现在用AIR开发的APP虽然数量少 但质量依然很高。

自从乔帮主喷Flash 大家纷纷跟上群殴Flash A厂也很无奈 Flash的确无法满足其他厂商的利益 反倒是HTML5 作为中立技术 又刚好赶上大家的浏览器之争 无论是各家给的贡献 还是宣传 活跃程度都急速攀升。

相信不少桌面软件程序员都看到了这几年的变化和趋势.桌面软件除了大型软件较难以短时间移植.新生软件非系统类的都转移成了web base.

A厂一方面非常舍不得重金打造的AIR产品系列，也不舍得Flash就这么死去.但另一方面也加紧打造HTML5产品战线 为后面铺路.

Dreamweaver作为老牌A厂设计软件 在设计师为导向的今天 越发显得乏力。专业程序员不爱用 设计师不会用 是主要的问题。

MUSE拯救世界？

就在DW快不行了，架构又太古老 不容易大改。muse像一匹黑马被收编入A厂阵营。

muse最早只是一个用AIR框架开发的一个非常非常小的程序。早期版本只有8M左右。主要提供了拖拽式的编辑和非常灵活帅气的对齐功能。和非常直观的网站关系图。基本上可以想象它就是PPT+AI的排版 的结合体。

其整合的一键FTP发布。直接保存HTML。自定义字体渲染技术。可以让一个只会用PPT的人。5分钟学会做静态网站。

可MUSE这样一个有非常多很多精巧设计的软件 终究只能生成静态页面。虽然可以嵌入HTML 但和其他元素的整合性不强。A厂后来放缓了开发速度(个人严重怀疑人员被调到其他产品去了)

EDGE拯救世界

MUSE没了音讯，这些开发大牛去哪了？MUSE虽然精巧，但A厂真正的野心在于用HTML5技术重振Flash的霸业。虽说技术上问题不大 但Flash这个名字被人搞坏了。索性开辟了一条新产品线Edge系列。

Edge系列以Animate产品作为主战斗力。配以几个不同的小型工具辅助战斗。第一次使用Animate的时候估计所有人的感觉都和我一样。这货就是用HTML5重写的Flash！！无论是时间轴还是AS，补间动画和事件出发，元件嵌套，设计思路和Flash几乎如出一辙。唯一不同的是内核AS变成了JS。而A厂之前也收购了知名JS框架CreateJS来作为Animate强大的内核支持.

就在这一切非常美好的时候 我突然发现小哥还是得去学JS，卧槽 我不想学JS！！！可我还想做一些交互的东西 而且是在网页里。这可如何是好 眼看以后桌面软件越来越少 越发感觉不学JS跟不上时代。可我真不想学！！

自己救自己

在深圳回上海长达12小时的火车上 无聊弄了一个Mind-Flow的原型 希望就此激发大家的兴趣 加入我们的开发阵营中 一起完成这个软件

--------------------正题--------------------

比方说我们打算做这个东西

2个按钮 按下分别可以切换下面的图片成不同的图案

接下来是我们如何实现：

首先编写HTML 这部分有大量软件可以帮你自动完成 比如DW 等等等等

有2个按钮 分别叫A和B id分别为b_1和b_2

还有一个空白的图片 id为im1 为了让大伙看清它是个图片 我限制了一下尺寸为64 这样有边框。

但是光有按钮 按下去啥反应都没有 我们需要给他写JS

OK 我们拿出以前开发的软件来改一下 添加了2个模块

第一个专门响应按钮 我们把它作用的对象改成"b1" 右侧第一个出口表示被按下 第二个表示弹起

第二个模块是设置图片内容的 第一个参数仍然是对象 我们设置成了"im1",第二个参数是图片的URL 我们填入一个网上找来的图片的地址

同样 我们可以加入第二套 给另外一个按钮使用 设置图片的时候 他们甚至还可以共享对象的设置

看效果和代码点击这里

这博客插入html有问题 坑爹！效果和代码大家看这个链接 JS代码均为机器自动生成 我只人工加了注释

http://jsfiddle.net/rexchen80/h6SVt/

这就是Mind-Flow将来要实现的效果 不用编写代码 只需要拖拽几个方块 就可以实现编程 如果你擅长JS 想和我一起打造这款平台 欢迎联系我一起开发这个开源项目