cent os 火狐_Firefox OS应用程序入门
cent os 火狐
欢迎使用Firefox OS应用开发教程。 在深入研究主题之前,我将重点介绍关于FireFox OS的存在以及为什么Web开发人员必须考虑为此OS开发应用程序的几点。
什么是FireFox OS?
FireFox OS是一种移动操作系统,它是Mozilla的“ Boot to Gecko”项目的结果。 毫无疑问,它基于Linux内核和Firefox的Gecko渲染引擎。 该操作系统是完全开源的,因此不属于专有权利的束缚。 FireFox OS的用户界面是一个具有内置功能的Web应用程序,可以启动和显示各种其他Web应用程序。 与移动操作系统领域的其他巨头(例如Android,iOS)不同,它瞄准的是新兴市场。 它还旨在为终端用户提供低价智能手机的优越功能。
为什么要为FireFox OS构建应用程序?
我们必须首先了解的是,FireFox OS通过使Web开发人员与设备的本机功能紧密交互来赋予其真正的力量。 这意味着开发Firefox应用程序所需的全部就是Web技术,例如HTML和JavaScript。 开发人员可以使用的强大API通过大量使用设备来轻松创建强大的应用程序。
现在,我们了解了有关此OS的应用程序的更多信息,让我们了解Firefox OS应用程序的类型。
包装形式:
这些应用程序基本上是.zip存档文件,其中包含应用程序使用的资源(例如HTML,CSS和JavaScript文件)。 用户将必须像其他任何移动OS应用程序一样下载并安装它。 开发人员可以通过Firefox市场将更新推送给用户。 也可以自行更新应用程序。
托管:
托管应用程序主要从服务器运行,就像具有给定域名的网站一样。 该应用程序的所有文件都托管在服务器上。 由于应用程序资源位于服务器上,因此开发人员可以更好地控制托管的应用程序。
在本教程中,我们将逐步开发一个打包的应用程序,该应用程序将列出用户的待办事项。
Modus Operandi将为FireFox OS开发应用程序
1.开发环境设置
每个Firefox OS应用程序(打包或托管)都需要在项目的根目录中有一个名为manifest.webapp
强制性文件。 这是一个JSON文件,可向操作系统提供有关该应用程序的信息(例如名称,描述,作者,图标等)。 在本教程中,我们将使用以下简单的manifest.webapp
。
{
"version": 1.0,
"name": "ToDo App",
"description": "App to make a note of to-do tasks",
"launch_path": "/index.html",
"developer": {
"name": "Preetish",
"url": "http://Preetish.Me"
},
"icons": {
"512": "/img/icon-512.png",
"128": "/img/icon-128.png"
},
"default_locale": "en"
}
要了解有关清单文件的更多信息,可以查看文档 。 清单文件可以由清单验证器验证 。 API也可以用于验证。
在我们的项目根目录中,创建manifest.webapp
文件以及以下目录:
css
js
lib
img
最后,您需要安装Firefox OS仿真器以完全设置开发环境。 安装后,可以从Firefox浏览器菜单的“开发人员”部分访问模拟器。
模拟器启动后,您将看到Firefox OS屏幕,如下图所示。
2. Web API和Web活动
通过网络技术访问移动设备功能始终是一个压倒性的问题。 Mozilla通过提供访问权限来管理和控制设备功能(例如联系人,电源管理,摄像头,FM,蓝牙硬件等),提供了广泛JavaScript API来解决此问题。这些功能称为WebAPI ,作为开发人员,您必须检查他们在Mozilla开发人员网络上发布。
对于网络活动,应用程序执行的操作是通过从一个应用程序到另一应用程序的一系列任务分配来完成的。 例如,如果应用程序需要打开PDF文件,它将要求用户选择他或她已经用于打开PDF文件的应用程序。 打开特定文件后,它将返回给调用方或源应用程序。
有关更多信息,您可以参考MDN上的Web活动参考和Mozilla Hacks上的Web活动简介 。
3.编写示例应用
免费学习PHP!
全面介绍PHP和MySQL,从而实现服务器端编程的飞跃。
原价$ 11.95 您的完全免费
免费获得这本书
我们将使用AngularJS开发此待办事项应用程序。 下载Angular源并将其复制到我们项目的lib
目录中。 接下来,在根目录中创建index.html
。 将以下代码复制到文件中。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Todo List App</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
</head>
<body>
<div ng-app="todoApp">
<h2>Todo</h2>
<div ng-controller="TodoController">
<span>{{remaining()}} of {{todos.length}} remaining</span>
[ <a href="" ng-click="archive()">archive</a> ]
<ul class="unstyled">
<li ng-repeat="todo in todos">
<input type="checkbox" ng-model="todo.done">
<span class="done-{{todo.done}}">{{todo.text}}</span>
</li>
</ul>
<form ng-submit="addTodo()">
<input type="text" ng-model="todoText" size="30"
placeholder="add new todo here">
<input class="btn-primary" type="submit" value="add">
</form>
</div>
</div>
<script type="text/javascript" src="lib/angular.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
接下来,在css
目录中创建style.css
并复制以下代码:
.done-true {
text-decoration: line-through;
color: grey;
}
接下来,在js
目录中创建app.js
并复制以下代码。
angular.module('todoApp', [])
.controller('TodoController', ['$scope', function($scope) {
$scope.todos = [
{text:'Todo Item 1', done:true},
{text:'Todo Item 2', done:false}];
$scope.addTodo = function() {
$scope.todos.push({text:$scope.todoText, done:false});
$scope.todoText = '';
};
$scope.remaining = function() {
var count = 0;
angular.forEach($scope.todos, function(todo) {
count += todo.done ? 0 : 1;
});
return count;
};
$scope.archive = function() {
var oldTodos = $scope.todos;
$scope.todos = [];
angular.forEach(oldTodos, function(todo) {
if (!todo.done) $scope.todos.push(todo);
});
};
}]);
4.测试应用
为了测试我们的应用程序,我们将使用Firefox OS模拟器 。 在Firefox中,转到“工具”>“开发人员”>“ FireFox OS仿真器”。 接下来,单击“添加目录”按钮并导航到manifest.webapp
文件以进行加载。
如果一切操作正确,您应该可以在笔记本电脑/台式机上直接看到模拟的应用程序。 您可能需要在屏幕上滚动才能访问该应用程序。
单击屏幕上显示的应用程序以访问您的应用程序。
完成该应用程序后,创建整个根目录文件的.zip存档,并使用验证器对其进行完整的测试。
查看WebIDE测试工具,该工具可让您通过USB将桌面Firefox连接到兼容设备。 此外,它使您可以将应用程序直接推送到设备并在它们运行时对其进行调试。
5.发布应用
分发Firefox OS应用程序非常容易。 它可以作为自发布的应用程序托管在您自己的服务器上。 但是,为了获得更大的覆盖范围和可见性,可以将其推向Firefox市场 。 清单文件通过验证后,即可提交有关该应用程序的其他信息(例如操作系统支持,价格,屏幕截图)。 用户将能够购买您的应用程序,对其进行评分并提供反馈。
结论
本教程向您展示了如何创建一个简单的Firefox OS应用程序。 GitHub上也提供了本文介绍的演示应用程序的代码。 随时检查,修改它,并可能使用它来启动下一个Firefox应用程序。 请享用!
翻译自: https://www.sitepoint.com/firefox-os-application-primer/
cent os 火狐
cent os 火狐_Firefox OS应用程序入门相关推荐
- cent os 火狐_本周关注我们:整体框架和Firefox OS
cent os 火狐 Welcome to On Our Radar, a weekly round-up of news, trends and other cool stuff from the ...
- Firefox OS应用程序入门
欢迎使用Firefox OS应用开发教程. 在深入研究主题之前,我将重点介绍关于FireFox OS的存在以及为什么Web开发人员必须考虑为此OS开发应用程序的几点. 什么是FireFox OS? F ...
- 什么是Nib文件?(Nib文件是一种特殊类型的资源文件,它用于保存iPhone OS或Mac OS X应用程序的用户接口)...
Nib文件是一种特殊类型的资源文件,它用于保存iPhone OS或Mac OS X应用程序的用户接口.Nib文件是Interface Builder文档.通常您会使用Interface Builder ...
- elf section类型_在 498 行极小 OS 上跑标准 ELF 程序
本文首发于 在 498 行极小系统跑标准 ELF 程序 简介 ELF 在 Linux 系统中作为标准可执行文件格式已经存在了 ~25 年. 如果要在 Linux 下直接研究 ELF,通常很难绕过 Li ...
- Python读写文件的路径,关于os.chdir(path)位置对程序的影响,
关于os.chdir(path)位置对程序的影响,import os import time#直接把path放到open()里面 def fu0():star = time.time()for i i ...
- python标准库os.path中_Python零基础入门学习19:常用标准库之os.path子库
注:本文所有代码均经过Python 3.7实际运行检验,保证其严谨性. 本文阅读时间约为3~5分钟. os库是Python标准库,包含几百个函数.它能处理与系统相关的常用路径操作.进程管理.环境参数等 ...
- 关于os.popen函数打开exe程序无法正确运行的问题。
都说野生的动物好,但是放在程序猿身上,我觉得更是一种无奈.没有人指引,没有人教导,有的只是一颗探索,学习的心.这颗心让我们披荆斩棘.最终看到我们想要的成果.从一句简单的print('hello wor ...
- 不能验证这个“安装 OS X EI Capitan”应用程序副本解决方法(已修正)
不能验证这个"安装 OS X EI Capitan"应用程序副本解决方法 最近黑苹果乐园制作的OS X EI Capitan 10.11.3自带Clover USB安装镜像,经过黑 ...
- 【DRF+Django】微信小程序入门到实战_day04(上)
(0)摘要 # 课程链接 入门到实战,讲讲公司的微信小程序[django+drf+小程序实战]_哔哩哔哩_bilibili # 微信开发者文档 微信开放文档 # 课程内容 (1)P28_用户登录页面 ...
最新文章
- 网友:Java岗,自学一个月跳槽计算机视觉!附学习资源合集
- 论文《城市大脑的定义与建设规范探讨》在IEEE(ICBAIE)发表
- poj4051Chess:搜索
- bootstrap-table页码ALL显示为NAN
- 微信小程序将页面按钮悬浮固定在底部
- 射频MOS管和三极管优缺点对比
- HTTPS-思君如满月,日日减清辉
- Trinotate-转录组注释
- 81个关键点,帮你紧密追踪女神的脸,比Dlib还多了13点 | 有代码
- 【实验】简单实时300点采样逻辑
- 黑马学习之全平台听歌神器
- call function中的 exporting/importing/changing
- python国际象棋小游戏代码_用Python编写一个国际象棋AI程序
- 硬回车、软回车、java转义字符
- 洛谷P4158 [SCOI2009]粉刷匠 题解
- python在excel应用实例视频-超简单:用Python让Excel飞起
- iPhone 12手机真实信号强度查看方法教程
- cocos2dx3.x的TableView使用
- csol怎么设置屏蔽服务器信息,CSO常用技巧之控制台参数修改
- java如何打开word文档_如何在Java中打开和操作Word文档/模板?