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 相关文章推荐
论坛特效代码收集(落伍转发-不错)
Dec 02 Javascript
Prototype使用指南之selector.js说明
Oct 26 Javascript
JQuery获取各种宽度、高度(format函数)实例
Mar 04 Javascript
jQuery判断iframe中元素是否存在的方法
May 11 Javascript
ion content 滚动到底部会遮住一部分视图的快速解决方法
Sep 06 Javascript
原生js实现水平方向无缝滚动
Jan 10 Javascript
理解Koa2中的async&await的用法
Feb 05 Javascript
JS实现为动态创建的元素添加事件操作示例
Mar 17 Javascript
新手必须知的Node.js 4个JavaScript基本概念
Sep 16 Javascript
详解JavaScript中的坐标和距离
May 27 Javascript
JS中的变量作用域(console版)
Jul 18 Javascript
vue自定义插件封装,实现简易的elementUi的Message和MessageBox的示例
Nov 20 Vue.js
快速学习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
在线竞拍系统的PHP实现框架(一)
2006/10/09 PHP
关于php fread()使用技巧
2010/01/22 PHP
PHP缓存机制Output Control详解
2014/07/14 PHP
php显示时间常用方法小结
2015/06/05 PHP
php中替换字符串函数strtr()和str_repalce()的用法与区别
2016/11/25 PHP
用JavaScript隐藏控件的方法
2009/09/21 Javascript
JS DOM 操作实现代码
2010/08/01 Javascript
js注意img图片的onerror事件的分析
2011/01/01 Javascript
jQuery Jcrop插件实现图片选取功能
2011/11/23 Javascript
使用Grunt.js管理你项目的应用说明
2013/04/24 Javascript
js身份证判断方法支持15位和18位
2014/03/18 Javascript
jqeury-easyui-layout问题解决方法
2014/03/24 Javascript
使用insertAfter()方法在现有元素后添加一个新元素
2014/05/28 Javascript
小结Node.js中非阻塞IO和事件循环
2014/09/18 Javascript
javascript在当前窗口关闭前检测窗口是否关闭
2014/09/29 Javascript
详解AngularJS如何实现跨域请求
2016/08/22 Javascript
bootstrapValidator自定验证方法写法
2016/12/01 Javascript
layer.close()关闭进度条和Iframe窗的方法
2018/08/17 Javascript
vue.js引入外部CSS样式和外部JS文件的方法
2019/01/06 Javascript
js中数组常用方法总结(推荐)
2019/04/09 Javascript
JavaScript 扩展运算符用法实例小结【基于ES6】
2019/06/17 Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
2020/04/20 Javascript
使用python调用浏览器并打开一个网址的例子
2014/06/05 Python
详解Python对JSON中的特殊类型进行Encoder
2019/07/15 Python
Django 开发调试工具 Django-debug-toolbar使用详解
2019/07/23 Python
Python使用psutil获取进程信息的例子
2019/12/17 Python
三八红旗手先进事迹材料
2014/05/13 职场文书
给校长的建议书500字
2014/05/15 职场文书
最新离婚协议书范本
2014/08/19 职场文书
自愿离婚协议书2015
2015/01/26 职场文书
爱国主义教育基地观后感
2015/06/18 职场文书
父亲去世追悼词
2015/06/23 职场文书
2019年中,最受大众欢迎的6本新书
2019/08/07 职场文书
php TP5框架生成二维码链接
2021/04/01 PHP
深入浅出讲解Java8函数式编程
2022/01/18 Java/Android
python 安全地删除列表元素的方法
2022/03/16 Python