如何在xamarin表单中设置MasterDetailPage的宽度

Question

如何在xamarin表单中设置MasterDetailPage的宽度

Art*_*huk 5 c# android ios xamarin xamarin.forms

我正在针对 ios 和 android 的 Xamarin 表单上的应用程序使用 MasterDetailPage。

但是 MasterDetailPage 菜单中的宽度太大，我想调整它。

如何在 Android 和 iOS 上设置 MasterDetailPage 的自定义宽度？

我的 MasterDetailPage 初始化代码：

            MyChatsMasterView _myChatsMasterView;
            MyChatsView _myChatsView;

            public MyChatsMasterDetailView(MyChatsMasterView myChatsMasterView, MyChatsView myChatsView)
            {
                NavigationPage.SetHasNavigationBar(this, false);

                InitializeComponent();
                this.MasterBehavior = MasterBehavior.Popover;

                _myChatsMasterView = myChatsMasterView;
                _myChatsView = myChatsView;

                Master = _myChatsMasterView;
                Detail = _myChatsView;

                _myChatsMasterView.SetDetailView(this);
            }

Run Code Online (Sandbox Code Playgroud)

Answer 1

Mar*_*hel 5

我通过从 Xamarin.Forms 源复制渲染器解决了这个问题。基本上，我需要一个宽度为 400 dp 的母版，以便在其中正确显示日历。

这是我所做的：

共享库

我创建了一个 SplitViewPage，派生自 MasterDetail 页面：

<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="CompApp.Views.SplitViewPage">
    <MasterDetailPage.Master>
        <ContentPage Title=" "/>
    </MasterDetailPage.Master>
    <MasterDetailPage.Detail>
        <ContentPage Title=" "/>
    </MasterDetailPage.Detail>
</MasterDetailPage>

Run Code Online (Sandbox Code Playgroud)

安卓

由于主宽度是内部类“MasterDetailContainer”中的常量，因此我将代码从基类（请参阅此处）复制到名为“DroidMasterDetailContainer.cs”的新类，同时将类可见性从内部更改为公共。

我对代码做了两处修改：

我const int DefaultMasterSize = 320改为const int DefaultMasterSize = 400
我注释掉了该行_childView.ClearValue(Platform.RendererProperty);（第 116 行，void DisposeChildRenderers()因为 Platform.RendererProperty 无法访问

接下来要做的是将 MasterDetailRenderer 的代码（请参阅此处）复制到新类（在我的例子中为“SplitViewPageRenderer.cs”）

using System;
using System.ComponentModel;
using System.Linq;
using System.Threading.Tasks;
using Android.App;
using Android.Content;
using Android.OS;
using Android.Support.V4.Widget;
using Android.Views;
using MyApp.Droid.Renderer;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using Xamarin.Forms.Platform.Android.AppCompat;
using AColor = Android.Graphics.Drawables.ColorDrawable;

using AView = Android.Views.View;

[assembly: ExportRenderer(typeof(SplitViewPage), typeof(SplitViewPageRenderer))]
namespace MyApp.Droid.Renderer
{
public class SplitViewPageRenderer : DrawerLayout, IVisualElementRenderer, DrawerLayout.IDrawerListener
{
    public SplitViewPageRenderer(Context context) : base(context)
    {

    }

    //from Android source code
    const uint DefaultScrimColor = 0x99000000;
    int _currentLockMode = -1;
    DroidMasterDetailContainer _detailLayout;
    bool _isPresentingFromCore;
    DroidMasterDetailContainer _masterLayout;
    MasterDetailPage _page;
    bool _presented;

    [Obsolete("This constructor is obsolete as of version 2.5. Please use MasterDetailRenderer(Context) instead.")]
    public SplitViewPageRenderer() : base(Forms.Context)
    {
    }

    IMasterDetailPageController MasterDetailPageController => _page as IMasterDetailPageController;

    public bool Presented
    {
        get { return _presented; }
        set
        {
            if (value == _presented)
                return;
            UpdateSplitViewLayout();
            _presented = value;
            if (_page.MasterBehavior == MasterBehavior.Default && MasterDetailPageController.ShouldShowSplitMode)
                return;
            if (_presented)
                OpenDrawer(_masterLayout);
            else
                CloseDrawer(_masterLayout);
        }
    }

