画布视图不填充相对布局 (XAML)答案

【问题标题】：Canvas view does not fill relative layout (XAML)画布视图不填充相对布局 (XAML)
【发布时间】：2019-09-07 20:38:54
【问题描述】：

我在相对布局（Xamarin Forms 项目）中有一个 SkiaSharp 画布视图。当我单独使用画布时，它会填满整个页面。但是当我在相对布局中使用它时，它并没有填满相对布局的整个空间。如何让画布填满整个相对布局？

XAML

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:MyHomeScreen2"
             xmlns:views="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
             x:Class="MyHomeScreen2.MainPage">

    <RelativeLayout BackgroundColor="Yellow">

        <views:SKCanvasView PaintSurface="OnSecondPainting" EnableTouchEvents="True" x:Name="MyCanvas"

              RelativeLayout.XConstraint=
                 "{ConstraintExpression Type=RelativeToParent, 
                                        Property=X,
                                        Constant=0}"

             RelativeLayout.YConstraint=
                 "{ConstraintExpression Type=RelativeToParent,
                                        Property=Y, 
                                        Constant=0}">
        </views:SKCanvasView>

        <BoxView Color="Blue"
            WidthRequest="100" 
            HeightRequest="50"
           RelativeLayout.XConstraint=
                 "{ConstraintExpression Type=RelativeToView, 
                                        Property=Width,
                                        ElementName=MyCanvas,
                                        Factor=0.5}"

             RelativeLayout.YConstraint=
                 "{ConstraintExpression Type=RelativeToView,
                                        Property=Y, 
                                        ElementName=MyCanvas,
                                        Constant=25}" />


    </RelativeLayout>
</ContentPage>

【问题讨论】：

您设置了画布 X 和 Y 约束，但没有设置宽度和高度
将其设置为相对于父宽度和高度的因子 1
如果解决了，我可以把它作为答案吗？ :-) 为了使盒子居中，我通常使用后面的代码，因为您需要知道盒子的大小，而我不知道如何在 xaml 中做到这一点。这可以接受吗？
你的蓝框是固定大小还是必须在纵向和横向模式下翻转？
那我需要详细信息。如果它需要翻转，你有固定的尺寸还是必须拉伸。所以请在这里创建关于中心的问题并发布链接，以便我找到它

标签： xamarin xamarin.forms

【解决方案1】：

Canvas 指定 X 和 Y 约束，但不指定宽度和高度。它们应该相对于父级设置，因子为 1

XAML

    <views:SKCanvasView PaintSurface="OnSecondPainting" EnableTouchEvents="True" x:Name="MyCanvas"

          RelativeLayout.XConstraint=
             "{ConstraintExpression Type=RelativeToParent, 
                                    Property=X,
                                    Constant=0}"

         RelativeLayout.YConstraint=
             "{ConstraintExpression Type=RelativeToParent,
                                    Property=Y, 
                                    Constant=0}"
         RelativeLayout.HeightConstraint = 
                    "{ConstraintExpression Type=RelativeToParent,
                                           Property=Height,
                                           Factor=1}"

         RelativeLayout.WidthConstraint = 
                    "{ConstraintExpression Type=RelativeToParent,
                                           Property=Width,
                                           Factor=1}"                            

                        >
    </views:SKCanvasView>

【讨论】：