通过Intel XDK编写跨平台app(二)

通过Intel XDK编写跨平台app(一)

通过Intel XDK编写跨平台app(二)

在这个系列的上一篇文章中,我们大致了解了Interl XDK的概况。在这一部分中,我们会详细地介绍如何通过这个框架来构建app,这里我们会以一个简单的照片分享应用为例。

你可以在Github上找到这个例子的最终代码

对比一下几个框架

Intel XDK 支持几种不同的HTML5架构: App Framework, Bootstrap, TopCoat 和JQuery Mobile。 APP Designer同时也支持这些不同的框架。介初学者模式App Starter只支持App Framework。

App Framework 是 一个简单的前端框架,它的UI组件都只能用来构建这种类型的应用,而且它能通配各种手机操作系统。在IOS设备上,它看上去和IOS本地组件差不多,在 Android设备上,它看上去又和Android本地组件相似,在其它设备中也是这种情况。不仅如此,App framework是一个轻量级的框架, 速度也非常快。

JQuery mobile 是一个很经典的手机应用框架了。它已经有很多看的历史,是现如今为数不多的依然存活的框架。你可以在它的库中找到很多的组件,但是这个框架有个很多问题,它很慢,通配做的不好,而且看上去并不像本地应用。

TopCoat 它是个显为人知的框架。它其实并不是一个完整的框架,只是提供了完整的UI组件。

Bootstrap 它应用是最明星的一个框架了,它用来构建web页面和手机的响应式网站。我第一次使用它的时候真是有点惊讶,因为它毕竟不是一个混合式的应用开发框架。

现在开始编码吧!

让我们从创建一个项目开始,你可以通过点击左上方的”Start New Project“按钮来创建一个应用。然后选择“App Starter”创建方式来创建一个App Framework的工程。

下图是你创建项目的原型:

在css文件夹中创建一个style.css文件,然后创建一个app.js在js文件夹中。imageswhere文件夹用来存放图片资源。这个项目中我们不会使用任何第三方API,如果你在其它项目中需要使用,可以通过编辑项目来添加

。。。。

。。。。

原文来自:通过Intel XDK编写跨平台app(二)

时间: 2024-10-30 23:28:02

通过Intel XDK编写跨平台app(二)的相关文章

[Intel XDK]在线跨平台模拟器-代理服务器的设置解决方案

本次重构,需要注意: 1.代码的规范,详细的注释 主要集中 在方法和类的描叙 2.目录结构的合理,包名的设计 首先目录的设计: 1.activitiy的目录 (所有的界面) 2.serverice目录 (后台的服务) 3.通用的目录 (通用的方法与常量:譬如时间,字符串操作,定义常量) 4.数据库 目录 (sqlite的方法) 5.网络通信目录(上传数据与更新软件的) 6.文件目录(文件操作的目录) 7.参数配置目录 (配置xml的方法) 最终设计的结果: 文件目录与参赛配置,都放到tools中

[Intel XDK]在线跨平台模拟器-安装方法

Installation of the Intel? XDK on Apple* OS X* involves all or some of the following steps: Install the Google* Chrome* browser Update Java* on your Mac Download and Install the Intel XDK app Create an account with the Intel XDK (not described here)

用React Native编写跨平台APP

用React Native编写跨平台APP React Native 是一个编写iOS与Android平台实时.原生组件渲染的应用程序的框架.它基于React,Facebook的JavaScript的库,为的是构建用户接口,而并不是以浏览器为目标,它是以手机平台为目的. 换句话说,假设你是一个web开发人员,你能够使用React Native去编写干净.高速的移动APP,而且能够体会到熟悉的框架和单个的JavaScript的代码库. 在这之前,我们已经听到用诸如Cordova或者是Titaniu

[Intel XDK]基于AppMobi的XDK跨平台应用开发

使用AppMobi* XDK 的跨平台应用程式开发入门 跨平台应用程式开发意指仅编写一次程式,便可于多个平台上部署.应用程式开发者可善加利用倾向跨平台设计与开发的开发工具,使获利更丰.Android* 与iOS* 为目前应用程式开发者最看好的两大行动装置应用程式开发平台,两者在运作上的软体堆叠(stack) 架构和装置硬体效能等皆有所差异,使得应用程式的跨平台开发困难重重.HTML5 为可使跨平台应用程式开发更为轻松的一项技术,提供不同平台间的可移植性(portability). AppMobi

jquery Mobile应用第2课《构建跨平台APP:jQuery Mobile移动应用实战》连载二(简单的QWER键盘)

在jQuery Mobile的布局中,控件大多都是单独占据页面中的一行,按钮自然也不例外,但是仍然有一些方法能够让多个按钮组成一行,比如说在范例6-5中就利用按钮分组的方法使4个按钮并列在一行中,如图6-24和图6-25所示. 图6-24 实现按钮分组的方法 图6-25 分组的按钮 而在上一节中也许有读者已经注意到,头部栏中的按钮并没有占据一整行,也没有与多个按钮一起成组存在,那么在页面的其他部分是否也可以让按钮以这样的形式出现呢? [范例6-9 简单的QWER键盘] 01 <!DOCTYPE

带你从零学ReactNative开发跨平台App开发(二)

ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 上一篇教程我们一步步配置了开发RN的必备环境,这篇文章我们依然配置环境,昨天配置的是CRNA模式开发的环境,我们今天配置原生混合开发环境. 第一次写系列教程,写的不好,多多担待,有错误欢迎评判指正. 说一下这个系列教程的目标吧,实战一个CRNA模式开发的跨平台App打包并发布,并将这个App用原生混合开模式实现并打包发布. 废话不多说开始撸码,你准备好了吗? 环境配置 配置原生混合模式开发的环

小白学phoneGap《构建跨平台APP:phoneGap移动应用实战》连载二(生命周期)

4.1 什么是生命周期 想要真正地理解PhoneGap应用开发的内涵,首先需要理解什么是生命周期.这在字面上其实非常容易理解,一个应用从开始运行被手机加载到应用被退出之间的过程就称之为一个生命周期.为了使读者更容易理解,本节将以Android原生SDK中Activity类的生命周期结合Eclipse中的LogCat调试工具进行实战讲解. 4.1.1  Activity的生命周期 先仔细的观察图4-1的内容,这是谷歌官方给出的Activity生命周期流程图,它包括了一个安卓应用从被创建到结束时所经

用Xamarin和Visual Studio编写iOS App

一说开发 iOS app,你立马就会想到苹果的开发语言 Objective C/Swift 和 Xcode.但是,这并不是唯一的选择,我们完全可以使用别的语言和框架. 一种主流的替换方案是 Xamarin,这是一个跨平台框架,允许你开发 iOS.Android 和 OSX.Windows app,它使用的是 C# 和 Visual Studio.最大的好处在于,Xamarin 允许你在 iOS 和 Android app 间共享代码. Xamarin 与其他跨平台框架相比有一个最大的好处:使用

Sublime插件库新成员基于APICloud快速开发跨平台App

互联网时代强调用户体验,那什么是HTML5跨平台App开发者的编程体验?"不剥夺.不替换开发者喜欢的开发工具,就是人性化的用户体验",APICloud给出了这样的答案! 重磅发布"多开发工具支持策略" "如果,你以为此次分享会APICloud只是讲解Eclipse开源插件代码经验,那就大错特错了!"APICloud CEO刘鑫以调侃的话进行了开场. 经过一年的上线摸索,APICloud团队充分的认识到"剥夺开发者已经习惯的开发工具,替换