    IPageController MasterPageController => _page.Master as IPageController;
    IPageController DetailPageController => _page.Detail as IPageController;
    IPageController PageController => Element as IPageController;

    public void OnDrawerClosed(AView drawerView)
    {
    }

    public void OnDrawerOpened(AView drawerView)
    {
    }

    public void OnDrawerSlide(AView drawerView, float slideOffset)
    {
    }

    public void OnDrawerStateChanged(int newState)
    {
        _presented = IsDrawerVisible(_masterLayout);
        UpdateIsPresented();
    }

    public VisualElement Element
    {
        get { return _page; }
    }

    public event EventHandler<VisualElementChangedEventArgs> ElementChanged;

    event EventHandler<PropertyChangedEventArgs> ElementPropertyChanged;
    event EventHandler<PropertyChangedEventArgs> IVisualElementRenderer.ElementPropertyChanged
    {
        add { ElementPropertyChanged += value; }
        remove { ElementPropertyChanged -= value; }
    }

    public SizeRequest GetDesiredSize(int widthConstraint, int heightConstraint)
    {
        Measure(widthConstraint, heightConstraint);
        return new SizeRequest(new Size(MeasuredWidth, MeasuredHeight));
    }

    public void SetElement(VisualElement element)
    {
        MasterDetailPage oldElement = _page;
        _page = element as MasterDetailPage;

        _detailLayout = new DroidMasterDetailContainer(_page, false, Context) { LayoutParameters = new LayoutParams(ViewGroup.LayoutParams.WrapContent, ViewGroup.LayoutParams.WrapContent) };

        _masterLayout = new DroidMasterDetailContainer(_page, true, Context)
        {
            LayoutParameters = new LayoutParams(ViewGroup.LayoutParams.WrapContent, ViewGroup.LayoutParams.WrapContent) { Gravity = (int)GravityFlags.Start }
        };

        AddView(_detailLayout);

        AddView(_masterLayout);

        var activity = Context as Activity;
        activity.ActionBar.SetDisplayShowHomeEnabled(true);
        activity.ActionBar.SetHomeButtonEnabled(true);

        UpdateBackgroundColor(_page);
        UpdateBackgroundImage(_page);

        OnElementChanged(oldElement, element);

        if (oldElement != null)
            ((IMasterDetailPageController)oldElement).BackButtonPressed -= OnBackButtonPressed;

        if (_page != null)
            MasterDetailPageController.BackButtonPressed += OnBackButtonPressed;

        if (Tracker == null)
            Tracker = new VisualElementTracker(this);

        _page.PropertyChanged += HandlePropertyChanged;
        _page.Appearing += MasterDetailPageAppearing;
        _page.Disappearing += MasterDetailPageDisappearing;

        UpdateMaster();
        UpdateDetail();

        Device.Info.PropertyChanged += DeviceInfoPropertyChanged;
        SetGestureState();

        Presented = _page.IsPresented;

        AddDrawerListener(this);

        //if (element != null)
        //  element.SendViewInitialized(this);

        if (element != null && !string.IsNullOrEmpty(element.AutomationId))
            ContentDescription = element.AutomationId;
    }

    public VisualElementTracker Tracker { get; private set; }

    public void UpdateLayout()
    {
        if (Tracker != null)
            Tracker.UpdateLayout();
    }

    public ViewGroup ViewGroup => this;
    AView IVisualElementRenderer.View => this;

    protected override void Dispose(bool disposing)
    {
        if (disposing)
        {
            if (Tracker != null)
            {
                Tracker.Dispose();
                Tracker = null;
            }

            if (_detailLayout != null)
            {
                _detailLayout.Dispose();
                _detailLayout = null;
            }

            if (_masterLayout != null)
            {
                _masterLayout.Dispose();
                _masterLayout = null;
            }

            Device.Info.PropertyChanged -= DeviceInfoPropertyChanged;

            if (_page != null)
            {
                MasterDetailPageController.BackButtonPressed -= OnBackButtonPressed;
                _page.PropertyChanged -= HandlePropertyChanged;
                _page.Appearing -= MasterDetailPageAppearing;
                _page.Disappearing -= MasterDetailPageDisappearing;
                //_page.ClearValue(Platform.RendererProperty);
                _page = null;
            }
        }

        base.Dispose(disposing);
    }

