在 Xamarin.forms 中减少 UWP MasterDetailPage Master 的宽度

Question

我创建了一个 Xamarin 应用程序，我需要减少主从页面的主控宽度。我遵循了一种方法来创建特定于 UWP 的自定义渲染器。下面是我的代码：

 [assembly: ExportRenderer(typeof(Xamarin.Forms.MasterDetailPage), typeof(CustomMasterDetailRenderer))]
    namespace VirtusContactManager.App.UWP.Renderer
    {
        public class CustomMasterDetailRenderer : VisualElementRenderer<Xamarin.Forms.MasterDetailPage, MasterDetailControl>
        {
            MasterDetailControl control = new MasterDetailControl();
            protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.MasterDetailPage> e)
            {
                base.OnElementChanged(e);
                control.Width = 120;
                SetNativeControl(control);
            }
            protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
            {
                control.Width = 120;
            }
        }
    }

我已经创建了上面的自定义渲染器。我面临的问题是我无法设置 control.Master 的值，因为它是一个 FrameworkElement 而我想要的是一个页面。
control.Width 设置整个页面的宽度，而不仅仅是主页的宽度。

我应该如何设置control.Master到一个页面。
如果这个方法不正确，请提出一个更好的方法来减少宽度UWP 中的母版页。

Answer 1

当我们查看 Xamarin Forms 本身中使用的 MasterDetailRenderer 时，您会看到呈现的实际控件是 MasterDetailControl ( https://github.com/xamarin/Xamarin.Forms/blob/365a60e745d447992e870dd6272226e6b11ec275/Xamarin.Forms.Platform.UAP/MasterDetailControl.cs ) 类型之一。

我们在这里面临的问题是，更改 Master 部分大小的实际属性无法访问，因为我们无法访问 [=12= 中的 SplitView 控件]. 通常你应该使用 OpenPaneLenght 属性来调整大小（ https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.splitview.openpanelength#Windows_UI_Xaml_Controls_SplitView_OpenPaneLength ）。

但是！您可以做的是在用于 MasterDetailControl 的模板中设置属性！如果您在应用级别提供自己的模板，XAML 将覆盖任何模板。

因此，从 MasterDetailControlStyle ( https://github.com/xamarin/Xamarin.Forms/blob/365a60e745d447992e870dd6272226e6b11ec275/Xamarin.Forms.Platform.UAP/MasterDetailControlStyle.xaml ) 复制粘贴 XAML 并将其粘贴到 UWP 项目的 App.Xaml 中的 ResourceDictionary 标记内. 最后要做的是为 SplitView 控件的 OpenPaneLength 属性添加一个值。

就像这样 - 我在这里将其设置为 10 作为示例以表明它有效：

<Application
    x:Class="XFMasterDetailUWP.UWP.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:XFMasterDetailUWP.UWP"
    xmlns:uwp="using:Xamarin.Forms.Platform.UWP"
    RequestedTheme="Light">
    <Application.Resources>
        <ResourceDictionary>
            <Style TargetType="uwp:MasterDetailControl">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="uwp:MasterDetailControl">
                            <SplitView x:Name="SplitView"
                                       OpenPaneLength="10"
                                       IsPaneOpen="{Binding IsPaneOpen,RelativeSource={RelativeSource TemplatedParent},Mode=TwoWay}" DisplayMode="Overlay">
                                <SplitView.Pane>

在 Xamarin.forms 中减少 UWP MasterDetailPage Master 的宽度

Reduce the width of Master of the MasterDetailPage for UWP in Xamarin.forms

c#

.net

xamarin.forms

xamarin.uwp

custom-renderer