JavaScript使用DeviceOne开发实战(一) 配置和起步


Posted in Javascript onDecember 01, 2015

2015 年 9 月 底,DeviceOne Release发布。至此,DeviceOne 基本完成了对多端的支持。基于 DeviceOne 可以:

HTML5、Android、iOS、Windows 多端代码一次编写,各处复用;

实时简单部署。

本地化UI

在接下来的时间,我会通过一系列文章来介绍 DeviceOne。本文介绍环境配置以及如何建立一个简单的项目。(注:本篇文章 iOS 和 Android和Windows 开发都适用。)

目前使用 DeviceOne 开发可以在Windows 或者 Mac 系统进行。

下面介绍下DeviceOne环境搭建,不管是应用开发还是组件开发,都需要搭建开发环境,只需要3分钟就可以完成。

1. 硬件环境

PC电脑或MAC电脑一台用于开发
移动设备一台用于调试和测试,手机或pad都可以(android、ios、windowsphone都可以),Android还可以尝试模拟器。

2. 软件环境

操作系统(MAC或Windows都支持)
Windows: 7 以上操作系统。
MAC:10.9 以上

移动设备:

Android : 4.0以上操作系统
IOS : 7.0 以上操作系统
WinPhone :8.1 以上操作系统

JDK:1.7版本及以上

3. 网络环境

外网环境:很多功能都需要有外网才能进行,App的开发和调试可以离线进行。

4. 注册DeviceOne开发者账户

要想使用DeviceOne开发应用,首先需要在www.deviceone.net上注册一个自己的开发者账号,注册的地址是 注册

5. 下载设计器(IDE)

用户需要下载和使用DeviceOne提供的设计器(IDE)来开发移动应用,设计器提供所见即所得的方式来构建UI,提供代码编辑器来编写标准的javascript或lua的逻辑脚本代码,使用设计器提供的即时调试功能和真机移动设备互动调试应用,最后通过设计器提供的打包功能来发布最终应用。

设计器目前包含2个大的版本,一个是基于Eclipse RCP的版本,一个是自己开发的只支持Windows的版本。我们推荐大家使用基于Eclipse的版本。

下载地址是http://docs.deviceone.net/ 平台—>下载中心

JavaScript使用DeviceOne开发实战(一) 配置和起步

安装设计器,直接找到刚才下载好的zip文件。解压到您相应的位置。本设计器是免安装绿色版,Windows的版本直接到解压好的文件路径下找到DoStudio.exe,双击打开。Mac版本解压后直接双击dostuio.app就可以启动。在启动的过程中可能会碰到一些问题,可以参考新版设计安装和启动问题整理

JavaScript使用DeviceOne开发实战(一) 配置和起步JavaScript使用DeviceOne开发实战(一) 配置和起步

开发环境搭建完成后,我们开始尝试开发第一个DeviceOne移动应用,下面一步步介绍一下Hello DeviceOne应用的构建方法

1. 新建应用

首先打开设计器,点击新建项目,新建项目需要联网,输入用户密码验证码后登陆。但是创建完之后是支持离线开发和调试的。

JavaScript使用DeviceOne开发实战(一) 配置和起步JavaScript使用DeviceOne开发实战(一) 配置和起步

在弹出的对话框中填写新建项目的名称并选择编写程序想要使用的前端脚本语言,目前可以选择JavaScript和Lua两种,还可以配置基本项目模板,包含空页面模板,带listview的模板等等,还可以配置屏幕分辨率,都配置好后点击确定按钮,会自动生成一个工程项目

JavaScript使用DeviceOne开发实战(一) 配置和起步

我们可以看到设计器主页面如下图,我们可以在设计器里左侧工程导航区树上看到所有代码,其中app.js是整个程序的入口,类似于其它开发语言的main函数。更多的文件结构介绍请参考“DeviceOne应用结构”文档。设计器的详细说明可以参考“设计器使用指南”文档。

JavaScript使用DeviceOne开发实战(一) 配置和起步

我们可以尝试在“控件列表”里拖拽一个Label组件到index.ui文件对应的“视图设计”,设置Label的背景颜色为绿色。视图设计可以所见即所得的拖拽和设置一个界面元素的基本属性和专有属性。

JavaScript使用DeviceOne开发实战(一) 配置和起步

我们再修改一下index.ui.js源代码,把Hello World改成Hello DeviceOne。在js文件里可以修改应用运行的逻辑。

JavaScript使用DeviceOne开发实战(一) 配置和起步