    protected override void OnAttachedToWindow()
    {
        base.OnAttachedToWindow();
        PageController.SendAppearing();
    }

    protected override void OnDetachedFromWindow()
    {
        base.OnDetachedFromWindow();
        PageController.SendDisappearing();
    }

    protected virtual void OnElementChanged(VisualElement oldElement, VisualElement newElement)
    {
        EventHandler<VisualElementChangedEventArgs> changed = ElementChanged;
        if (changed != null)
            changed(this, new VisualElementChangedEventArgs(oldElement, newElement));
    }

    protected override void OnLayout(bool changed, int l, int t, int r, int b)
    {
        base.OnLayout(changed, l, t, r, b);
        //hack to make the split layout handle touches the full width
        if (MasterDetailPageController.ShouldShowSplitMode && _masterLayout != null)
            _masterLayout.Right = r;
    }

    async void DeviceInfoPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        if (e.PropertyName == "CurrentOrientation")
        {
            if (!MasterDetailPageController.ShouldShowSplitMode && Presented)
            {
                MasterDetailPageController.CanChangeIsPresented = true;
                //hack : when the orientation changes and we try to close the Master on Android     
                //sometimes Android picks the width of the screen previous to the rotation      
                //this leaves a little of the master visible, the hack is to delay for 50ms closing the drawer
                await Task.Delay(50);
                CloseDrawer(_masterLayout);
            }
            UpdateSplitViewLayout();
        }
    }

    void HandleMasterPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        //if (e.PropertyName == Page.TitleProperty.PropertyName || e.PropertyName == Page.IconProperty.PropertyName)
            //((Platform)_page.Platform).UpdateMasterDetailToggle(true);
    }

    void HandlePropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        ElementPropertyChanged?.Invoke(this, e);
        if (e.PropertyName == "Master")
            UpdateMaster();
        else if (e.PropertyName == "Detail")
        {
            UpdateDetail();
            //((Platform)_page.Platform).UpdateActionBar();
        }
        else if (e.PropertyName == MasterDetailPage.IsPresentedProperty.PropertyName)
        {
            _isPresentingFromCore = true;
            Presented = _page.IsPresented;
            _isPresentingFromCore = false;
        }
        else if (e.PropertyName == "IsGestureEnabled")
            SetGestureState();
        else if (e.PropertyName == Page.BackgroundImageProperty.PropertyName)
            UpdateBackgroundImage(_page);
        if (e.PropertyName == VisualElement.BackgroundColorProperty.PropertyName)
            UpdateBackgroundColor(_page);
    }

    void MasterDetailPageAppearing(object sender, EventArgs e)
    {
        MasterPageController?.SendAppearing();
        DetailPageController?.SendAppearing();
    }

    void MasterDetailPageDisappearing(object sender, EventArgs e)
    {
        MasterPageController?.SendDisappearing();
        DetailPageController?.SendDisappearing();
    }

    void OnBackButtonPressed(object sender, BackButtonPressedEventArgs backButtonPressedEventArgs)
    {
        if (IsDrawerOpen((int)GravityFlags.Start))
        {
            if (_currentLockMode != LockModeLockedOpen)
            {
                CloseDrawer((int)GravityFlags.Start);
                backButtonPressedEventArgs.Handled = true;
            }
        }
    }

    void SetGestureState()
    {
        SetDrawerLockMode(_page.IsGestureEnabled ? LockModeUnlocked : LockModeLockedClosed);
    }

    void IVisualElementRenderer.SetLabelFor(int? id)
    {
    }

    void SetLockMode(int lockMode)
    {
        if (_currentLockMode != lockMode)
        {
            SetDrawerLockMode(lockMode);
            _currentLockMode = lockMode;
        }
    }

    void UpdateBackgroundColor(Page view)
    {
        if (view.BackgroundColor != Color.Default)
            SetBackgroundColor(view.BackgroundColor.ToAndroid());
    }

    void UpdateBackgroundImage(Page view)
    {
        if (!string.IsNullOrEmpty(view.BackgroundImage))
            this.SetBackground(Context.GetDrawable(view.BackgroundImage));
    }

    void UpdateDetail()
    {
        Context.HideKeyboard(this);
        _detailLayout.ChildView = _page.Detail;
    }

    void UpdateIsPresented()
    {
        if (_isPresentingFromCore)
            return;
        if (Presented != _page.IsPresented)
            ((IElementController)_page).SetValueFromRenderer(MasterDetailPage.IsPresentedProperty, Presented);
    }

    void UpdateMaster()
    {
        if (_masterLayout != null && _masterLayout.ChildView != null)
            _masterLayout.ChildView.PropertyChanged -= HandleMasterPropertyChanged;
        _masterLayout.ChildView = _page.Master;
        if (_page.Master != null)
            _page.Master.PropertyChanged += HandleMasterPropertyChanged;
    }

    void UpdateSplitViewLayout()
    {
        if (Device.Idiom == TargetIdiom.Tablet)
        {
            bool isShowingSplit = MasterDetailPageController.ShouldShowSplitMode
                || (MasterDetailPageController.ShouldShowSplitMode && _page.MasterBehavior != MasterBehavior.Default && _page.IsPresented);
            SetLockMode(isShowingSplit ? LockModeLockedOpen : LockModeUnlocked);
            unchecked
            {
                SetScrimColor(isShowingSplit ? Color.Transparent.ToAndroid() : (int)DefaultScrimColor);
            }
            //((Platform)_page.Platform).UpdateMasterDetailToggle();
        }
    }
}
}

