Xamarin.Forms - 如何实现 45 度。倾斜背景颜色

Question

使用 Xamarin.Forms，如何在不使用图像的情况下实现以下有角度的背景:

Answer 1

没有“自定义渲染器”的 100% Xamarin.Forms 解决方案:

在下面的例子中，屏幕上Labels后面的半透明框的纯蓝色部分是一个NControl，你还可以做渐变、简单的动画等等...但在这种情况下，仅在半透明矩形内绘制实心多边形:

通过 NControl 使用 NGraphics，您可以在 Xamarin.Forms 中绘制自定义控件，而无需自定义渲染器。它并不是适用于所有用例的解决方案，但它干净且可跨平台工作(iOS/Android/WinPhone)。

var overlay = new NControlView()
{
    BackgroundColor = Xamarin.Forms.Color.Black.MultiplyAlpha(.3f),
    DrawingFunction = (canvas, rect) =>
    {
        canvas.FillPath(new PathOp[] {
            new MoveTo (NGraphics.Point.Zero),
            new LineTo ((rect.Width / 3), 0),
            new LineTo ((rect.Width / 3) * 2, rect.Height),
            new LineTo (0, rect.Height),
            new ClosePath ()
        }, Colors.Blue);
    }
};

使用较重的 Alpha 设置以红色渲染，以便您可以更好地看到控件:

此控件嵌入在使用动态边界的 AbsoluteLayout 中，因此即使方向更改也能干净地处理:

AbsoluteLayout.SetLayoutFlags(overlay, AbsoluteLayoutFlags.All);
AbsoluteLayout.SetLayoutBounds(overlay, new Xamarin.Forms.Rectangle(0, 1, 1, 0.3));

• https://github.com/praeclarum/NGraphics

• https://github.com/chrfalch/NControl