持续更新中,也欢迎大家跟贴提供相关信息
1. CEF3相关库网址:主要用于桌面级应用开发。有些详细的列出了各个chromium相关的版本
相关网站:
http://www.magpcss.net/cef_downloads/index.php
https://code.google.com/p/chromiumembedded/
http://cefbuilds.com/
http://iwebing.lofter.com/post/3736f_41187c
下面简单介绍一下CEF3的接口。
CefClient:回调管理类,包含5个接口用于创建其它的回调类的对象
CefLifeSpanHandler: 回调类,用于控制popup对话框的创建和关闭等操作
CefLoadHandler: 回调类,可以用来监听frame的加载开始,完成,错误等信息
CefRequestHandler: 回调类,用于监听资源加载,重定向等信息
CefDisplayHandler: 回调类,用于监听页面加载状态,地址变化,标题等得信息
CefGeolocationHandler: 回调类,用于CEF3向嵌入者申请geolocation的权限
CefApp: 与进程,命令行参数,代理,资源管理相关的回调类,用于让CEF3的调用者们定制自己的逻辑
CefBrowser: renderer进程中执行浏览相关的类,例如前进,后退等
CefBrowserHost: browser进程中的执行浏览相关的类,其会把请求发送给CefBrowser
CefFrame: 表示的是页面中的一个Frame,可以加载特定url,在该运行环境下执行JavaScript代码等得。
V8:CEF3提供支持V8extension的接口,但是这有两个限制,第一,v8 extension仅在Renderer进程使用;第二,仅在沙箱模型关闭时使用
如何开始调试WEB Inspector:
http://smus.com/extending-chrome-developer-tools/
https://developers.google.com/chrome-developer-tools/docs/contributing?csw=1
https://groups.google.com/a/chromium.org/forum/#!forum/devtools-reviews:google group
如何模拟选择一个DOM element
http://rockingcode.com/tutorial/element-dom-tree-jquery-plugin-firebug-like-functionality/
2. Node-webkit:主要是用作平台级开发
相关网站:http://www.oschina.net/p/node_webkit
介绍如何使用:http://pan.baidu.com/share/link?shareid=3743096074&uk=2754670725&qq-pf-to=pcqq.group
3. Webtop: html5桌面app开发引擎
基于webtop,你可以使用html5和css3等新技术构建桌面app,即开发直接运行于windows上的软件,使用透明渲染模式能将网页直接渲染在桌面上,轻松实现透明阴影等特效。而且,提供了大量的本地api,使你的app能达到跟本地app一样的体验。基于它,你可以开发诸如浏览器,QQ,PS,桌面widget等桌面app。这种开发软件的方式,相比传统桌面软件开发方式的开发效率
- 官网:http://webtop.alloyteam.com
- 下载地址:http://download.alloyteam.com/webtop.zip
- 官方群:257960168
相关网站:http://tencentopen.github.io/proj/AlloyDesktop/index.html
4. Tidesdk:Deploy your Webkit-based desktop applications across all three major desktop operating systems with privileged access to native APIs.
相关网站:
http://www.tidesdk.org
https://github.com/tidesdk
5. APPJS:把Chromium和Node.js结合在一起,使用了Node.js的本地化能力来进行本地逻辑处理,同时使用Chromium的图形化能力来展现图形化界面,把这两者串起来的就是js了。Node果然无比强大。
据说目前已经停止维护,转投node-webkit了
相关网站:
http://www.zhujianfeng.info/?p=67
http://appjs.com/
https://github.com/appjs/appjs
6. Sencha Touch :The leading HTML5 mobile app framework with over 50 built-in components, themes for every mobile platform, and a built-in MVC system.
相关网址:http://www.sencha.com/
7. 解压.pak文件的工具,请参考https://github.com/DennisKehrig/patch_devtools
8. LomoX:http://www.lomox.org/ 桌面UI框架
代码地址:
http://t.svnchina.com/svn/lomox/
http://lomox-framwork.googlecode.com/svn/
qt5.1 vs2008 vs2010 vs2012 的版本:https://github.com/colin3dmax/lomox
是一个以Web界面布局,一款开源(免费)、基于Webkit和C++的桌面应用软件界面库。业务逻辑
使用C、C++开发,帮助app开发者。跨平台运行,完美兼容Windows、Linux、MAC、iOS、Android。本框架基于qtwebkit,用于跨平台桌面web ui,轻松在web实现桌面程序。
9. eawebkit
10. phantomJS
11. Pokki:https://developers.pokki.com/docs/
12. Crosswalk
13. Hex: A Solution to Building Desktop Application Using HTML5 and Node.js
https://github.com/netease-youdao/hex
14. enyojs:http://enyojs.com/
使用了CEF的产品:
-
各种浏览器
早期的双核浏览器(IE + Webkit),有些使用了CEF来作为Webkit内核浏览器控件。
不过对于浏览器来说,直接在Chrome上面扩展,其实才是王道,大家现在都这么做了(各种极速浏览器)。
-
Evernote Client (on Windows)
Evernote允许用户将网页粘贴到笔记中,还提供了插件用来将网页保存为笔记。
那肯定是需要在Client上面可以正确的渲染页面咯,这个任务就交给了CEF。
-
GitHub Client (on Windows)
GitHub也打包了libcef.dll,从表现上面看,用来展示项目的ReadMe页面的,肯定是CEF,其他地方的UI,可能部分也是用页面来实现的。
-
QQ
QQ很早之前就通过内嵌IE来实现一些功能和界面。从去年开始,QQ引入了CEF,对一些之前用IE的地方进行了替换,这样就可以使用一些基于Webkit的新特性,同时也获得了速度、稳定性、兼容性方面的优势。
-
Adobe Edge Animate & Adobe Edge Reflow
Adobe推出了一整套制作现代网页(或者说HTML5?)的工具,取名Edge。
上面两款软件,其基本面向的是Webkit内核的浏览器,那么内嵌一个Webkit内核,来提供所见即所得的预览、编辑界面就是必须的了。他们都使用了CEF。(后面会介绍CEF和纯Webkit的差别)
-
Q+
Q+在Web App的概念下,为Web页面提供了一个运行环境(简单来说就是:Client的一个框和一些可用的API),支持IE和Webkit内核。
对Web开发同学来说,我们引入的Webkit内核(实际上是CEF),无需考虑IE的版本兼容问题,既提高了开发效率,又可以利用一些新的HTML5特性。当时Q+的应用市场、消息中心、壁纸、音乐Widget等应用都是基于Webkit内核开发的。
Q+项目可以说对CEF进行了比较多的尝试,比如:
-
开发的音乐Widget,就使用了HTML5的audio标签;
-
一些应用使用了HTML5的离线功能(就是配个manifest文件那个),当然其中也遇到些曲折,收获了不少经验。
-
打包的Webkit调试工具(Dev Tools)。
-
自定义协议:比如对qplus://协议的访问,可以重定向到某个特殊文件夹之类的功能。
-
Off Screen Rendering(OSR,离屏渲染):通过离屏渲染 + Windows的Layered Window,就制作了不规则的网页窗口(网页不透明区域是什么形状,窗口就是什么形状)
- 有道云笔记
- 豌豆荚:原来使用的是webkit,后来改为cef,具体看这个文章:http://www.wandoujia.com/blog/changelog-2-55
关于CEF的评价:
http://it.zhans.org/06/790.htm
http://yogurtcat.com/posts/cef/hello-cef.html
【VC】各种免费、开源的directui库,duilib,REDUI,UiFeature,sharpui等
最近接触到了不少免费的优秀directui库,如duilib,REDUI,UiFeature,sharpui, libuidk, uipower等。给软件界面开发来了质的飞跃,好东西当然要分享出来。
首先,duilib已经家喻户晓了,官网、google托管地址也是满天飞,不说了。
然后其他的是正在完善即将开源和一边完善一边整理文档的库,都很不错。
REDUI,作者很低调,为了不让其他人拿去改成商业版买钱盈利,值开了QQ群。群号联系作者后公开。
UiFeature,界面非常炫,直接把src和demo一起打包后放到了网上,目前也没建立官网,只开了贴吧、微博等交流方式。
sharpui,作者也是在完善中,用业余时间做非业余的努力,很给力,即将托管开源。
UiFeature 是一款免费的开源自绘UI构建平台,欢迎大家使用。
腾讯微博:http://t.qq.com/uifeature
新浪微博:http://weibo.com/uifeature
百度贴吧:http://tieba.baidu.com/f?kw=UiFeature#
邮箱:[email protected]
QQ群:173673104(主群)
QQ群:221304086(副群,请先加入主群)
libuidk:http://www.iuishop.com/
Intel® XDK:http://software.intel.com/en-us/html5/tools
从某处摘到的一段话,感觉很不错。
UI其实分为很多种:
1. 传统UI、以及在此基础上延伸出来的标准库,例如BCG。
2. Direct UI 上面列出的已经很多了
3. Web UI 而这个里面又分为很多种,有HTMLayout这样使用了HTML,CSS的语法但本质还是Direct UI的引擎,也有使用IE内核等传统浏览器引擎的方法,如果使用CEF,或者IE10内核还可以支持HTML5。
这几种界面库没有相互替代的关系,而是根据不同的界面需求,知道他们的优点、缺点选择不同的技术。
例如你做类似office的界面,那可能BCG非常适合. 而做QQ这样的界面可能就是 Direct UI 更合适。
至于你说的只是一个工具栏带上combbox,那我告诉你,小小的HTMLayout可比BCG做出的的效果漂亮太多,而且比BCG的用法要简单太多,即使是ribbon界面用HTMLayout也可以轻松搞出来,HTML排版的强悍是传统UI难以望其项背的。
至于说HTML,CSS容不容易,能学会其他编程语言,这种东西顶多就是一周可以玩的烂熟的东西。
而且未来是web的世界,学这些技术肯定是很好的投资。
我的观点是,html5这种技术历史包袱太重,导致解析器难以小型化和高性能化;另外html本身的设计目标是为内容展现进行优化的排版,用来做UI有一点“用老虎钳子敲钉子”的感觉:能敲,但不太顺手。
我负责的产品中前任用到的第三方的东西都被我干掉了,没有源码的东西,功能强大但用到比较少功能的(比如boost),一个长期的需要不断开发维护的产品还是不要用到任何第三方的东西,这个对产品进程控制不利。
vc写界面确实麻烦,但是还是不得不写,相信对于某些特定领域的产品来说,也无需用到所有界面控件的所有功能,所以还是用专门的有针对性的自己公司开发的控件比较好。当然对于外包公司,一些小公司,可能关注点不一样,要的是快速开发,不用关心几年后的问题,那用成熟第三方的产品比较好。