Run Code Online (Sandbox Code Playgroud)

请注意，我们没有使用变量 _masterLayout 和 _detailLayout 的内部类“MasterDetailContainer”，而是使用之前创建的“DroidMasterDetailContainer”。

iOS系统

基本上是相同的故事：获取 MasterDetailRenderer 代码（请参阅此处），创建您自己的类，粘贴代码和一些调整，稍后我们有：

using CompApp.Customs;
using MyApp.iOS.Renderer;
using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
using System.ComponentModel;
using CoreGraphics;
using MyApp.Views;
using UIKit;
using Xamarin.Forms.Internals;
using System.Reflection;

[assembly: ExportRenderer(typeof(SplitViewPage), typeof(SplitViewPageRenderer))]
namespace MyApp.iOS.Renderer
{
public class SplitViewPageRenderer : UISplitViewController, IVisualElementRenderer, IEffectControlProvider
{
    UIViewController _detailController;

    bool _disposed;
    EventTracker _events;
    InnerDelegate _innerDelegate;
    public static nfloat MasterWidth = 400;
    EventedViewController _masterController;

    SplitViewPage _masterDetailPage;

    bool _masterVisible;

    VisualElementTracker _tracker;

    Page PageController => Element as Page;
    Element ElementController => Element as Element;

    protected SplitViewPage MasterDetailPage => _masterDetailPage ?? (_masterDetailPage = (SplitViewPage)Element);

    public VisualElement Element { get; private set; }

    public event EventHandler<VisualElementChangedEventArgs> ElementChanged;

    UIBarButtonItem PresentButton
    {
        get { return _innerDelegate == null ? null : _innerDelegate.PresentButton; }
    }

    public UIView NativeView
    {
        get { return View; }
    }

    protected virtual void OnElementChanged(VisualElementChangedEventArgs e)
    {
        if (e.OldElement != null)
            e.OldElement.PropertyChanged -= HandlePropertyChanged;

        if (e.NewElement != null)
        {
            e.NewElement.PropertyChanged += HandlePropertyChanged;
        }

        if (UIDevice.CurrentDevice.Orientation == UIDeviceOrientation.LandscapeLeft || UIDevice.CurrentDevice.Orientation == UIDeviceOrientation.LandscapeRight)
        {
            PreferredDisplayMode = UISplitViewControllerDisplayMode.AllVisible;
        }
        else if (UIDevice.CurrentDevice.Orientation == UIDeviceOrientation.Portrait || UIDevice.CurrentDevice.Orientation == UIDeviceOrientation.PortraitUpsideDown)
        {
            PreferredDisplayMode = UISplitViewControllerDisplayMode.PrimaryOverlay;
        }

        MasterWidth = 400;
        MasterDetailPage.Master.WidthRequest = 400;

        MasterDetailPage.UpdateMasterBehavior();

        var changed = ElementChanged;
        if (changed != null)
            changed(this, e);

        UpdateControllers();
    }

