首先按照上一篇部落格中的順序來建立一個項目。建立好之後就點開mainpage.xaml開始敲代碼了。
下面就來依次介紹上面這段代碼到底做了寫什麼。
1）首先将最外圍的grid控件分成了3行2列。其中第一行的高度是100像素；第二行的高度是自動的，所謂自動呢，就是會根據将來在其中添加的控件的所占的高度來決定的；第三行的高度就是剩餘的啦，這麼說可能不夠清楚到底星号是什麼意思。那再看看切成的這兩列就好啦，它的寬度比就是4：6。很顯然不一定是非得比例加起來等于10，即便是4：100也可以的。
2）在最外層的grid内嵌套了一個stackpanel，并且将其定位在第一行，而且橫跨2列。grid最擅長的就是操作具體的像素，它可以将任何控件精确的定位到任何一點。而stackpanel最重要的orientation屬性則可以安排其内的控件的排列方式，比如這裡就是讓兩個textblock控件按水準方向來排列。
3）在這裡又嵌套了grid，裡面有一個button，foreground屬性是定義字型顔色，fontsize屬性是定義字型大小。下面重點來看看margin屬性。我們定義的marin=”12,480,0,0”，從左至右依次是左、上、右和下四個方向距離外圍邊框的距離。
在設計器中已經标注了左邊距是12，而上邊距沒有展現出來，但确實是480。還記得之前的那個auto麼，在這裡就展現出來了啦，因為下邊距是0，是以grid的分割線就剛好在button下面啦。但為什麼右邊的分割線不剛好在button的右邊呢，這是因為我們之前的2列是按照4：6的比例來切的呀，而不是設定的auto。
4）canvas位于其外圍的grid控件的正中央，horizontalaligment和verticalalignment分别表示水準方向和垂直方向的擺放位置。canvas.top和canvas.left分别表示離canvas最上邊和最下邊的距離。
5）給button設定一個名字，然後敲下click=”“之後，就會出現如下圖所示，這是直接按下enter鍵就可以直接命名咯。小技巧啦。
然後輕按兩下click事件的名字後，直接按f12鍵就會自動生成一個事件并且跳轉到c#檔案啦。下面這段代碼就是會讓頁面從mainpage跳轉到secondpage。
寫完這段代碼也先别急着調試，因為還沒有建立secondpage呢。建議建立好之後最好再往裡面加點東西，不然跳轉過去了就是黑茫茫的一片還以為是出bug了呢，添加一個基本的textblock就可以了。
我再來簡單介紹一下vs中常用的一些東西，僅僅面向初學者。在下面的圖中，方框1處可以讓設計器和xaml代碼的位置對換哦，截圖裡我就是将設計器放到了右邊，不過隻是為了截圖，設計器還是在左邊比較習慣。
方框2處可以讓設計器和xaml代碼上下擺列和左右擺列也可以不顯示它們中的某一個。旁邊還可以設定網格對齊以及設計器的縮放比例。
方框3和方框4中可以設定的東西就太多啦，可以設定漸變色，也可以設定click事件，還可以設定控件的布局等。
windows上的modern應用我倒是不常用，不過wp8上的應用我覺得和安卓什麼的最大的差別就是它的應用欄了，下面就來講講應用欄是怎麼做出來的。
在document outline（在視圖中找到，或者按ctrl+w，u）中有topappbar和bottomappbar，分别是頂部和底部的應用欄。點滑鼠右鍵可以快速定義appbar和commandbar，通常将appbar放在應用上端也就是topappbar内，commandbar放在下端也就是bottomappbar内。
或許很多人都不知道，在modern應用下，按win+z鍵可以直接呼出應用欄喲。另外要注意appbar與commandbar不同，前者隻能包含一條子内容，通常定義一個grid控件，然後在grid内嵌套其他控件。下面貼出一段appbar的示例：
但是大家應該都發現了，預設情況下應用欄是隐藏起來的，如果想要在加載的時候就是啟動的，那該怎麼辦呢？很簡單，直接在appbar定義isopen屬性為真就好。
另外還有粘滞屬性喲。也就是說，原本當用右鍵呼出應用欄後，再用左鍵等點一下其他位置應用欄就會自己消失啦，但如果issticky屬性為真的話呢，非得再多按幾下右鍵才會消失的。
除了在xaml中定義這些屬性外，我們也可以在背景代碼中用函數來實作呢，這裡我就是用的2個button的click事件。
既然是通用應用了，那麼wp這邊自然也是類似的，不過暫時還隻有bottomappbar卻沒有topappbar呢，以下是系統給生成的代碼，和windows上的一樣。
想要了解更多關于應用欄的内容，大家可以參考下一篇中的應用欄。
background：背景色
borderbrush：邊框色
borderthickness：邊框大小
clickmode：點選模式，具體有3種：懸停（hover）、按壓（press）、釋放（release）
content：内容
fontfamily：字型
fontsize：字型大小
foreground：字型顔色
fontstretch：字型在螢幕上的展開程度