[教學(?)] Windows 8 APP開發小心得 - Windows

By Agatha
at 2013-08-01T18:53

Table of Contents

會說小是因為其實我自己也還沒完全掌握Win8 APP要怎麼開發(爆)

所以這篇只是給一些想開發Win8 APP的人一些自己的心得而已
(某程度上是因為市面的中文書太少，微軟官方的教學又很亂......)
有一部分會和前面對某位網友的回覆幾乎相同，所以看過的可以略過。

1. 開發Win8 APP要求

不用說，當然是需要一台Win8電腦，另外請記住，RT上面什麼桌面程式都不能裝，
包括Win8 APP開發需要裝的Visual Studio 2012(8.1是2013)也一樣不能裝

(不過也不用太在意這點，就跟蘋果也沒准開發者在iPad上裝Xcode一樣，
只要把RT想成是iPad，對RT那麼多限制的煩惱大概會少一點吧。
當然，關於只能用Win8的問題，如果想成就是你要開發iOS程式一定得買台Mac一樣，
也許煩惱也會少一點)

微軟的官網上有提供Visual Studio Express 2012的免費下載，
因為有正體中文介面，所以不用面對一大堆英文對台灣使用者而言應該是福音。
安裝的話起碼需要2GB，我忘記是不是一定非得裝在C槽，
不過對此不安心的話最好先清一下系統碟。

安裝完後第一次啟動時，他會要你註冊程式，還有要取得開發人員憑證，
因為都是免費的所以就放心照著他的步驟做吧，
不過請注意就算你做完了，也不代表你可以把APP傳到市集上，
你還得要取得市集的帳號。

由於這些步驟都需要微軟的Live服務帳號，所以當然也要記得申請
(只是如果你本來就有用市集程式的話，那你就一定會有Live帳號，
所以直接用那個Live帳號吧，這樣可以省下很多問題，
又若是你還不知道Live帳號是什麼的話，請直接輸入你的MSN帳號，那個就是了)

付費的部分我前面的文章都提過了，就再簡略說一次，
付錢後他還要確認一次你的信用卡可不可以用，
因此會用你的信用卡刷一筆「不會實際扣款」的金額。
所以你必須去跟你的信用卡公司去拿付款紀錄，
記得也要認真的跟他們要所有沒實際扣款的交易紀錄喔，不然是找不到的。

沒有信用卡的話，可以直接將郵局的金融卡升級成VISA金融卡，
這樣就不會有刷爆的問題，而你那張金融卡也可以充當信用卡使用。
全部的步驟都弄好後，就正式進入開發APP的步驟了

2. 紙上作業&事前準備很重要！

這還不是開玩笑的，這兩點應該說開發任何作業系統的APP都很重要，
雖然Win8有設計指引，但那只是介面上的大方向，
APP的內容和操作方式依然要你自己去想，
所以先想清楚：

1. 你想要開發怎樣的APP？
2. 你的APP需要有哪些功能？Win8提供的功能做得到嗎？
3. 你的APP有沒有可直接使用的資料？沒有的話要去哪裏生？
(例如新聞類/情報類的話就需要資料來源、遊戲類的話就跟開發遊戲沒兩樣)
4. 你的APP需要如何操作？

操作介面等等可以先畫在紙上(雖然微軟有提供PSD檔之類的，不過我覺得很不實用)
都想好後再來開始實際撰寫吧！

3. Win8 APP可使用的程式語言

基本上Win8就是允許用以下的程式語言開發：
1. HTML5/Java Script(Windows 8版)
2. XAML/C#
3. XAML/Visual Basic.NET
4. XAML/C++(包含CX)

除了第一個HTML可以直接使用Java Script以外，
其他的都需要學習XAML這個程式語言，不過也不用想的那麼難，
只要當成是「標籤和HTML不一樣而且比較嚴謹的HTML」會比較容易上手。

比方說，沒有結尾標記(如<img>之類的)的標籤，
在XAML就一定要標記成「<Textblock/>」才能通過編譯器，否則連執行都執行不了
除此之外全部當成你在寫網頁，這樣就可以快速上手了