    public SizeRequest GetDesiredSize(double widthConstraint, double heightConstraint)
    {
        return NativeView.GetSizeRequest(widthConstraint, heightConstraint);
    }

    public void SetElement(VisualElement element)
    {
        var oldElement = Element;
        Element = element;

        ViewControllers = new[] { _masterController = new EventedViewController(), _detailController = new ChildViewController() };

        Delegate = _innerDelegate = new InnerDelegate(MasterDetailPage.MasterBehavior);
        Element.BackgroundColor = Color.Transparent;
        UpdateControllers();

        _masterController.WillAppear += MasterControllerWillAppear;
        _masterController.WillDisappear += MasterControllerWillDisappear;

        PresentsWithGesture = MasterDetailPage.IsGestureEnabled;

        OnElementChanged(new VisualElementChangedEventArgs(oldElement, element));

        EffectUtilities.RegisterEffectControlProvider(this, oldElement, element);

        if (element != null)
        {
            MethodInfo sendViewInitialized = typeof(Xamarin.Forms.Forms).GetMethod("SendViewInitialized", BindingFlags.Static | BindingFlags.NonPublic);
            sendViewInitialized?.Invoke(element, new object[] { element, NativeView });
        }
    }

    public void SetElementSize(Size size)
    {
        Element.Layout(new Rectangle(Element.X, Element.Width, size.Width, size.Height));
    }

    public UIViewController ViewController
    {
        get { return this; }
    }

    public override void ViewDidAppear(bool animated)
    {
        PageController.SendAppearing();
        base.ViewDidAppear(animated);
        ToggleMaster();
    }

    public override void ViewDidDisappear(bool animated)
    {
        base.ViewDidDisappear(animated);
        PageController?.SendDisappearing();
    }

    public override void ViewDidLayoutSubviews()
    {
        if (View.Subviews.Length < 2)
            return;

        var frameBounds = View.Bounds;
        var masterBounds = _masterController.View.Frame;
        var detailsBounds = _detailController.View.Frame;

        nfloat statusBarHeight = UIApplication.SharedApplication.StatusBarFrame.Height;
        masterBounds.Width = 400;
        MasterWidth = (nfloat)Math.Max(MasterWidth, masterBounds.Width);
        if (Xamarin.Forms.Device.Idiom == TargetIdiom.Tablet)
        {
            bool interfaceInLandscape = UIApplication.SharedApplication.StatusBarOrientation == UIInterfaceOrientation.LandscapeLeft || UIApplication.SharedApplication.StatusBarOrientation == UIInterfaceOrientation.LandscapeRight;
            if (UIDevice.CurrentDevice.Orientation == UIDeviceOrientation.LandscapeLeft || UIDevice.CurrentDevice.Orientation == UIDeviceOrientation.LandscapeRight || interfaceInLandscape)
            {
                detailsBounds.X = 400;
                detailsBounds.Width = frameBounds.Width - 400;
            }
            else
            {
                detailsBounds.X = 0;
                detailsBounds.Width = frameBounds.Width;
            }
            _detailController.View.Frame = detailsBounds;
            _masterController.View.Frame = new CGRect(masterBounds.X, masterBounds.Y, masterBounds.Width, masterBounds.Height);
            if (!masterBounds.IsEmpty)
            {
                MasterDetailPage.MasterBounds = new Rectangle(masterBounds.X, masterBounds.Y, masterBounds.Width, masterBounds.Height);

Answer 2

Art*_*huk 2

目前我们无法调整 MasterDetailPage详细信息的宽度

归档时间：	9 年，4 月前
查看次数：	5955 次
最近记录：	7 年，10 月前