appcan快速学习

绪论

学习appcan也有一段时间了。开发了一些demo 。还没有开发出产品。这里就appcan的学习进行讲述，让大家远离破烂学习资料的坑。

appcan官网有学习的视频和文档，视频还是那个6小时的好一点（在首页上点击学习中心）。其他的都白扯，个人觉得讲的不好。快睡着了。

吐槽

看了视频在看文档，文档非常次有很多错误。例子也不是很好，根本学不会的。加群和论坛。几乎是问了问题没人回答你。再说初学者也问不出来啥。

这时候我们最快的就是学习方式就是demo 然后才是文档，最后是源码分析。  那对于初学者继续改怎么学呢。看完视频还是不会（可能我学习能力不强吧）。

正题

下面我就针对学习能力不强的同学说一下关键点，穿一下主线，做两个demo ，然后开发项目。顺便说一下，你的下载他们的ide 学会简单的调试，网上有很多文章，这里不讲解了。

appcan 在你看6小时的时候 。 主要有ui部分。和插件部分。

appcan特性

ui部分 有个appcan的两个核心；我就两个核心讲解一下我的理解，和appcan的原理。

这里说一句废话：appcan 其实不是一种html 的开发，他和phoengap 是不一样的。他是一种深度的混编，可以说更像nativejs。

第一个特性 ，ui 采用弹性盒模型 。这个东西是一个css的东西，不过对于一把我这种后端java 或者 php的开发人员来说，是一个熟悉又陌生的东西。知道又不太会用，这时候我发现了一个好东西——那就是张鑫旭的博客，写的很详细

http://www.zhangxinxu.com/wordpress/2010/12/css-box-flex%E5%B1%9E%E6%80%A7%EF%BC%8C%E7%84%B6%E5%90%8E%E5%BC%B9%E6%80%A7%E7%9B%92%E5%AD%90%E6%A8%A1%E5%9E%8B%E7%AE%80%E4%BB%8B/

看完他的博客后，自己写两个例子，然后看看appcan的css 源码。你用他的IDE 随便建一个项目在css中就能找到。 弹性盒模型就攻破了。

第二个特性，窗口模式。窗口是appcan的一个核心亮点，他不是简单webView 直接加载你的页面。而是多个webView 这些多个的webView 建成一个栈，每一个webview 是一个窗口，也是你的一个页面。你打开一个页面就将一个页面压栈同时取一个名字。你按下返回键后就将这个页面弹栈。这样你就可以看到像原生一样的效果了。不会你  a 标签打开一个页面。关闭了。然后在打开又刷新了。（这也是appcan速度快的一个原因）

好了这里就产生了一个问题。你的页面弹栈以后，是不会消失的。那你怎么通知他刷新呢。appcan为了解决这个问题，提供了两种方式。

第一种 订阅式  非常重要的两个方法 

appcan.window.publish( id, msg)        第一参数是通道id （自己定）  第二个是通知的信息

appcan.window,subscribe(id,fun)      第一个参数是通道id （你想收到那个通知）  第二个 通知的回调函数 function（msg）

第二种 指定调用  在窗口模式中，我们有两种打开窗口的模式  

一种 appcan.window.open（name,页面name） 第一个参数你取的名字，第二个参数页面路径

补充：第一个面就是启动页面，名称叫做root 。  其他参数看官网的api 是一些打开页面的特效设置。

二种 appcan.frame.open (选择器，路径 ，距离左边，距离上边） 这个是打开一个悬浮窗口，这个窗口指定一个div 或者一个位置打开，同时这个位置的名称还是他的名称，建议使用id 

回到调用上  对于窗口   appcan.window.evaluateScript("friend","list()");  第一个参数 页面名称，第二个参数js 代码，可以调用指定页面你的方法。

                      对于悬浮窗口   appcan.window.evaluatePopoverScript("root", "content", "go()");   第一个参数页面名称， 第二个参数悬浮窗名称，第三个参数 js代码

        好了你会了这个，你就可以处理，用户登录后，让那个页面加载什么数据，只需要在那个页面写好方法调用，或者订阅模式都可以。

注：初学者会发现，appcan中 uexwindow 什么的每个官方的例子给的都不太一样。打开窗口的方式有很多。其实都是一种uexwindow 。其他什么jssdk中都是对uexwindow 的封装，yz等等都是封装。也就是所有jssdk都是对uex的封住哪个。 你随便会一个就行。但是uexwindow 在预览（appcan的ide调试用的）中可能不好使。 jssdk  中appcan.window这种，有时候好使，有时候不好使郁闷。

插件导语

系统的插件可以直接本地生成apk进行调试，或者使用它的调试工具进行调试，第三方的sdk只能在线打包进行调试，这里不说了全是泪，我会在环信插件的使用的时候的文章给出，解决办法。

下面给点福利， 我吧appcan的一些好的例子都收集了一下进行分享 ： 其中有美食app 、 会生活、环信使用demo 、官方demo 、hiappcan 、 appcanshow 等

地址如下 http://pan.baidu.com/s/1sltafCD