読者です 読者をやめる 読者になる 読者になる

SIN@SAPPOROWORKSの覚書

C#を中心に、夜な夜な試行錯誤したコードの記録です。

Xamarin.Forms MasterBehaviorについて

【 Xamarin 記事一覧 】

MasterBehavior

MasterBehaviorとは、Xamarin.Forms 1.3で、MasterDetailPageに新しく追加されたプロパティです。

f:id:furuya02:20150422012224p:plain

このプロパティは、列挙型になっており、Masterページ(通常メニュー的に左側に表示されるビュー)の隠れ具合を制御しています。
f:id:furuya02:20150422012250p:plain

  • Split  常時表示
  • f:id:furuya02:20150422012255p:plain
  • Popover 隠れる
  • f:id:furuya02:20150422012300p:plain
  • SplitOnPortrait 縦の時、常時表示
  • f:id:furuya02:20150422012304p:plain
  • SplitOnLandscape 横の時、常時表示
  • f:id:furuya02:20150422012308p:plain
  • Default(SplitOnLandscapeと同じ)
  • f:id:furuya02:20150422012312p:plain

なお、このオプションは、iPadなど大きなディスプレイの端末の時だけ機能し、iPhoneの場合は、常に隠れる動作(MasterBehavior.Popoverと同等)となります。
また、Ver1.3では、ちょっとバグがあるような記載があったのVer1.4で動作確認しました。

PM> Get-Package
Id                             Version              Description/Release Notes                                
--                             -------              -------------------------                                
WPtoolkit                      4.2013.08.16         Windows Phone toolkit provides ...
Xamarin.Android.Support.v4     19.0.2               C# bindings for android support library v4.
Xamarin.Forms                  1.4.2.6355           Build native UIs for iOS, Android, and Windows Phone ..

動作

Popover

メニューが隠れる動作は、つぎのような感じです。
f:id:furuya02:20150422012318g:plain

Slpit

メニューが常時表示する動作は、つぎのような感じです。
f:id:furuya02:20150422012336g:plain

コード

使用したコードを参考までに

using System;
using System.Linq;
using Xamarin.Forms;

namespace App1{
    public class App : Application{
        public App(){
            MainPage = new MyPage();
        }

        protected override void OnStart(){}

        protected override void OnSleep(){}

        protected override void OnResume(){}
    }

    class MyPage : MasterDetailPage{
        public MyPage() {

            MasterBehavior = MasterBehavior.Split;
            
            var ar = Enumerable.Range(0, 20).Select(n => "Items-" + n).ToList();
            var listView = new ListView {
                ItemsSource = ar,
                BackgroundColor = Color.Transparent,
            };
            listView.ItemSelected += (s, a) => SetDetailPage(a.SelectedItem.ToString());

            Master = new ContentPage{
                BackgroundColor = Color.Teal,
                Title = "TEST",//Maserページでは、Titleが設定されていないと動作できない
                Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0),
                Content = listView,
            };
            SetDetailPage(ar[0]);
        }

        void SetDetailPage(string title) {
            Detail = new NavigationPage(new DetailPage(title)){
                BarBackgroundColor = Color.Silver,//上部の背景色
            };
            try{ //MasterBehavior.Split等でIsPresentedをfalseにしようとすると例外となる
                IsPresented = false;
            }catch (Exception ex) {
                DisplayAlert("Exception",ex.Message, "OK");
            }
        }
    }

    class DetailPage : ContentPage{
        public DetailPage(string title){
            Content = new Label{
                Text = title,
                HorizontalOptions = LayoutOptions.Center,
                VerticalOptions = LayoutOptions.Center
            };
        }
    }
}

【 Xamarin 記事一覧 】