Xamarin.Forms - 如何实现45度。斜角背景颜色 [英] Xamarin.Forms - How To Achieve 45 deg. Angled Background Color

问题描述

使用Xamarin.Forms，我怎么会实现以下角度的背景，而无需使用图像：

Using Xamarin.Forms, how would I achieve the following angled background without using an image:

推荐答案

在下面的例子中，标签屏幕背后的半透明盒的纯蓝色部分是的NControl ，也可以做渐变，简单的动画，等等...但在这种情况下，只是一个坚实的多边形由半transperent矩形中得出：

A 100% Xamarin.Forms with no "custom renderer" involved solution:

In the example below, the solid blue portion of the semi-transparent box behind the Labels on the screen is a NControl, you can also do gradients, simple animations, etc... but in this case just a solid polygon is being drawn within a semi-transperent rectangle:

使用 NGraphics 通过的NControl 您可以在 Xamarin.Forms 没有自定义渲染。这不是在每个用例的解决方案，但它的清洁和作品跨平台（iOS / Android版/ WinPhone）。

Using NGraphics via NControl you can do a lot in terms of drawing custom controls in Xamarin.Forms without custom renderers. It is not a solution in every use-case, but its clean and works cross-platform (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设置，所以你可以看到控制较好：

Rendered in Red with a heavier alpha setting so you can see the control better:

此控件嵌入在 AbsoluteLayout 使用动态范围因此即使方向变化处理干净：

This control is embedded in an AbsoluteLayout that uses dynamic bounds so even orientation changes are handled cleanly:

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

这篇关于Xamarin.Forms - 如何实现45度。斜角背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！