就像HTML一定會用「<HTML>」當開頭，「</HTML>」做結尾，
Windows8使用的XAML也是使用「<Page>」做開頭，「</Page>」結尾
(如果是用預設範本的話可能是<common:LayoutAwarePage>之類的)
只是會有很多需要設定的細項，但因為Visual Studio都已經填好了，
千萬別自作主張去改，否則一個改不好整個程式可能就得砍掉重練

雖然說應該要是<Page>......</Page>才對，
但是<Page>的標籤功能太基本，
開了空白頁面後就會發現這個首頁沒有辦法弄出SnapView功能，
雖然也可以用撰寫程式碼的方法達成，但不如用早就先寫好的LayoutAwarePage會比較好

(據說8.1又更改了判斷程式碼就是了......)

這裡提供一些比較常用的XAML標籤：
(基本上都是Windows Phone有的控制項，所以學過的也可以跳過，
雖然我沒碰過WP的APP開發，不過感覺上功能應該都差不多)

<Textblock>：就是一個顯示文字的標籤，並不特別
但如果你想要顯示一串字的話非得用這不可，像是標題或內文都得用這個

<Image>：就是放圖片的標籤，沒有特別的地方。

<Border>：邊框，但是填成實心後也可以放置在ListView/GridView裡面當成圖示使用

<Grid>：格線，可以劃出井然有序的表格，另外每一頁預設都有一個Grid，
那個Grid可別刪除，不然也會跳錯誤訊息出來

<ScrollViewer>：捲動視窗，Win8沒有WP的Panorama控制項(8.1新增的Hub可能比較像)
但是Win8可以用這個搭配下面介紹的StackPanel做出類似的效果
另外裡面只能放一個子標籤，超過就會報錯(*1)

<StackPanel>：並排物件，這個大概是Win8 APP裡面最重要的一個控制項，
只要是排列物件就一定要用這控制項，可以指定水平排或垂直排列
如果裡面指定一張圖片也可以對圖片放大縮小。

<ListView>：垂直的清單，如果要呈現資料庫資料一定得用這個，
WP同類的控制項聽說是<ListBox>。

<GridView>：和ListView同樣用來顯示資料用，不過不同的是這個可以水平排列。

<WebView>：和上面的最大不同是可以放網頁，不過有個嚴重缺點，
就是Win8預設是最上層顯示，就算是旁邊的設定欄也蓋不掉它
(但據傳8.1有對此改善)

至於FlipView和SemanticView這兩個比較高段所以下次再說

*1 裡面只能放一個子標籤的意思是這樣：

<ScrollViewer>
<StackPanel>
......
</StackPanel>
</ScrollViewer>

上面這段可以通過編譯器，但是下面這段就不行：

<ScrollViewer>
<StackPanel>
......
</StackPanel>
<StackPanel>
......
</StackPanel>
</ScrollViewer>

打下去的時候編譯器就會直接跟你報錯說「容器裡面只能放一個標籤」，
Page和common:LayoutAwarePage也一樣，不過限制是會直接呈現在畫面上的標籤
如果是設定值類型的，這個就不會管了。
不過就算是StackPanel這類會呈現在畫面上的子物件，
在其裡面又放了多少物件，編譯器也不會管

暫時先寫到這樣，後面有時間的話就繼續寫一些可能沒什麼用的教學......

--
如果將字母A到Z分別編上1到26的分數（A=1,B=2...,Z=26）
你的知識（KNOWLEDGE）得到96分（11+14+15+23+12+5+4+7+5=96）
你的努力（HARDWORK）也只得到98分（8+1+18+4+23+15+18+11=98）
你的態度（ATTITUDE）才是左右你生命的全部（1+20+20+9+20+21+4+5=100）
但是得了火山矽肺病（PNEUMONOULTRAMICROSCOPICSILICOVOLCANOCONIOSIS）就有560分喔

--

Tags: Windows