Magical Drag v2.2.2

Magical Drag一款页面的编程类软件，通过这款工具，用户可以快速的页面的设计和布局，可视化的操作体验，让每个用户可以更加快速的完成自己的页面的设计和制作，同时还能后期修改，让那些不喜欢的地方修改掉！

Magical Drag常见问题

问：此为深入使用布局器，期望有些组件的属性比如下拉框 能够动态的根据后台返回来设置

答：您需要使用布局器的api+callback便可实现，具体做法如下

方案一：实时刷新调用

在callabck.js的pre_build_attrs(每次在构建属性之前)里注入以下逻辑方法

调用api.getConstant()拿到constant.js的实例，然后动态修改this.rightPanel的某个组件的属性

最后需要调用一下api.refreshRightAttrPane();使之生效

方案二：仅在布局器加载后调用一次

在callback.js的after_start(布局器加载完毕)

里注入以下逻辑方法

调用api.getConstant()拿到constant.js的实例，然后动态修改this.rightPanel的某个组件的属性

最后需要调用一下api.refreshWorkspace();使之生效 以上方案同样适用于自定义左侧组件源

最后调用一下api.rebuildLeftComponents();刷新一次左侧源的事件

Magical Drag使用方法

软件都在html里面

您可以使用idea直接打开start.html 总之必须采用localhost方式打开

windows用户直接双击启动.bat 即可 打开浏览器访问上图的网址即可，请尽量使用chrome访问 获取最优体验

手动启动：双击ngxin.exe 打开浏览器访问上图的网址

Magical Drag注意事项

整个路径不要包含中文否则无法启动

Magical Drag安装说明

1.下载完成后不要在压缩包内运行软件直接使用，先解压;

2.软件同时支持32位64位运行环境;

3.如果软件无法正常打开，请右键使用管理员模式运行。

Magical Drag软件测评

Magical Drag是基于h5实现的自由布局器，拖拖拽拽就能满足您的设想，即时预览布局；如果再结合我们的代码生成器，更能让你在自动生成基本的管理后台功能后，再次随心所欲的修改界面布局。

Magical Drag更新日志

callback.js中增加

before_click_left_component_to_center

after_click_left_component_to_center

增加 right_menu配置 可以自定义右键面板菜单功能

属性

标题采用友好的tooltips,只需要配置属性的tooltip

增加节点是否可以拖拽宽高配置

增加其他UI框架 AntDesign,Vant,Miniui,Vuetify

支持多个key并存校验 减少多种环境切换的麻烦

key.js中采用

/*软件运行允许的域名对：防 具体配置在application-env.js*/

keys:env.keys,

application-env.js中采用

keys:[

{

//允许的域名

domain:"",

//发放的加密串 请咨询www.magicalcoder.com

secret:"",

}

]

增加表格的合并 拆分 新增行列 删除行列

重构部分文件目录 更加精简

index-xxx.html引入<script type="text/javascript" src="assets/drag/js/lib/redips/redips-table-min.js"></script>

同时注意新版此min文件所在目录