Dreamweaver CS6配置Phonegap运行环境介绍

  在这里我也顺便介绍一下Phonegap(这个是我自己对Phonegap的理解,因为没有深入研究,如有错误请之指出),因为这玩意是我们做网站APP用的关键东西,因为你不可能每次写好一个样式,然后弄到手机上去看啊,那太麻烦了,所以Phonegap就为我们提供了一个模拟平台,它可以帮你在PC机上模拟出安卓系统,当然,首先你要安装一个Android SDK,你可以下载:installer_r21-windows.exe,建议下载这个,因为官网下载Android SDK我不会用,,,,installer_r21-windows.exe这个里面有一个下载工具可以下载到不同版本的SDK



我在这个里面安装的4.2,4.0,2.3.3版本的,因为这三个都是比较主流的

OK,还要准备Dreamweaver CS6,这个是必须的,破解的话,百度之,很多破解方案。

下载就开始配置运行环境:

首先安装好CS6后,咱们就来点击菜单栏上的“站点”,如图:



然后选择 Phonegap Build服务,如图:




点击Phonegap Build 配置后,会弹出下图:



这个时候我们之前安装的Android SDK 就起作用了,亲,看,第一个框上面写的就是Android SDK 位置,也就是你刚才安装Android SDK的目录,我安装在D:Program Filesandroidandroid-sdk里面的,我想你们也应该是的,因为没人会在自己电脑上把这些玩意安装到C盘,所以我对网上一些环境配置教程其实很愤怒...都是安装到C盘,有些新手刚开始的时候不知道怎么操作,然后跟着安装到C盘了...然后...电脑就经常运行死机,你们懂的...当然,我不懂那些高手的想法...我是按照新手的路数在写这个图文教程。最后废话一句:我很喜欢图文教程,因为视频我会看着看着就睡着了....全部都是文字我又看不下去,所以,以后如果有机会我会写更多的图文教程,不过对于这个我不敢保证时间。骚瑞啦,亲们...

然后这个时候把目录保存好,这个时候我对Adobe这个公司有意见了,你说保存的时候总该有点提示吧,他这个保存一点提示都没有...来点验证也行啊,靠,我开始弄的时候我以为出问题了才没提示的,后来发现尼玛,原来没有问题才没有提示,不过如果有错的话,错误会在上面显示的

保存好了之后就要开始新建站点了,先把站点建完,我等会再说怎么让页面在模拟器中显示




选择新建站点,然后:



站点名称你们自己选择,还有本地站点文件夹自己来选择啊,不要随便弄一个啊,你会忘记目录的,下面的 本地站点文件夹你可以把中间的未命名站点2改成自己想取的名字就OK了,DW会自动的生成一个文件夹的

新建完了之后呢,就要新建文档了:



文件-->新建



在这里的话按照我图上的选择,不过在中间的示例页选择中只要不选择CDN就OK了,其它的两个说实话...我没研究区别...然后点击创建,这个时候呢,DW会自动生成一个HTML文件,不要以为这样就成功了....在这个时候,你按ctrl+s把这个页面会自动的保存到你的站点目录下面,这个时候要把文件名改成index.html,因为模拟器貌似只认index.html...有优先级选择的



然后会自动的弹出一个窗口,复制相关文件,选择复制



然后这个站点就建立完毕了...亲,把你的视线移到右下角,你会发现这个:



我的站点名是mob,目录是F:mob

这个时候呢,你会看到这个窗口:




不过气馁,亲,DW是一个神奇的软件

抬起头,看看上面,在代码,拆分,设计旁边有一个实时视图,点击鼠标邮件,你会看到一个非常让你有成就感的页面:




和手机上的效果差不多吧?如果觉得效果简单..那就需要你自己来写代码了,在这里我想说一下,不要指望傻瓜式软件,如果有傻瓜式的软件,那你做前端的人靠什么吃饭呢?傻瓜都能做网站,傻瓜都能做网站APP,傻瓜都能做应用,那你吃什么?那你对谁吹牛逼?技术屌丝就是靠技术来接近女神的,如果女神都能自己做了,那屌丝靠什么逆袭高富帅?我这个技术屌丝就是在大学靠装系统钓上了现在老婆。所以,屌丝们,努力点,女神在前面等待你...或许你牛逼了,女神就是女神经病了...

说明一下,DW怎么就能展示这样的效果呢?主要是因为DW在自己的身体中加上了WebKit,DW也喜欢加技能...


如果你觉得这样看没意思,你可以选择,选择浏览器来展示这个页面的效果,最好是谷歌,IE神马的就算了...

这个时候你心里面肯定在想:这样就完了啊?那 Phonegap 呢?我没看到它出来啊。
不要紧,亲,马上就来了...

现在我们要重新点击“站点了”:




看着上图的选项来选择Phonegap服务

点击后会弹出一个窗口:




在这里你可能会选择注册,但是我测试了一个早上...我发现有问题,当你点击注册之后会跳转到Adobe的官网,然后你会注册帐号,这个时候你就做错了,正确的做法是:在安装DWCS6的时候你用一个邮箱和密码注册了一个AdobeID来选择试用或者是安装Dreamweaver CS6,在这里,你选择要使用这个邮箱和密码来登录。

上面的过程我想肯定会有人开始纠结了...因为忘记了.... ,这个我也木有办法了啊,亲,努力试试啊...

登录有点慢,稍微等一下就好了

登录成功后这个时候会跳到一个界面:



选择继续

点击继续后,会弹出



注意,不要以为一开始就是绿色的,点击继续后本身是想IOS那样是灰色的,然后点击重新生成应用程序后,然后等待一下,这里是看网速的,然后就慢慢加载完后就变成绿色的了

然后点击一下安卓的那个绿色的向右的箭头,这里要注意,因为我安装的是安卓的SDK,所以点击安卓,如果你安装的别的SDK,你就要选择别的

点击之后就弹出这个窗口




在这里的时候你就要选择你之前下载的安卓版本了,我的是4.2的,选择完后就点击创建AVD,看到下面的内容框中加载完后,点击启动



又在加载...



稍等一下,就会弹出模拟器




每一个

到这里的时候比较慢,要稍等大概5分钟左右,不要心急,心动就在后面



OK,加载完毕,现在可以用鼠标操作这个手机了,

开始是英文版的,你可以在里面改成中文版的



如果你想在这个手机看到你做的页面的效果,就要点击这个图标



OK,结束,这些都是我的操作,中间可能会有很多问题,如果有问题的话,欢迎沟通,交流.

posted @ 2013-06-08 11:34  zhepama  阅读(867)  评论(0编辑  收藏  举报