建立練習專案
- 首先,我們使用 Prism Template Pack (現在使用的 2.0.9 版本)建立起一個 Xamarin.Forms 開發專案
- 我們需要建立一個 TabbedPage 頁面,我們把它命名為 MainTabbedPage,在這個頁面 View 與頁面檢視 ViewModel 中,我們不需要做任何特別處理。
- 另外,因為我們需要有許多標籤頁次需要顯示,因此,我們需要建立出五個 ContentPage,所以,我們產生出五個 ContentPage,分別名稱為 Page1, Page2, Page3, Page4, Page21。
- 接下來,我們需要分別將這五個 ContentPage 的 View 和 ViewModel 進行設計
-
MainTabbedPage 的 View 內容
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="XFTabbed2.Views.MainTabbedPage">
</TabbedPage>
Page1 的 View 內容
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="XFTabbed2.Views.Page1"
Title="{Binding Title}"
BackgroundColor="LightBlue">
<StackLayout
>
<Button
Text="Go Page21"
Command="{Binding GoNextCommand}"/>
</StackLayout>
</ContentPage>
Page1ViewModel 的 ViewModel 程式碼
using Prism.Commands;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Linq;
namespace XFTabbed2.ViewModels
{
using System.ComponentModel;
using Prism.Events;
using Prism.Navigation;
using Prism.Services;
public class Page1ViewModel : INotifyPropertyChanged, INavigationAware
{
public event PropertyChangedEventHandler PropertyChanged;
public string Title { get; set; }
private readonly INavigationService _navigationService;
public DelegateCommand GoNextCommand { get; set; }
public Page1ViewModel(INavigationService navigationService)
{
_navigationService = navigationService;
Title = "頁面 1";
GoNextCommand = new DelegateCommand(() =>
{
_navigationService.NavigateAsync("Page21");
});
}
public void OnNavigatedFrom(NavigationParameters parameters)
{
}
public void OnNavigatingTo(NavigationParameters parameters)
{
}
public void OnNavigatedTo(NavigationParameters parameters)
{
}
}
}
Page2 的 View 內容
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="XFTabbed2.Views.Page2"
Title="{Binding Title}"
BackgroundColor="LightGoldenrodYellow">
<StackLayout
>
<Button
Text="Go Page21"
Command="{Binding GoNextCommand}"/>
</StackLayout>
</ContentPage>
Page2ViewModel 的 ViewModel 程式碼
using Prism.Commands;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Linq;
namespace XFTabbed2.ViewModels
{
using System.ComponentModel;
using Prism.Events;
using Prism.Navigation;
using Prism.Services;
public class Page2ViewModel : INotifyPropertyChanged, INavigationAware
{
public event PropertyChangedEventHandler PropertyChanged;
public string Title { get; set; }
private readonly INavigationService _navigationService;
public DelegateCommand GoNextCommand { get; set; }
public Page2ViewModel(INavigationService navigationService)
{
_navigationService = navigationService;
Title = "頁面 2";
GoNextCommand = new DelegateCommand(() =>
{
_navigationService.NavigateAsync("Page21");
});
}
public void OnNavigatedFrom(NavigationParameters parameters)
{
}
public void OnNavigatingTo(NavigationParameters parameters)
{
}
public void OnNavigatedTo(NavigationParameters parameters)
{
}
}
}
Page21 的 View 內容
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="XFTabbed2.Views.Page21"
Title="{Binding Title}"
BackgroundColor="LightPink">
</ContentPage>
Page21ViewModel 的 ViewModel 程式碼
using Prism.Commands;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Linq;
namespace XFTabbed2.ViewModels
{
using System.ComponentModel;
using Prism.Events;
using Prism.Navigation;
using Prism.Services;
public class Page21ViewModel : INotifyPropertyChanged, INavigationAware
{
public event PropertyChangedEventHandler PropertyChanged;
public string Title { get; set; }
private readonly INavigationService _navigationService;
public Page21ViewModel(INavigationService navigationService)
{
_navigationService = navigationService;
Title = "頁面 21";
}
public void OnNavigatedFrom(NavigationParameters parameters)
{
}
public void OnNavigatingTo(NavigationParameters parameters)
{
}
public void OnNavigatedTo(NavigationParameters parameters)
{
}
}
}
Page3 的 View 內容
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="XFTabbed2.Views.Page3"
Title="{Binding Title}"
BackgroundColor="LightSalmon">
</ContentPage>
Page3ViewModel 的 ViewModel 程式碼
using Prism.Commands;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Linq;
namespace XFTabbed2.ViewModels
{
using System.ComponentModel;
using Prism.Events;
using Prism.Navigation;
using Prism.Services;
public class Page3ViewModel : INotifyPropertyChanged, INavigationAware
{
public event PropertyChangedEventHandler PropertyChanged;
public string Title { get; set; }
private readonly INavigationService _navigationService;
public Page3ViewModel(INavigationService navigationService)
{
_navigationService = navigationService;
Title = "頁面 3";
}
public void OnNavigatedFrom(NavigationParameters parameters)
{
}
public void OnNavigatingTo(NavigationParameters parameters)
{
}
public void OnNavigatedTo(NavigationParameters parameters)
{
}
}
}
Page4 的 View 內容
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="XFTabbed2.Views.Page4"
Title="{Binding Title}"
BackgroundColor="LightSteelBlue">
</ContentPage>
Page4ViewModel 的 ViewModel 程式碼
using Prism.Commands;
using Prism.Mvvm;
using System;
using System.Collections.Generic;
using System.Linq;
namespace XFTabbed2.ViewModels
{
using System.ComponentModel;
using Prism.Events;
using Prism.Navigation;
using Prism.Services;
public class Page4ViewModel : INotifyPropertyChanged, INavigationAware
{
public event PropertyChangedEventHandler PropertyChanged;
public string Title { get; set; }
private readonly INavigationService _navigationService;
public Page4ViewModel(INavigationService navigationService)
{
_navigationService = navigationService;
Title = "頁面 4";
}
public void OnNavigatedFrom(NavigationParameters parameters)
{
}
public void OnNavigatingTo(NavigationParameters parameters)
{
}
public void OnNavigatedTo(NavigationParameters parameters)
{
}
}
}
今天收到學員提問的問題,發現到若您沒有做些調整,當您要把 Xamarin.Forms 的 APK 佈署檔案上傳到 Google Play 時候,會得到底下錯誤訊息