【HoorayOS】开源的Web桌面应用框架(文件夹功能分析)

  下一版本的重要功能就是“文件夹”,随着应用码头的出现,任务栏也改为大图标的模式,桌面可放置图标的位置愈来愈少,“文件夹”就应然而生了,但在制做过程当中,发现几个难点,也就是图标拖动时须要注意的部分。以下图,文件夹内的图标在拖动结束的时候,位置可能会处在四处:应用码头、桌面、当前文件夹、其余文件夹数组

  前两种状况能够参考下图,图标拖动的第一步就是先画格子。(demo:http://jsbin.com/otihix/1.net

  而后记录下每一个格子四个角的坐标保存为数组,而后循环数组依次添加图标进去。blog

  以后图标拖动也是须要这个格子数组,当我拖动完毕释放图标的时候,判断鼠标释放的位置处于哪一个格子中间,进行图标移动并从新排序,实现图标拖动功能,应用码头拖动也是一样思路,二者结合起来无非就是要判断两次,先判断释放位置是否处于应用码头的格子内,而后再判断是否处于桌面的格子内。排序

  我在想,文件夹之间的图标拖动是否也能够参考这种模式,桌面上全部已打开并处于显示状态的文件夹窗口,看成是一个个的格子,保存到一个数组里。由于显示在桌面的窗口无论在任何状况都是高于桌面的,也就是覆盖在桌面上,因此当拖动结束释放时,优先判断图标是否处于文件夹的格子内,而后再依次判断应用码头的格子和桌面的格子。开发

  随之又想到会出现这种状况,就是文件夹会重叠,若是我图标拖动的位置恰好处于图中问号处,系统怎么知道我先要拖放的位置的哪一个窗口呢?get

  其实细想一下,彻底不用担忧。个人文件夹格子数组能够在图标拖动的时候建立,建立的时候依次按文件夹窗口z-index的值从大到小来读取,这样就是保证文件夹格子数组里记录内容的顺序也是按照文件夹层级顺序来存放的,当我循环数组判断图标拖放位置的时候,天然也就避免了刚才那个问题。循环

  OK,以上就是文件夹内图标拖动的大体思路,但愿开发的时候可以顺利些,也能让第三版顺利面世,让你们用用试试。im

  PS:更新demo演示:http://jsfiddle.net/UjS7Y/2/embedded/result/demo

相关文章
相关标签/搜索