Xamarin.forms 在安卓上形成的框架渐变背景溢出其边界

我用Xamarin.Forms做了一个定制的框架，它允许3色线性渐变和其他一些东西。但是，我注意到，当我在网格内部的自定义帧上设置渐变时，它将在它上面的所有对象上绘制渐变。见下文：

然而，如果我只是将背景设置为粉色等纯色（即不使用渐变功能），则帧不会溢出。见下文：

以下是我用于Android的自定义渲染器的代码：

 protected override void DispatchDraw(Canvas canvas)
    {
        var gradient = new Android.Graphics.LinearGradient(
            0, 0, Width, Height,
            new int[] { _startColor.ToAndroid(), _middleColor.ToAndroid(), _endColor.ToAndroid() },
            null,
            Android.Graphics.Shader.TileMode.Mirror);
        var paint = new Android.Graphics.Paint()
        {
            Dither = true,
        };
        paint.SetShader(gradient);
        canvas.DrawPaint(paint);
        base.DispatchDraw(canvas);
    }

    protected override void OnElementChanged(ElementChangedEventArgs<Frame> e)
    {
        base.OnElementChanged(e);
        if(e.NewElement != null && Control != null && e.NewElement is CustomFrame frame)
        {
            _startColor = frame.StartColor;
            _middleColor = frame.MiddleColor;
            _endColor = frame.EndColor;
        }
    }

protected override void DispatchDraw（画布）
{
var gradient=new Android.Graphics.LinearGradient(
0，0，宽度，高度，
新int[]{u startColor.ToAndroid（），\u middleColor.ToAndroid（），\u endColor.ToAndroid（）}，
无效的
Android.Graphics.Shader.TileMode.Mirror）；
var paint=new Android.Graphics.paint（）
{
抖动=正确，
};
油漆.固色剂（梯度）；
帆布.拉丝漆（油漆）；
base.DispatchDraw（画布）；
}
受保护的覆盖无效OnElementChanged（ElementChangedEventArgs e）
{
基础。一个要素发生变化（e）；
如果（e.NewElement！=null&&Control！=null&&e.NewElement为CustomFrame）
{
_startColor=frame.startColor；
_middleColor=frame.middleColor；
_endColor=frame.endColor；
}
}

有没有可能，我将x和y的线性梯度设置为0,0，这不是指控件的x和y，而是指整个屏幕的x和y

下面是xaml的大致示例，如果您需要它：

    <Grid RowSpacing="0"
              ColumnSpacing="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="25*"/>
                <RowDefinition Height="10*"/>
                <RowDefinition Height="40*"/>
                <RowDefinition Height="10*"/>
                <RowDefinition Height="40*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Grid x:Name="header"
                  HorizontalOptions="Center"
                  VerticalOptions="CenterAndExpand"
                  Grid.Row="0"
                  Grid.ColumnSpan="4"
                  RowSpacing="0"
                  BackgroundColor="White">
                <CarouselView ItemsSource=""
                              CurrentItem=""
                              VerticalOptions="CenterAndExpand"
                              HorizontalOptions="Center"
                              PeekAreaInsets="30"
                              x:Name="dayCarousel">
                    <CarouselView.ItemsLayout>
                        <LinearItemsLayout Orientation="Horizontal"
                                           SnapPointsAlignment="Center"
                                           SnapPointsType="MandatorySingle"/>
                    </CarouselView.ItemsLayout>
                    <CarouselView.ItemTemplate>
                        <DataTemplate>
                            <ContentView>
                                <StackLayout VerticalOptions="CenterAndExpand"
                                             HorizontalOptions="Center"
                                             BackgroundColor="White">
                                    <StackLayout.Triggers>
                                        <DataTrigger TargetType="StackLayout"
                                                         Binding="{Binding IsSelected}"
                                                         Value="False">
                                            <Setter Property="Scale"
                                                        Value="0.85"/>
                                            <Setter Property="Opacity"
                                                        Value="0.60"/>
                                        </DataTrigger>
                                    </StackLayout.Triggers>
                                </StackLayout>
                            </ContentView>
                        </DataTemplate>
                    </CarouselView.ItemTemplate>
                </CarouselView>
            </Grid>
            <cntrl:CustomFrame CornerRadius="20,20,0,0"
                               Grid.Row="1"
                               Grid.Column="2"
                               StartColor="{StaticResource GracePink}"
                               MiddleColor="{StaticResource GracePurple}"
                               EndColor="{StaticResource GraceDarkPurple}">
            </cntrl:CustomFrame>

            <cntrl:CustomFrame CornerRadius="40,40,0,0"
                               Grid.Row="2"
                               Grid.RowSpan="3"
                               Grid.ColumnSpan="4"
                               StartColor="{StaticResource GracePink}"
                               MiddleColor="{StaticResource GracePurple}"
                               EndColor="{StaticResource GraceDarkPurple}">
            </cntrl:CustomFrame>


            <cntrl:CustomFrame BackgroundColor="White"
                               CornerRadius="20,20,0,0"
                               Grid.Row="3"
                               Grid.Column="1">
            </cntrl:CustomFrame>
            <cntrl:CustomFrame BackgroundColor="White"
                               Grid.Row="4"
                               CornerRadius="40,40,0,0"
                               Grid.ColumnSpan="4">
            </cntrl:CustomFrame>
</Grid>

---

任何帮助都将不胜感激，提前谢谢

在自定义帧中，设置

IsClippedToBounds=“True”

引述：

获取或设置一个值，该值确定布局是否应将其子级剪裁到其边界

---

然后，您执行CustomRender的方式似乎正在影响帧检测其孩子边界的能力。。另外，我刚刚记得有一个很好的插件用于这种渐变布局，请查看：@JonathanCook我对我的anwser进行了编辑，尝试在你的OneElementChanged中进行验证，看看它是否解决了你的问题，如果没有，我就不知道该怎么做了！非常感谢。现在我需要弄清楚如何得到两帧上的梯度来匹配哈哈，但这是一个不同的问题。

<cntrl:CustomFrame CornerRadius="20,20,0,0"
                   Grid.Row="1"
                   Grid.Column="2"
                   IsClippedToBounds="True"
                   StartColor="{StaticResource GracePink}"
                   MiddleColor="{StaticResource GracePurple}"
                   EndColor="{StaticResource GraceDarkPurple}">
</cntrl:CustomFrame>

try
{
    if (e.NewElement != null && Control != null && e.NewElement is CustomFrame frame)
    {
        _startColor = frame.StartColor;
        _middleColor = frame.MiddleColor;
        _endColor = frame.EndColor;

        var orientation = GradientDrawable.Orientation.ToBottomRight;
        var gradient = new GradientDrawable(orientation, new[] { _startColor .ToAndroid().ToArgb(), _middleColor.ToAndroid().ToArgb(), _endColor .ToAndroid().ToArgb() });
        ViewCompat.SetBackground(this, gradient);
    }
}
catch (Exception ex)
{

}