sgunji’s blog

ものづくりやプログラミングなど…最近はXamarinを少々

Xamarin.FormsのMasterDetailPageのテンプレートについて

Xamarinのテンプレートを見ているとデフォルトでDetailPageを発見!

PCLプロジェクトを右クリックして,【新しい項目を追加】から
f:id:sgunji:20170325130719p:plain

適当に名前を付けて追加しますと,必要なものが勝手にできてしまう!!

  • (適当につけた名前).xaml
  • (適当につけた名前)Detail.xaml
  • (適当につけた名前)Master.xaml
  • (適当につけた名前)MenuItem.cs

が自動生成されます。

f:id:sgunji:20170325131115p:plain

App.Xaml.csを修正して,

public App()
{
     InitializeComponent();
     //MainPage = new NavigationPage( new App8_PCL.MainPage());
     MainPage = new DetailPage1();
}

ビルドすると・・・

CS0101エラーが発生し,名前空間が重複しているといわれます。

下記リンクによると,これはテンプレートのバグらしい。

forums.xamarin.com

優秀な世界のプログラマーに従って修正が必要です。

まず,作成された

  • DetailPage1.xaml.cs
  • DetailPage1Detail.xaml.cs
  • DetailPage1Master.xaml.cs
  • DetailPage1MenuItem.cs

名前空間を直します。

それぞれのソースの名前空間
(プロジェクト名).(適当につけた名前)
となっているので,
(プロジェクト名)のみに直します。

修正前・・・

namespace (プロジェクト名).DetailPage1

修正後・・・

namespace (プロジェクト名)

また,.DetailPage1Master.xaml.cs

class DetailPage1MasterViewModel : INotifyPropertyChanged
{
   public ObservableCollection<DetailPage1MenuItem> MenuItems { get; }
   public DetailPage1MasterViewModel()
   {
      DetailPage1MenuItems = new ObservableCollection<DetailPage1MenuItem>(new[]
      {
          new DetailPage1MenuItem { Id = 0, Title = "Page 1" },
          new DetailPage1MenuItem { Id = 1, Title = "Page 2" },
          new DetailPage1MenuItem { Id = 2, Title = "Page 3" },
          new DetailPage1MenuItem { Id = 3, Title = "Page 4" },
          new DetailPage1MenuItem { Id = 4, Title = "Page 5" },
          });
      }
      public event PropertyChangedEventHandler PropertyChanged;
      void OnPropertyChanged([CallerMemberName]string propertyName = "") =>
          PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));


}

の部分の

DetailPage1MenuItems = new ObservableCollection<DetailPage1MenuItem>(new[]{...}

ObservableCollection<DetailPage1MenuItem> DetailPage1MenuItems = new ObservableCollection<DetailPage1MenuItem>(new[]{...}

に修正します。

これで修正完了です。
ビルドしてみましょう。

f:id:sgunji:20170325135607g:plain

ただし,このままだとAndroid版はbackキーを押したときエラーで落ちます。

forums.xamarin.com

Xamarin.Formsのバージョンを2.3.4系に上げるといいようなので,
一番(投稿時)新しいのは2.3.4.214-pre5なので,これをインストール
ソリューションをクリーンした後,ビルドするとbackキーエラーも回避できるようです。