Windows 8 Consumer Preview版升级到 Release Preview 版后Metro应用(html5+JavaScript版)修改小结

　　Win8出来时参加了一个活动，写了一个APP，后来微软那边没什么动静了，就一直没怎么管了，最近系统升级从Consumer Preview版升级到 Release Preview 版，VS也升级到 Visual Studio 2012 RC 后，才发现原来的APP不能运行了，于是折腾了好一阵子才OK，现在做个小结，希望可以帮到遇到相同问题的朋友。

一、WinJS版本修改

　　Windows 8 Consumer Preview版中WinJS是0.6版，Release Preview 版中WinJS是1.0版，所以要把项目中的WinJS进行升级。

　　这个比较简单，大家直接按官方给出的步骤做就OK了：http://msdn.microsoft.com/en-us/library/windows/apps/JJ126963.aspx

　　极少数情况下你的VS2012中没有1.0版的WinJS：

　　遇到这种情况说明你的VS没有装好，修复安装就OK了。

二、满屏，半屏，还有小屏的页面状态方法的修改

　　这个地方我遇到的症状就是程序闪一下就没了，不能打开。

　　解决方案就是把 navigator.js 中的：

appView.getForCurrentView().onviewstatechanged = this._viewstatechanged.bind(this);

　　改为：

window.onresize = this._viewstatechanged.bind(this);

　　上面的方案来自：http://social.msdn.microsoft.com/Forums/et-EE/winappswithhtml5/thread/d02bf608-675d-4676-a4ec-3ccbc64671f1

　　但仅仅改这一个地方是不完美的，因为这个文件里还有与这个相关的代码。所以还要把这行代码稍后的：

_viewstatechanged: function (eventObject) {
     (this._updateLayout.bind(this.pageControl))(this.pageElement, eventObject.viewState);
},

　　改为(或直接添加下面这段代码也可以)：

_resized: function (args) {
      if (this.pageControl && this.pageControl.updateLayout) {
          this.pageControl.updateLayout.call(this.pageControl,             
          this.pageElement, appView.value, this.lastViewstate);
      }
      this.lastViewstate = appView.value;
},

三、Share功能代码的修改

　　由于我的应用在每个详细页提供了Share功能，如果大家的应用中没有这个功能就不用看这一条了。

　　这个错误的症状为打开第二个有share功能的页面(或本页面打开两次)就会出现类似下面的错误：　　

• SCRIPT14: Exception was thrown but not handled in user code at line 112, column 17 in ms-appx://3fa1d0d0-fb4a-48c6-8e10-f40028f54bc3/js/itemDetailPage.js
  0x8000000e - JavaScript runtime error: A method was called at an unexpected time.
  WinRT information: An event handler has already been registered
  File: itemDetailPage.js, line: 112 column: 17

　　在WinJS 0.6 版中 Share的代码大致是这样写的：

var dtm = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView();

dtm.addEventListener("datarequested", onDataRequested);

function onDataRequested(e) {
    var request = e.request;
    request.data.properties.title = item.title;
    request.data.properties.description = "Test";
    request.data.setText(item.content);
}

　　代码中的item是当前页面上绑定的数据项(新建一个Grid App项目，在itemDetail.js里就有)。

　　在WinJS1.0里报的错大致可以看出是说 datarequested 事件已经注册了，所以会出错。

　　一开始我尝试的是在添加事件之前先移除这个事件，但依然出错，后来想找到页面unload方法，想在这个方法里面移除事件，但貌似WinJS.UI不支持这个方法，试了好多次都不行后，找到了新的方案，就是添加一个全局变量作为标识，只注册一次。、

　　但由于上面代码里的item是当前页面上绑定的数据项，这就导致了Share的数据是第一次打开详细页的数据，不会改变。最后直接把item.title和item.content改为从页面上获取，终于OK了，代码如下：

var dtm = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView();

if (!isDatarequested) {
    dtm.addEventListener("datarequested", onDataRequested);
    isDatarequested = true;
}

function onDataRequested(e) {
    var request = e.request,
        title = document.querySelector("article .item-title").textContent,
        content = document.querySelector("article .item-content .content").textContent;
    request.data.properties.title = title;
    request.data.properties.description = "Test";

    request.data.setText(content);
}

　　代码中的 isDatarequested 是一个全局bool变量，初始值为 false 。

　　目前的方案可以解决问题，但还是不太明白为什么会出现重复注册事件问题，如果有朋友知道请不吝指点。

四、应用挂起和启动处理时的优化

　　注意，这一点是优化，不是错误，所以如果你不修改也不会出错。

　　在WinJS0.6版中default.js里有总分代码是这样的：

var app = WinJS.Application;
app.onactivated = function (eventObject) {
      if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { 
           WinJS.UI.processAll();
      }
};

　　在WinJS1.0中要改为这样：

var app = WinJS.Application;
var activation = Windows.ApplicationModel.Activation;
var nav = WinJS.Navigation;
WinJS.strictProcessing();

app.addEventListener("activated", function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        if (args.detail.previousExecutionState !== 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.
        }

        if (app.sessionState.history) {
            nav.history = app.sessionState.history;
        }
        args.setPromise(WinJS.UI.processAll().then(function () {
            if (nav.location) {
                nav.history.current.initialPlaceholder = true;
                return nav.navigate(nav.location, nav.state);
            } else {
                return nav.navigate(Application.navigator.home);
            }
        }));
    }
});