黑皮考町

本篇文章簡單介紹UWP MVVM 如何在view中使用view以外的資源(以加入Converter 為例) 假設view上有個 Image 元件, 它的Visibility屬性被綁定在MyViewModel.IsHide 這個Property上, <Image Margin= "200,200,0,0" MaxWidth= "50" MaxHeight= "50" HorizontalAlignment= "Center" VerticalAlignment= "Center" Source= "ms-appx:///Assets/googleIcon.png" Visibility= "{Binding IsHide, Mode=OneWay}" /> 為了提升可讀性, 我們將 MyViewModel.IsHide 宣告成布林型別, 但由於 Visibility 屬性只能接受整數型別, 所以我們需要多做一個Converter 來轉換成UI上需要的值 public class BoolToIntConvert : IValueConverter { public object Convert ( object value , Type targetType, object parameter, string language) { return ( bool ) value == true ? Visibility.Collapsed : Visibility.Visible; } public object ConvertBack ( object value , Type targetType, object parameter, string language) { t...

前言: 上一篇文章" 使用UWP 設計 MVVM 軟體架構(一)  " , 我們以電影清單程式, 簡單地表示MVVM的架構及實作方法, 程式中View會把所有的電影資訊顯示在螢幕上, 但若現在我們想要再加一個功能, 讓使用者點擊ListBox上的Item(Movie)時, 頁面能夠導向另一個View去顯示詳細的電影資訊, 那我們該如何實作? 以下就是說明, 如何使用NavigationService來幫助我們去切換每個View元件, 基本上有幾個步驟 修改App.cs 建立ViewModel, MovieDetailViewModel 建立View, MovieDetailView 修改MovieDetailView 修改MovieListViewModel 修改MovieListView 前置作業 在開始動工之前我們先在Common的資料夾裡加入以下的類別 INavigationService.cs NavigationService.cs NavigationHelper.cs SuspensionManager.cs 修改App.xaml.cs 我們在這邊宣告NavigationService的靜態變數方便將來使用 建立MovieDetailViewModel 為了簡化範例, 基本上這個ViewModel沒什麼特別功能, 單純就是開放Movie的Model讓View做Data Binding而已 將MovieDetailViewModel的實體加到ViewModelLocator裡 建立MovieDetailView 這邊我們建立一個全新的View Page顯示電影名稱, 電影價錢 修改MovieDetailView.xaml.cs 處理頁面轉換 實作NavigationHelper.LoadState事件, 處理當頁面被載入時的動作, 讓MovieListView傳過來的Model能設定給MovieDetailViewModel 修改MovieListViewModel 加入一個新的方法, 提供ListBox 上點擊Item時的事件處理邏輯 主要是去呼叫NavigationService做頁面切換 修改...

前言: 什麼是MVVM? 簡單的說他是由 Model, ViewModel, 和View 所構成的軟體架構 Model, 指的是我們用來存放資料的類別, 除此之外, 商業邏輯也會被封裝在裡面, 他只負責處理跟資料有關的行為  ViewModel, 作為整個架構的中間層, 負責提供View需要的資料 View, 架構中負責呈現介面的元件 會有這個概念, 一開始是為了避免View當中存在太多的商業邏輯使得程式碼變得很難trace 或是維護, 所以我們把關於資料實體的商業邏輯還有資訊都封裝在一個類別後抽出來成為一個Model. 然而這樣的程式碼還是不夠乾淨, 因為View 和  Model 之間的相依性, 會出現當Model一改View就要跟著改得情況, 所以最後我們在View和Model之間多了一層ViewModel的類別, 負責提供或轉換適當的資料給View, 以降低View和Model之間的相依性 以下是個簡單的範例, 說明如何在UWP的專案中設計出MVVM的軟體架構 這個範例是一個顯示電影清單的程式, 基本上有幾個步驟 建立一個新專案 設計Model,  我們會有個Movie類別, 來表示電影的名稱以及價錢 設計ViewModel, 我們會有個 MovieViewModel的類別, 提供適當的 Movie 資料給View使用 設計View, 我們會簡單的加入ListBox來呈現電影清單, 以及一個Button來刪除畫面上的所有電影 第一步：建立專案 選擇C#>Windows Universal>Blank App 第二步：設計Model 首先建立Models的資料夾 之後在裡面建立一個新類別Movie 繼承並實作介面INotifyPropertyChanged, 如下 建立資料夾Data, 之後再這個資料夾裡面建立一個FakeDatabase的類別 這是一個假的資料庫用來提供電影資料給ViewModel, 實際上我們是把資料寫在外部的XML中 第三步, 建立 ViewModel 建立一個ViewModelBase的類別 用來作為所有ViewModel的基底並且繼承INotifyProper...