3
A
回答
5
請參閱this關於如何捕捉視圖狀態更改的博文。基本上,建議歸結爲抓住調整大小事件,然後檢查視圖狀態是這樣的:
window.addEventListener("resize", onResize);
function onResize() {
// Update view for the new window size
updateView();
}
function updateView() {
// Query for the current view state
var myViewState = Windows.UI.ViewManagement.ApplicationView.value;
var viewStates = Windows.UI.ViewManagement.ApplicationViewState;
var statusText;
// Assign text according to view state
switch (myViewState) {
case viewStates.snapped:
statusText = "This app is snapped!";
break;
case viewStates.filled:
statusText = "This app is in filled state!";
break;
case viewStates.fullScreenLandscape:
statusText = "This app is full screen landscape!";
break;
case viewStates.fullScreenPortrait:
statusText = "This app is full screen portrait!";
break;
default:
statusText = "Error: Invalid view state returned.";
break;
}
如果您在Microsoft Visual Studio Express的2012 RC期待的Windows 8 template for Javascript你會看到導航這樣的事情。 JS:
window.onresize = this._resized.bind(this);
_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;
},
//*page*.js
updateLayout: function (element, viewState, lastViewState) {
/// <param name="element" domElement="true" />
var listView = element.querySelector(".itemslist").winControl;
if (lastViewState !== viewState) {
if (lastViewState === appViewState.snapped || viewState === appViewState.snapped) {
var handler = function (e) {
listView.removeEventListener("contentanimating", handler, false);
e.preventDefault();
}
listView.addEventListener("contentanimating", handler, false);
var firstVisible = listView.indexOfFirstVisible;
this._initializeLayout(listView, viewState);
if (firstVisible >= 0 && listView.itemDataSource.list.length > 0) {
listView.indexOfFirstVisible = firstVisible;
}
}
}
},
_initializeLayout: function (listView, viewState) {
if (viewState === appViewState.snapped) {
listView.layout = new ui.ListLayout();
} else {
listView.layout = new ui.GridLayout();
}
},
根據this MSDN頁面,您還可以使用媒體查詢時,視圖狀態的變化會影響在CSS中指定的CSS屬性或佈局。對於所有其他更改,應使用onResize。
相關問題
- 1. 在RecyclerView中更改視圖的狀態
- 2. 更改視圖狀態
- 3. WCF事務狀態存儲在哪裏?
- 4. MVP被動視圖 - 在哪裏連接視圖的事件?
- 5. 檢測更改事件來自哪裏
- 6. 更改bootstrap模態視圖的形狀
- 7. C#事件更改發件人狀態
- 8. 在CQRS中改變事件的狀態
- 9. 在哪裏過濾狀態?
- 10. 在Android中按壓狀態更改圖像視圖的樣式
- 11. 根據父ViewGroup的狀態更改視圖的顯示狀態
- 12. 應該在哪裏處理listview中的數據更改事件?
- 13. MVP Android - 在哪裏保存視圖狀態?
- 14. 更改視圖高度選擇狀態
- 15. 如何根據狀態更改視圖?
- 16. Cscore播放狀態更改事件
- 17. Magento訂單狀態更改事件
- 18. Magento訂單狀態更改事件
- 19. 捕獲網絡狀態更改事件
- 20. 動態視圖?在哪裏放邏輯?
- 21. 在哪裏可以找到WPF圖像控件的狀態?
- 22. 在不同的商店視圖中更改Magento產品狀態
- 23. 如何在節點對象的狀態更改時動態更改JTree視圖?
- 24. 視圖狀態更換錯誤。 [ViewStateException:無效的視圖狀態。 ]
- 25. 數據庫中的「狀態更新歷史記錄」在哪裏
- 26. 對stage.displayState所做的更改:事件在哪裏? (Flash,AS3)
- 27. 更改樹狀圖狀態圖像
- 28. 在樹狀視圖中雙擊事件
- 29. 在下拉列表中selectedindexchanged事件不會更改其狀態
- 30. 在Form2.Disposed事件中更改Form1.Checkbox狀態
另一種選擇是使用媒體選擇器: var f = matchMedia(「all and(-ms-view-stated:snapped)」); f.addListener(myHandlerFn); –
@DominicHopton你可以捕捉狀態變化,但是我鏈接的博客文章指出,當事件觸發時,大小不會改變,所以如果你有任何依賴於大小的UI,那麼你幾乎必須等待'onResize'事件。捕捉'onResize'總是有效的。 – mydogisbox
這是消費者預覽推薦; RP&RTM不再是這種情況。 –