开发 web 桌面类程序几个必须关注的细节
HoorayOS 写了差不多快2年了,在我的坚持下也有一部分人打算着手自己也写套类似的程序,我想我可以提供一点经验。
俗话说细节决定成败,开发2年多来,我看过大大小小类似的程序不下20个,各有优点也各有缺点。或许是处女座的强迫症导致我不能容忍这些缺点在我的程序上出现,所以一直完善至今。
以下是我初步整理的几处容易被忽视的细节:
一、当浏览器改变大小时,桌面图标无法重新排序
这个细节相对比较容易被注意,不细说。
反面教材:http://www.cdesk.org/demo/demo.html
二、当浏览器改变大小时,打开的窗口无法重新定位
这个问题会导致你的窗口可能在显示区域之外,无法进行任何操作,虽然你可以将浏览器恢复原先大小,将窗口拖动到适合位置,再改变浏览器大小。
反面教材:http://www.muzilei.com/demo/desktop3.0/index.html
同样问题还出现在挂件上,如 Q+web 就有这问题
反面教材:http://web2.qq.com/webqq.html
三、通过鼠标划取,可以选中文字
如上图,就是这种问题,简单测试方法可以按下 CTRL + A。反面教材:http://www.cdesk.org/demo/demo.html
四、当桌面图标过多时,超出置顶显示区域,被隐藏在外的图标无法进行操作
当你解决第一个问题的时候,立马就会碰到这个极端的情况,你可以强制把浏览器缩小到一个极小的窗口测试。
解决办法就是增加一个滚动条,或者模拟一个滚动条。反面教材:http://www.a-jie.com/webdesk/default.stm
五、无法通过点击窗口内部区域进行多个窗口间的置顶切换
你可以在电脑上开2个窗口,比如2个文件夹,将其重叠,边角有覆盖即可,然后分别点击窗口内部(非标题部分),你会发现你点击哪个窗口,哪个窗口就会被置顶到最上面。
而在 web 端实现这个问题需要一点技巧,因为大部分窗口里都是放个了 iframe,而 iframe 又是无法获取到点击事件的,解决办法就是当窗口处于非置顶时,在iframe上覆盖一个透明的遮罩层,然后给这个遮罩层绑定点击事件,用来处理置顶效果。
反面教材:http://32100.net
六、flash 应用遮罩层无法将其遮罩
这个问题是随着上一个问题出现的,如果 iframe 里加载的是一个 flash 程序,因为是第三方的网站,如果没有做过处理,flash 可能会一直置顶,即使有遮罩层也无法将其覆盖。
对于这个问题,技术上无法判断出 iframe 里是有有 flash,所以只能人为操作。HoorayOS 的做法是在创建应用的时候需要选择是否为 flash 应用这一选项,如果选是,则当窗口不处于置顶时,将 iframe 直接隐藏,或者直接移出浏览器外面,如设置 left:-9999px
七、拖动对象时,没有阻止默认动作,导致拖动出新窗口
这问题一般容易出现上图标拖动上,文字链接也会出现这问题。解决办法很简单,就是用 preventDefault() 方法。
反面教材:http://www.a-jie.com/webdesk/default.stm (你可以按住开始按钮,拖动一下然后放开左键)
八、让我想一想,就先到这吧
本文仅做为技术交流,以上出现的反面教材链接,如有冒犯,还请见谅。
开发 web 桌面类程序几个必须关注的细节的更多相关文章
- Electron与WEB桌面应用程序开发及其它
这几天在构思项目,研究了一下Electron,记录下来. 说起WEB桌面程序,当前最火的就是Electron了. Electron的架构用一句话总结,就是一个main.js进程加上一个或数个chrom ...
- QtSoap开发web services客户端程序
首先需要下载QtSoap开源包,下载地址为: http://www.filestube.com/q/qtsoap+download, 我使用的是:qtsoap-2.6-opensource(不 ...
- Web桌面应用框架3:Web桌面应用开发的N种Style
研究Web桌面应用开发有一段时间了,总结了Web桌面应用开发的一些主流方式. 一.前端Style 这种方式的就是直接实现一个Web程序,再封装一个浏览器展示,相当粗暴和有效.著名的框架就是Electr ...
- Web桌面应用框架2:著名的WEB桌面应用分析
前一篇文章里,分析了包括NW.js和electron这种纯JS框架在内的几种Web桌面应用开发方式,实际上还有一种最古老的方式,那就是嵌入WebView的方式. 嵌入WebView的方式和整个程序都是 ...
- Spring Boot 2.x基础教程:使用 Thymeleaf开发Web页面
通过本系列教程的前几章内容(API开发.数据访问).我们已经具备完成一个涵盖数据存储.提供HTTP接口的完整后端服务了.依托这些技能,我们已经可以配合前端开发人员,一起来完成一些前后端分离的Web项目 ...
- PHP-GTK 扩展(用PHP编写桌面应用程序)
PHP能做什么? PHP-GTK (构建桌面应用程序在PHP中使用PHP-GTK) 普及一下知识php如何做桌面客户端 [PHP技术]PHP开发Windows桌面应用程序实例 实战PHP/GTK 哪位 ...
- 用Delphi7开发Web Service程序 转
转:http://rosehacker.blog.51cto.com/2528968/450160 用Delphi7开发Web Service程序,并把服务程序放在IIS Web服务器上提供给 ...
- android widget 开发实例 : 桌面便签程序的实现具体解释和源代码 (上)
如有错漏请不吝拍砖指正,转载请注明出处,很感谢 桌面便签软件是android上经常使用软件的一种,比方比較早的Sticky Note,就曾很流行, Sticky Note的介绍能够參见 http:// ...
- Visual Studio 2012 开发环境配置+控制台工具+桌面应用程序
一.界面布局视图设置 1.窗口的布局.控制台窗口运行恢复到开发环境的设置方法 也可以保存好设好的个性化设置,导入设置: 2.视图|服务器资源管理器(sever explorer) 可以访问数据源.服务 ...
随机推荐
- Python数据类型之“集合(Sets)与映射(Mapping)”
一.集合类型(Sets) 集合对象是不同的(不可重复)hashable对象的无序集合.常见用法包括:成员关系测试.移除序列中的重复.以及科学计算,例如交集.并集.差分和对称差分.通俗点来说,集合是一个 ...
- Entity Framework 5中应用表值函数进行Linq查询
Entity Framework 5引入了表值函数(Table-Valued Functions TVFs).表值函数的返回类型是一个Table类型,可用在SQL查询语句中.最简单的表值函数,读取客户 ...
- DOM操作表格
前面的话 表格table元素是HTML中最复杂的结构之一.要想创建表格,一般都必须涉及表示表格行.单元格.表头等方面的标签.由于涉及的标签多,因而使用核心DOM方法创建和修改表格往往都免不了要编写大量 ...
- java中Cookie中文字符乱码问题
如果Cookie中的Value 中有中文字符出现,在加入Cookie的时候,会出现下面的错误: java.lang.IllegalArgumentException: Control characte ...
- Docker之Linux UnionFS
UnionFS UnionFS是一种为Linux,FreeBSD和NetBSD操作系统设计的把其他文件系统联合到一个联合挂载点的文件系统服务.它使用branch把不同文件系统的文件和目录"透 ...
- Responsive Web CSS – 在线响应式布局创建器
如果您已经使用了 CSS 或前端框架,创建响应式布局应该不难. 然而,如果你刚涉足这类布局,Responsive Web CSS 可以帮助你快速上手. 这是一个基于 Web 的工具,使任何人都可以通过 ...
- 使用Html5+C#+微信 开发移动端游戏详细教程 :(三)使用html5引擎搭建游戏框架
教程里的案例我们是通过H5游戏引擎开发,目前H5的游戏引擎比较好用的是白鹭,不过对于新手来说白鹭的开发环境和工具使用过于复杂,这里推荐一个国内大神编写的游戏引擎:lufylegend. 直接在页面引入 ...
- 自制简单的.Net ORM框架 (一) 简介
在自己研究ORM之前,也使用过几个成熟的ORM方案,例如:EntityFramework,PetaPoco,Dapper 等,用是很好用,但是对自己来说总是不那么方便,EF比较笨重,Dapper要自定 ...
- eclipse设置及快捷键
快捷键 查看所有快捷键: Ctrl+Shift+L 调试代码: F11 逐语句: F5 逐过程: F6 快速执行代码: Ctrl+F11 自动格式化代码: Ctrl+Shift+F 在本行代码下插入新 ...
- [转]俞敏洪:我和马云就差了8个字... [来自: news.mbalib.com]
我和马云差了 8 个字:越败越战,愈挫愈勇. 马云,我真的非常的佩服他,首先佩服他的是他跟我有同样的经历,我考了 3 年才考上了大学:他也是考了 3 年.我比他还要幸运一点,我考上的是北大的本科,马云 ...