首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
您现在的位置: 程式碼之家 >> 編程語言 >  >> .NET 網頁程式設計 >> C# >> 關於C#

Windows 8 開發入門(三):分割版面應用程式範本與 Logo 自訂

     編輯:關於C#

Visual Studio 2012 提供 分割應用程式 範本,預設實作主從式導航(分類清單 + 詳細內容),適合新聞、購物類 App。

建立專案與目錄結構

  1. VS2012 → 新增專案 → Windows Metro 樣式 → 分割應用程式
  2. 專案資料夾說明:
資料夾/檔案用途
Assets系統圖片與資源
Common公用程式碼(樣式、轉換器、LayoutAwarePage 等)
DataModel資料層(SampleDataSource 提供設計階段資料)
ItemsPage.xaml群組清單頁(主頁)
SplitPage.xaml群組內容詳細頁(從頁)
Package.appxmanifest應用程式清單:Logo、發布、簽章、權限
App.xaml應用程式進入點、全域樣式字典
新增專案對話方塊
圖 1:選擇分割應用程式範本
專案結構總覽
圖 2:方案總管資料夾結構

自訂 Logo 與啟動畫面

  1. 將圖片置於 SplitGrid\Assets\Img\
  2. 開啟 Package.appxmanifest → 應用程式 UI,修改:
  • 方形 150x150 Logo
  • 寬 310x150 Logo
  • 小型 30x30 Logo
  • 啟動畫面 (620x300)
Manifest Logo 設定頁面
圖 3:Package.appxmanifest 應用程式 UI 索引標籤

調整資料模型圖片路徑與樣式

  • DataModel\SampleDataSource.cs:將圖片路徑改為 "Assets/Img/Badges_002.png"
  • Common\StandardStyles.xaml:對應項目容器樣式設定 Stretch="None"
分割頁面執行效果
圖 4:群組清單頁面
詳細頁面執行效果
圖 5:項目詳細內容頁面

原始碼下載:SplitGrid.zip (Windows 8 + VS 2012)

  1. 上一篇文章:
  2. 下一篇文章:
Copyright © 程式碼之家 All Rights Reserved