開發(fā)環(huán)境配置好之后误趴,是不是開始手癢癢了~下面讓我們創(chuàng)建第一個Win10的UWP小程序吧~
首先雙擊Microsoft Visual Studio圖標(以下簡稱VS)霹琼,打開VS程序,此時出現(xiàn)了一個Start Page頁面凉当,點擊左側(cè)“New Project”創(chuàng)建一個新項目枣申。
在彈出的頁面中,選擇Blank App(默認選中此項)看杭,在對話框下半部分輸入項目名稱和項目目錄忠藤,點擊“OK”
在接下來彈出的選擇框中可以看到此項目支持的系統(tǒng)版本,默認設(shè)置都合適楼雹,點擊“OK”模孩,等待1s左右,一個Win10的項目就創(chuàng)建好了贮缅。
讓我們看看Win10的項目結(jié)構(gòu)(和Xcode不同的是榨咐,目錄結(jié)構(gòu)默認放在右側(cè)Solution Explorer選項卡中)
默認空白項目中包含哪些內(nèi)容?(以下內(nèi)容參考了官方開發(fā)文檔)
App.xaml 和 App.xaml.cs
App.xaml 是你聲明應(yīng)用中所使用的資源的位置谴供。
App.xaml.cs 是 App.xaml 的代碼隱藏文件块茁。 與所有代碼隱藏頁面一樣,它包含一個調(diào)用InitializeComponent方法的構(gòu)造函數(shù)桂肌。 你不必編寫InitializeComponent方法数焊。 該方法由 Visual Studio 生成,其主要作用是初始化在 XAML 文件中聲明的元素轴或。(App.xaml.cs 是應(yīng)用的入口點昌跌,App.xaml.cs 還包含一些處理應(yīng)用激活和掛起的方法)
MainPage.xaml
用來為應(yīng)用定義 UI。 有兩種方式照雁,類似iOS開發(fā)中storyboard設(shè)計UI和代碼創(chuàng)建UI蚕愤,在Win10開發(fā)中可以直接使用 XAML 標記(寫代碼)添加元素答恶,也可以使用 Visual Studio 提供的設(shè)計工具(所見即所得)。
同理萍诱,MainPage.xaml.cs 是 MainPage.xaml 的代碼隱藏頁面悬嗓,可以在其中添加應(yīng)用邏輯和事件處理程序。
這兩個文件一起定義稱為MainPage的新類裕坊,該類繼承自HelloWorld命名空間中的Page包竹。
Package.appxmanifest
描述應(yīng)用的清單文件:應(yīng)用的名稱、描述籍凝、磁貼周瞎、起始頁等等。
包括應(yīng)用包含的文件列表饵蒂。
Assets 圖像文件夾
Assets/Square150x150Logo.scale-200.png 表示“開始”菜單中的應(yīng)用声诸。
Assets/StoreLogo.png 表示 Windows 應(yīng)用商店中的應(yīng)用。
Assets/SplashScreen.scale-200.png 是應(yīng)用啟動時顯示的初始屏幕退盯。
了解完整個項目的結(jié)構(gòu)之后彼乌,讓我們添加一個按鈕,并處理按鈕的點擊事件吧~
雙擊MainPage.xaml文件(第一次打開需要2s左右時間加載控件)渊迁,可以看到在屏幕中央有一個比較小的空白界面(默認手機屏幕大形空铡),在該窗口的右下角可以設(shè)置這個界面的顯示比例(我一般都設(shè)置為33.3%琉朽,大小適中)
單擊左側(cè)垂直的“Toolbox”毒租,打開 UI 控件列表 (可以單擊彈出的列表選框的右上角的固定圖標使其始終可見)
展開“Common XAML Controls”(常用的xaml控件)將Button拖動到設(shè)計畫面的中間。
此時查看XMAL(在此窗口的左下角點擊XMAL按鈕)代碼箱叁,可以看到如下代碼:
(粘貼代碼時發(fā)現(xiàn)直接在簡書的編輯頁面出現(xiàn)了一個按鈕 = =)蝌衔,因此將代碼截了個圖
還好在大學期間學過html標簽~能看懂此代碼的大致含義,對比按鈕的顯示樣式蝌蹂,可以看出Content中的內(nèi)容即為按鈕的標題,雙擊Button文本曹锨,改為“Hello World”(或者你想要改成的任意文本)孤个,再點擊Design,發(fā)現(xiàn)界面上的按鈕標題果然改成了“Hello World”
是不是有點躍躍欲試沛简,想看一下運行的效果呢~
點擊菜單欄下側(cè)的綠色三角按鈕齐鲤,默認選中“Local Machine”,也就是在本機器上調(diào)試椒楣,點擊Local Machine给郊,等待程序運行
這就是該項目在本機器上運行的樣子!
那在手機上呢捧灰?
關(guān)閉這個調(diào)試的窗口淆九,或者在VS上點擊紅色正方形(Shift+F5),結(jié)束本次調(diào)試,點擊Local Machine右側(cè)的向下按鈕炭庙,選擇任意一個內(nèi)存小于你現(xiàn)在用的電腦的Mobile Emulator(親測用Surface Pro3開發(fā)時只要打開瀏覽器饲窿,內(nèi)存就不夠手機模擬器的調(diào)試了…),再次點擊運行按鈕(或快捷鍵F5)
此時屏幕上出現(xiàn)了一個Windows Phone模擬器焕蹄,并運行著我們剛寫好的項目:
體驗不亞于開發(fā)iOS程序~下面我們給按鈕加一個點擊事件吧
首先停止調(diào)試程序(不停止不能繼續(xù)編輯項目)逾雄,雙擊xaml中的按鈕,VS會自動創(chuàng)建此按鈕的點擊事件腻脏,并且光標跳轉(zhuǎn)到該代碼的位置(這點比iOS開發(fā)的體驗好多了)
當然我們也可以自己用代碼手動創(chuàng)建這個點擊事件鸦泳,這里還有另外一種方式:
單擊按鈕選中它,然后訪問右下方的“屬性”窗格永品,切換到“事件”(一個小閃電圖標)做鹰,也可以添加按鈕的點擊事件的代碼
下面給按鈕的點擊事件加一些代碼,實現(xiàn)如下兩個功能
①點擊按鈕腐碱,彈出對話框誊垢,上面顯示“Hello World”
②點擊按鈕,讓系統(tǒng)朗讀“Hello World”
下面分別是兩個事件的代碼:
①
private async void button_Click(object sender, RoutedEventArgs e)
{
? ? ? await new MessageDialog("Hello World").ShowAsync();
}
注意:MessageDialog方法需要導(dǎo)入命名空間症见,可以根據(jù)VS的提示自動導(dǎo)入喂走,
②
private async void button_Click(object sender, RoutedEventArgs e)
{
? ? ? MediaElement mediaElement = new MediaElement();
? ? ? var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
? ? ? Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync("Hello, World!");
? ? ? mediaElement.SetSource(stream, stream.ContentType);
? ? ? mediaElement.Play();
}
細心的朋友發(fā)現(xiàn)這兩個方法前面都加了關(guān)鍵字“async”,由于方法內(nèi)部的方法使用了async關(guān)鍵字谋作,因此該方法也需要async關(guān)鍵字修飾芋肠,因為才開始學習Win10開發(fā),只知道async的意思是異步調(diào)用遵蚜,但是究竟為什么是異步的操作帖池,而不是像iOS一樣UI相關(guān)的操作都放在主線程中執(zhí)行,還需要以后的學習來解答啦~