理解使用 JavaScript 构建 Metro 应用

从 Windows 7 升级到 Windows 8 Consumer Preview 后,会导致 Microsoft Visual Studio 11 Express Beta for Windows 8 无法申请开发者证书。

Upgrade from Windows 7 can cause the “We couldn’t get your developer license” error 

解决方法在这里:http://t.cn/zOVOlmS 其实就是重装

 

这里是中文教程

使用 JavaScript 创建你的第一个 Metro 风格应用:http://msdn.microsoft.com/zh-cn/library/windows/apps/br211385

 

每个 HTML 都需要引用 WinJS和样式

<link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet">
<script src="//Microsoft.WinJS.0.6/js/base.js"></script>
<script src="//Microsoft.WinJS.0.6/js/ui.js"></script>

适用于 Metro 风格应用的 JavaScript 项目模板

http://msdn.microsoft.com/zh-cn/library/windows/apps/hh758331.aspx

 

default.html  该文件最先加载,并为内容主体(其中每个页面都加载进主窗体)提供标记。

default.css 为内容主体页面和应用整体指定 CSS 样式

default.js 指定当启动应用时的应用的行为

// For an introduction to the Split template, see the following documentation:
// http://go.microsoft.com/fwlink/?LinkID=232447
(function () {
    "use strict";

    var app = WinJS.Application;

    app.onactivated = function (eventObject) {
        if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
            if (eventObject.detail.previousExecutionState !== Windows.ApplicationModel.Activation.ApplicationExecutionState.terminated) {
                // TODO: This application has been newly launched. Initialize 
                // your application here.
            } else {
                // TODO: This application has been reactivated from suspension. 
                // Restore application state here.
            }
            WinJS.UI.processAll();
        }
    };

    app.oncheckpoint = function (eventObject) {
        // TODO: This application is about to be suspended. Save any state
        // that needs to persist across suspensions here. You might use the 
        // WinJS.Application.sessionState object, which is automatically
        // saved and restored across suspension. If you need to complete an
        // asynchronous operation before your application is suspended, call
        // eventObject.setPromise(). 
    };

    app.start();
})();

  

Metro应用的生命周期

应用的生命周期在应用启动时开始,并在应用关闭时结束。项目模板包还一个用于管理应用生命周期的通用模式。

 

default.html文件被设置为每个模板的起始页面。default.html对应的JavaScript文件包含以下对WinJS.Application.start的调用,该调用会启动应用事件的分发。

 

http://www.infoq.com/cn/news/2009/12/ecmascript5

严格模式的引入,目的在于避免ECMAScript应用中通常的代码问题。这是通过在单元(脚本或函数)上指定一句话来达到的:

"use strict;"
这句话不会对已有的运行时产生什么影响,但版本是5的新运行时就会为整个脚本(如果这句话定义在脚本开头)或者单个函数(如果定义在函数的开头)打开严格模式。这样就允许计划中的既有代码对严格模式和非严格模式的混合使用。那么,严格模式意味着什么呢?

变量在使用前必须声明。换句话说,i=3这下就是个运行时错误了;需要var i=3(如果i在做作用域里面没有定义过)
eval变成保留字,而从eval引入的新变量不再有效,因此eval("var i=3"); print(i);现在会抛出错误。
不再使用八进制;所以010就是十,不再是八。
如果configurable被设置成false,delete就不能使用在参数、函数、变量或者其他属性上。
一般会带来错误的with语句,将不再使用,会被认为是语法错误。
函数不再能使用具有相同名称的重复参数。
对象不再能使用具有相同名称的重复属性。
arguments和caller变量不再可变。
对全局对象的访问将会是运行时错误。

 

右侧博客园的文章一直不能正常显示,一直在找代码的原因,纠结了好久。

toStaticHTML的方法,<a>标签中有target="_blank"会被替换掉。

再一个就是无法显示的图像也会导致无法正常显示文章,用下面的正则替换掉后即可。

staticContent = staticContent.replace(/<img src=.*aggbug.*>/, ''); 

 

posted @ 2012-03-11 17:00 leavingme 阅读(...) 评论(...) 编辑 收藏