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

看板WindowsPhone作者 (WildDagger)時間12年前 (2013/08/02 14:09), 編輯推噓5(5011)
留言16則, 6人參與, 最新討論串1/1
繼續前一篇的教學(? 4. APP專案的結構 這邊是以XAML/C#和HTML5/Java Script作為開發語言介紹 XAML/Visual Basic或者是XAML/C++(CX)的話, 把XAML/C#裡面的「.cs」換成「.vb」/「.cpp」大致上就相同。 首先是XAML/C#的部分 從預設在右邊的方案總管視窗中就可以看到有以下這些: 「Properties」:裡面只有一個AssemblyInfo.cs,其實可以不用管 「參考」:就跟開發桌面程式一樣,偶爾也是需要使用他人的程式庫, 以Win8 APP而言除預設外,最常被拿來參考的應該是名為Callisto的程式庫 (因為很多東西XAML/C#不知為何沒支援,非得靠外部程式庫, 但據說8.1總算加了部分功能回來) 「Assets」:使用的媒體資料請集中放這邊 (雖然另外弄個資料夾也不是不行,但因為預設的磚圖檔會放這邊, 沒有什麼必要的話其實把你用的圖檔、影片、音樂全塞這裡也無妨) 「Common」:如果你開的是空白範本,那麼裡面只會有StandardStyle.xaml 這個檔案是標準的樣式庫,基本上絕對不能刪, 刪掉的話整個程式就得砍掉重練 當然如果是範本的話,裡面也會有更多程式檔, 也是絕對不能刪,刪了就得砍掉重練的類型 「App.xaml」/「App.xaml.cs」: 整個APP最重要的部分,因為這個是所有APP預設的進入點, 雖然App.xaml並不負責呈現畫面,但是這裡面可以定義很多共用的物件 比方說,如果你想要整個APP都不要是預設的黑色而是藍色等顏色的話, 可以在App.xaml裡面找到<ResourceDictionary>這個標籤後, 在下面寫下這段程式碼: <SolidColorBrush x:Key="AppBackgroundBrush" Color="Blue"/> 之後存檔就可以在所有APP的頁面把這個拿來用, 下次再介紹這個是幹嘛的,目前先提醒的就是「x:Key」是這個資源的標籤 (或者說是名字,總之就是用來識別的), 要用的時候呼叫這個標籤就會自動幫你填上去這個內容。 另外,App.xaml.cs這個則是負責把App.xaml寫的東西變成程式的解讀檔, 所以也不能砍掉,砍了就完蛋 「MainPage.xaml」/「MainPage.xaml.cs」: 和上面的相同,這兩個檔是唇齒相依 (或者說只要是「*.xaml」和「*.xaml.cs」就是一樣的原則,不能砍其中一個) 這個就是App進入後第一個呈現的畫面,所以要編輯畫面請編輯這個 首先提醒一下,在Win8 APP裡面,每個頁面會被視作一個同名的「類別」 例如說這個檔案叫做MainPage.xaml,那麼程式面上它的名字就叫MainPage 因此可以活用這點來讓彼此交換變數等資訊。 如果想要換個首頁的話,就要在App.xaml.cs裡面去找這段: if (!rootFrame.Navigate(typeof(MainPage), args.Arguments)) 把裡面的MainPage換成你的新首頁檔名(例如BlankPage之類的)就OK (因為預設的空白範本其首頁是不支援ViewState切換的) 不過請注意大小寫,C#是非常注意大小寫的,寫過的人應該知道, 所以就算在Win8 APP裡面,編譯器也不會放水讓打錯的大小寫變數通過編譯喔 「(專案名稱)_TemporaryKey.pfx」:這個是不可刪檔案之一,是憑證檔 當你寫好要編譯測試的時候會需要這個。 「package.appxmanifest」:超級必要的檔案,砍了也是準備砍掉重練吧 裡面寫的是關於APP的權限、資訊等宣告事項, 雖然說用Visual Studio開的話, 會出現像是設定視窗一樣的頁面,但這檔案其實是XML檔。 顯示名稱、預設語系、描述、磚的圖案設計、功能和宣告等 全部都必須在這裡設定,沒設定好包準被退件 新增的xaml和xaml.cs要點跟上面的MainPage.xaml/MainPage.xaml.cs相同 所以就不重述了。 HTML5/Java Script部分 相較於XAML程式檔不少,HTML5/Java Script就少多了 (不知道是不是我的錯覺,寫APP這檔事越來越像是寫網頁, 而且智慧型手機/平板的系統幾乎都綁瀏覽器, (更甚者就像Firefox OS直接說他們是綁瀏覽器來開以HTML5寫的App) 讓我開始懷疑我們寫好的APP會不會其實都是透過瀏覽器在開的, 或者說,其實我們根本不是在選智慧型手機作業系統而是在選智慧型手機瀏覽器?) 「參考」、「(專案名稱)_TemporaryKey.pfx」、「package.appxmanifest」 這三者和上面的相同,故不重述。 「css」:就是放網頁的CSS樣式檔,基本上裡面放的CSS要跟你的網頁同名 「images」:和C#的「Assets」相同,磚圖檔放這邊 「default.html」:程式的進入點,雖然說和C#的App.xaml不同, 這邊編輯的畫面可以直接顯示出來, 但是範本程式碼多半都是用Render頁面的方式, 鮮少直接用這個頁面來顯示畫面的。 「default.js」:這個就是Java Script型APP的中樞, 不過這篇JS格式和平常看到的JS有點不同,格式都是這個樣子: (function () { "use strict"; var app = WinJS.Application; var activation = Windows.ApplicationModel.Activation; ...... })(); 簡單說就是平常寫網頁的時候都用<script>......</script>來寫, 不過Win8 APP是把整個JS都包在一個function裡面執行, 而且這function裡面還可以再寫function (我並不清楚原理是什麼,有看到說法是這樣代表匿名代理函式?) 基本上大致就是這樣,因為我平常都用XAML/C#來寫, 所以以後的教學大致上都以XAML/C#為準 HTML5/Java Script的話,市面已經有兩本中文教學書了, 不過相對而言XAML/C#卻是一本都沒有 (只有一本根本是把微軟官方教學資料變成離線檔的書) ......所以當時找資料找的好頭大,而且更煩悶的是MSDN幾乎是複製貼上的世界 (複製貼上就算了,還不見得是正解......) 最後只得自己蠻幹去不斷嘗試才勉強有一點成果Orz 喔對,直接搜尋也是比較好,雖然出現的大部分都是英文 還有我很想吐槽的是,為什麼Google找到的資料會比微軟你自家的bing還要正確啊! 5. 開始前先注意:請記得重建方案 就算是最初的空白頁面, 直接編譯的話也是可以直接看到一個沒東西的空白頁面出現在你眼前 不過如果你用了範本的話,就要小心一件事了。 不知道Visual Studio是不是太笨,新增預設範本的檔案時, 它常常會找不到程式庫,然後當你試著執行的時候, 就會跳錯誤訊息說找不到範本的程式庫所以不給你編譯。 雖然說關掉重開有高機率可以修復,但也有可能關掉Visual Studio重開還是找不到 碰到這種情況的時候,請直接在方案總管中你的方案上按右鍵, 然後選擇「重建方案」,給他跑一下後,就暫時不會碰這狀況了 說是暫時,是因為就算修好了,偶爾還是會發作的。 (我猜這是Visual Studio的Bug?) 6. 有時與其依賴Blend不如直接動手寫程式碼比較快 安裝Visual Studio的時候除了Visual Studio以外, 還會附贈安裝一個Blend作為設計界面的程式 雖然說編輯VisualState的部分用Blend比手寫程式碼還快, 但是編輯一些細項的時候,我反而會覺得Blend很難用, 有時直接打程式碼都還比較快(個人感覺,不過應該也有人可以把Blend用到出神入化) 所以稍微接觸一下XAML和HTML也是很重要的喔! 7. 動態磚的圖檔設計問題 基本上有四個檔案是必要的: 1. 標誌:也就是所謂的小型磚,大小要150X150 2. 小標誌:會用在應用程式列表的標誌(8.1會把這個直接挪作超小型磚嗎?), 大小要30X30 3. 市集標誌:會用在市集檢索結果的標誌,大小是50X50 (還是說這個比較有機會在8.1變成超小型磚?) 4. 啟動顯示畫面:需要620X300的大小 這些標誌都可以用透明圖檔, 背景的話可以在上面的背景色彩用HTML的色彩標記碼(例如#0000FF之類的)來標記 不過請記住最好用覆蓋的,而且旁邊的那些縮放比例全部不要做, 不然你會發現你怎麼弄都過不了編譯器(一開始我就被這搞得很頭大) 還有,雖然有預設圖檔,但是絕對不要直接拿預設圖檔就丟市集, 微軟也是會毫不留情給你退件的 (或者甚至是,在本機這邊跑驗證程式的時候就不會給你過了) 8. 上架注意事項 雖然說這個是上架的時候才需要注意,不過後面有幾乎是一大串程式碼的預感 恐怕這個會被淹沒,所以我先在這邊提醒好了: 1. 不見得要完全按照設計導引設計介面,但是差太大的話被退機率很高, 遊戲類的話微軟還會睜隻眼閉隻眼,但是資訊類與工具類不這樣搞退件機率很大 2. 磚絕對要換成自己的圖檔,不然別說是微軟會狠狠退掉你的程式, 甚至連電腦一併安裝的驗證程式都會退你的APP 3. 千萬不要把還沒公開的功能寫在上面然後說近期公開, 不然微軟也是會退的, 我寫那個捷運APP的時候就曾經把常用車站的功能放在上面說敬請期待, 結果第一次丟上去就被微軟打槍了 (現在的話我還在思考要不要用釘選次要磚的方式取代直接列表) 4. 截圖的部分請記得至少要一張, 沒有的話請用Win鍵+PrintScreen鍵照一張, 當然每個功能都用一張也沒問題,但是記得要寫說明 5. 如果你的帳戶沒有設定外匯帳戶的話, 微軟不會准許你賣錢的,這點請注意 (因為郵局帳戶沒辦法收外匯,所以我也沒辦法賣APP, 有沒有人知道哪家銀行有外匯帳戶的?) 6. 操作方式越寫的鉅細靡遺越好,因為測試人員要是哪裏沒辦法操作的話, 他會直接判斷你的APP不合格,到時就麻煩了 今天就先這樣,下次來談談看資料繫結怎麼弄(其實這點我也很需要支援......) --

12/30 17:34,
羽月絕對不會承認會偷偷拿女裝來試穿呢~~(逃)
12/30 17:34

12/30 17:35,
r790528:羽月絕對不會承認剪掉了呢~~(逃)
12/30 17:35

12/30 17:37,
r790528:羽月哪時候剪掉了阿!!!!應該說羽月有過嗎....?
12/30 17:37

12/30 17:41,
好愛莉不推嗎~~
12/30 17:41

12/30 17:45,
怎麼倒不了阿!!!!!!!!!!!!!!!!!!!!!
12/30 17:45
#1E_Nje00 民國100年,C洽最後的稀有任務──以及羽月華麗的自爆。 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 111.250.111.109

08/02 14:17, , 1F
一起吐潮bing 真的很鳥 永遠記得搜自家SkyDrive 永遠沒
08/02 14:17, 1F

08/02 14:17, , 2F
有自家服務網頁 只能搜到一些有的沒的
08/02 14:17, 2F
雖然現在也習慣用Bing,但是其搜尋準確度真的頗糟...... 雖說用英文搜尋的話,準確度好像會略為上升就是了。

08/02 14:37, , 3F
外匯帳號應該是除了郵局以外的銀行都有 XD
08/02 14:37, 3F
這樣嗎?找時間去問問看好了。

08/02 14:49, , 4F
連載推
08/02 14:49, 4F

08/02 14:57, , 5F
08/02 14:57, 5F

08/02 15:09, , 6F
很值得新手開發參考
08/02 15:09, 6F
我一直覺得Windows Phone和Win8的APP沒人寫 某個程度上真的是門檻太高,雖然看起來很簡單, 但是能用的API卻又和視窗程式有差, 而且教學書少到不行就算了,偏偏還碰上微軟官方網站的資訊雜亂無章, 想進來也會被嚇退啊...... (當然那個很難找到答案的MSDN論壇我覺得也是元兇之一) ※ 編輯: hoyunxian 來自: 111.250.111.109 (08/02 17:48)

08/02 17:52, , 7F
以老手來說我不覺得門檻太高.新手完全沒寫過的話這倒是
08/02 17:52, 7F

08/02 17:52, , 8F
需要學習一下,但是沒有一套是新手速成的語法吧..
08/02 17:52, 8F

08/02 17:54, , 9F
先撇開MSDN資源不談,書籍的話就像APP市場一樣,加上現在普
08/02 17:54, 9F

08/02 17:55, , 10F
騙認為出書沒"錢"途,所以作者/出版社也是出觀眾想看的題材
08/02 17:55, 10F

08/02 17:56, , 11F
不過這情況僅限在中文書,英文和簡中的書籍倒是不少~
08/02 17:56, 11F
我覺得門檻高是因為教材少又亂 對老手而言,API的可用API與桌面程式不同會成為一個障礙 好比說Windows.Forms之類的在Win8 APP全部不能用 (雖然還是有Textbox之類的控制項,但都算到Windows.Xaml.UI裡面去了)

08/02 18:35, , 12F
MSDN有些東西還真的很舊
08/02 18:35, 12F
其實問題應該是MSDN仍舊有2.0時代的東西(可能是顧慮到有些人仍用舊版?) 但是搜尋的時候明明指定要找Windows市集程式範圍可以用的API 卻仍舊會把搜尋的人導去非常舊的2.0版本 不然就是市集APP不支援的API,真的會把要找資料的人搞到昏倒 ※ 編輯: hoyunxian 來自: 111.250.111.109 (08/02 23:50)

08/03 12:09, , 13F
Bing我倒是覺得還好,英文其實是差不多的
08/03 12:09, 13F

08/03 12:09, , 14F
中文可能有些細項是用google找比較準確
08/03 12:09, 14F

08/03 12:10, , 15F
但是搜尋引擎也是要從使用者得到data學習的
08/03 12:10, 15F

08/03 12:10, , 16F
所以同樣是雞生蛋蛋生雞的問題XD
08/03 12:10, 16F
文章代碼(AID): #1H-qqeUo (WindowsPhone)