1. 前言
WPF（Windows Presentation Foundation），即“Windows呈現基礎”，它的目的非常明確，就是用來把資料“顯示”給使用者看的（說白了就是用來做UI的）。接下來將會介紹一個小專案，用WPF來實現模擬手機介面設計。

2. 實現的功能
本專案模擬手機介面，實現瞭如下幾個功能：

• 滑動解鎖
• 頂部狀態列顯示
• 檢視系統時間
• 附有背景以及應用圖示的介面及切換
• 點選日曆圖示跳轉到顯示日曆的介面
• 點選鎖屏圖示進入滑動解鎖狀態

3. 效果展示

• 滑動解鎖、頂部狀態列顯示 、檢視系統時間

  
  
  實現情況：
  1.實現了仿蘋果手機的滑動解鎖效果，同時滑動解鎖模組上面的文字具有動畫效果。當滑動解鎖箭頭滑動長度不足進度條的一半則箭頭回到起點，超過一半解鎖成功。
  2.在螢幕頂部顯示狀態列，在鎖屏介面實現顯示系統時間的功能，能夠實時顯示系統時間。

• 附有背景以及應用圖示的介面及切換
  
  實現情況：
  1.每個頁面必須設定一個背景圖片，每個圖示必須有自己的影象。
  2.點選頁面下方的左右箭頭可以實現兩個介面之間的順序切換，點選中間的home鍵則返回主介面。當介面切換時，具有仿蘋果手機的翻頁效果（淡入淡出的動畫效果），同時可以通過底下的圓點的顏色來判斷當前所在介面。

• 模擬Icon的事件響應

  
  
  實現情況：
  1.部分應用圖示點選事件，能夠跳轉到指定介面。點選日曆則能夠顯示日曆。點選鎖屏的應用圖示能夠進入滑動解鎖的狀態。

4. 部分功能程式碼分析

• App.xaml
  
  程式啟動的地方，其實是在程式的App.xaml檔案裡面：StartupUri=”Window1.xaml“這個就是程式的入口點，執行程式之後，我們就將window1顯示在了顯示屏上。

• Window1.xaml
  
  Page是我們真正的Ui，而NavigationWindow不過是為我們提供了一個框架，Page是附在上面的。因為VS2010不能直接建立NavigationWindow和Page相關的專案，所以我們要自己修改。首先建立一個WPF應用程式，在後臺將繼承的Window類改為NavigationWindow類。然後在XAML中同樣將< window………標記改為NavigationWindow。NavigationWindow上不能有任何控制元件。。。包括Grid等。。。。記住現在我們的UI是Page。新建Page，在上面隨便畫畫。然後將NavigationWindow.Source設為預設頁面(Default Page)。即將主窗體的XAML裡NavigationWindow的Source屬性設為Page的名字，就OK了。另外Page之間的切換也是很簡單方便的。NavigationService.Navigate(newUri(“XXXXX.xaml”,UriKind.Relative)); XXXXX為Page的名字。

• Window1.xaml.cs
  
  為Page增加淡入淡出(Fade)效果：
  Window1繼承自NavigationWindow，那麼顯然抓住Navigating事件不放，做如下操作：
  　　取消當前Navigate請求，如果有當前頁的前提下。
  　　淡出當前頁，如果有當前頁的前提下。
  　　完成淡出過程後Navigate到目標頁。
  　　淡入目標頁。

• Slide.xaml
  
  用於顯示背景圖片。

• Slide.xaml.cs
  
  
  完成滑動解鎖功能。

完成顯示系統時間的功能。

• Slide.xaml
  
• RepeatBehavior：獲取或設定此時間線的重複行為。Forever迴圈動畫
• DoubleAnimation：它在指定的持續時間內將動畫從指定的起始值繼續到指定的目標值。

• From，To：動畫開始到結束變化的值

• Slide.xaml.cs
  
  實現了滑動解鎖成功切換到主介面的功能。

• index.xaml
  
  
  實現頁面切換以及頁面底部顯示頁面切換狀態的圓點。

5. 下載連結
http://download.csdn.net/download/qq_22408539/10185109