天天看點

快速建構Windows 8風格應用8-貼靠視圖

本篇博文主要介紹如何切換出貼靠視圖、關于貼靠視圖的設計、關于貼靠視圖的應用程式欄和如何實作貼靠視圖。

如何切換出貼靠視圖

第一步:水準方向全屏視圖

快速建構Windows 8風格應用8-貼靠視圖

第二步:通過邊緣輕掃手勢,向裝置左端或右端進行貼靠 

快速建構Windows 8風格應用8-貼靠視圖

第三步:實作貼靠視圖的效果 

快速建構Windows 8風格應用8-貼靠視圖

我們知道如何通過手勢的操作切換出一個應用的貼靠視圖了。

關于開發貼靠視圖,對于我們開發者需要注意哪些呢?如下幾點:

所有的應用程式都是支援貼靠視圖的。

根據應用的業務需求,最好為貼靠視圖量身定做頁面效果(也就是說需要定制貼靠視圖模版)

最好保持貼靠視圖頁面的内容和狀态與全屏視圖的一緻性。

保持貼靠視圖頁面設計風格和其他視圖的一緻性。

保證在貼靠視圖中所有使用者的操作是有互動的,有響應的(就是說貼靠視圖中不能出現假頁面或者使用者點選貼靠視圖某一資料項時沒有任何使用者響應)。

關于貼靠視圖的設計

關于設計貼靠視圖,對于我們開發者需要注意哪些呢?如下幾點:

1)  水準方向保持320px的寬度。

2)  根據使用者習慣應該設計為單列布局,上下滾動浏覽資訊。

3)  應用在貼靠視圖中應該可以完成一套完整的互動流程操作。

4)  由于空間和可操作性的問題,貼靠視圖中的互動操作功能可以部分删減,是以就沒有完整視圖中那麼全面。

快速建構Windows 8風格應用8-貼靠視圖

關于貼靠視圖的應用程式欄

我們在開發貼靠視圖的應用程式欄時,需要注意幾點:

1)  貼靠視圖的應用程式欄中按鈕沒有文字辨別,并且單列中最多隻能有5個按鈕。

2)  如果多于5個按鈕,按鈕就會變成兩行排列顯示。

3)  從使用者體驗考慮,貼靠視圖中應該合理地考慮設計按鈕個數。

4)  從使用者體驗考慮,貼靠視圖中應該合理地将指令分組。

快速建構Windows 8風格應用8-貼靠視圖

如何實作貼靠視圖

第一步:定義一個用于顯示貼靠視圖的ListView或GridView等控件。

快速建構Windows 8風格應用8-貼靠視圖

第二步:在Name為Snapped的VisualState中控制切換到貼靠視圖時的操作。

快速建構Windows 8風格應用8-貼靠視圖

綜上所述,我們在應用中實作貼靠視圖的步驟沒有那麼繁瑣,如何設計好應用程式中的貼靠視圖就需要思考怎麼去設計貼靠視圖中控件的布局了。

繼續閱讀