以上所述就是本文给大家介绍的JavaScript使用DeviceOne开发实战(一) 配置和起步的全部内容,希望大家喜欢。下篇文章给大家介绍JavaScript使用DeviceOne开发实战(二) 生成调试安装包,请各位朋友继续关注,喜欢的朋友直接点击了解详情。

Javascript 相关文章推荐
js几个验证函数代码
Mar 25 Javascript
jquery中获得$.ajax()事件返回的值并添加事件的方法
Apr 15 Javascript
javascript中使用css需要注意的地方小结
Sep 01 Javascript
node.js中的fs.createWriteStream方法使用说明
Dec 17 Javascript
jQuery中empty()方法用法实例
Jan 16 Javascript
全面解析Bootstrap排版使用方法(文字样式)
Nov 30 Javascript
关于JavaScript限制字数的输入框的那些事
Aug 14 Javascript
js原生之焦点图转换加定时器实例
Dec 12 Javascript
JavaScript使用FileReader实现图片上传预览效果
Mar 27 Javascript
9种使用Chrome Firefox 自带调试工具调试javascript技巧
Dec 22 Javascript
微信小程序购物车、父子组件传值及calc的注意事项总结
Nov 14 Javascript
如何手动实现一个 JavaScript 模块执行器
Oct 16 Javascript
快速学习jQuery插件 Form表单插件使用方法
Dec 01 #Javascript
jQuery学习笔记之Ajax用法实例详解
Dec 01 #Javascript
易操作的jQuery表单提示插件
Dec 01 #Javascript
JavaScript保留关键字汇总
Dec 01 #Javascript
轻松学习jQuery插件EasyUI EasyUI表单验证
Dec 01 #Javascript
整理Javascript函数学习笔记
Dec 01 #Javascript
全面解析Bootstrap弹窗的实现方法
Dec 01 #Javascript
You might like
Windows下PHP5和Apache的安装与配置
2006/09/05 PHP
php GUID生成函数和类
2014/03/10 PHP
PHP的Laravel框架中使用AdminLTE模板来编写网站后台界面
2016/03/21 PHP
PHP判断访客是否手机端(移动端浏览器)访问的方法总结【4种方法】
2019/03/27 PHP
Laravel框架自定义公共函数的引入操作示例
2019/04/16 PHP
JavaScript 利用StringBuffer类提升+=拼接字符串效率
2009/11/24 Javascript
强大的jquery插件jqeuryUI做网页对话框效果!简单
2011/04/14 Javascript
JavaScript中双叹号(!!)作用示例介绍
2014/04/10 Javascript
JS使用正则表达式除去字符串中重复字符的方法
2015/11/05 Javascript
基于jQuery实现音乐播放试听列表
2016/04/14 Javascript
基于jQuery制作小图标上下滑动特效
2017/01/18 Javascript
Javascript for in的缺陷总结
2017/02/03 Javascript
Angular.js组件之input mask对input输入进行格式化详解
2017/07/10 Javascript
Vue 实现列表动态添加和删除的两种方法小结
2018/09/07 Javascript
vue 点击按钮实现动态挂载子组件的方法
2018/09/07 Javascript
详解vue 项目白屏解决方案
2018/10/31 Javascript
详解微信小程序文件下载--视频和图片
2019/04/24 Javascript
js+HTML5 canvas 实现简单的加载条(进度条)功能示例
2019/07/16 Javascript
解决vue-cli@3.xx安装不成功的问题及搭建ts-vue项目
2020/02/09 Javascript
[59:35]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#1COL VS Alliance第二局
2016/03/04 DOTA
[01:03:51]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第三场
2018/04/09 DOTA
Python基本数据类型详细介绍
2014/03/11 Python
Python实现windows下模拟按键和鼠标点击的方法
2015/03/13 Python
Python实现批量读取word中表格信息的方法
2015/07/30 Python
Python selenium爬取微博数据代码实例
2020/05/22 Python
简单了解Django项目应用创建过程
2020/07/06 Python
jupyter 添加不同内核的操作
2021/02/06 Python
python的scipy.stats模块中正态分布常用函数总结
2021/02/19 Python
G-Form护具官方网站:美国运动保护装备
2019/09/04 全球购物
莫斯科珠宝厂官方网站:Miuz
2020/09/19 全球购物
证券期货行业个人的自我评价
2013/12/26 职场文书
酒店保安领班职务说明书
2014/03/04 职场文书
高三上学期学习自我评价
2014/04/23 职场文书
2014年综治宣传月活动总结
2014/04/28 职场文书
民主评议党员工作总结
2014/10/20 职场文书
音乐之声观后感
2015/06/04 职场文书