[英]Xamarin.Forms - How To Achieve 45 deg. Angled Background Color
Xamarin.Forms
with no "custom renderer" involved solution: 没有“自定义渲染器”的100% Xamarin.Forms
涉及解决方案: 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: 在下面的示例中,屏幕上Labels
后面的半透明框的实心蓝色部分是NControl
,您还可以执行渐变,简单动画等...但在这种情况下,只是在内部绘制一个实心多边形一个半透明的矩形:
Using NGraphics
via NControl
you can do a lot in terms of drawing custom controls in Xamarin.Forms
without custom renderers. 通过NGraphics
使用NControl
您可以在不使用自定义渲染器的Xamarin.Forms
中绘制自定义控件方面做很多事情。 It is not a solution in every use-case, but its clean and works cross-platform (iOS/Android/WinPhone). 它不是每个用例的解决方案,但它干净且可以跨平台工作(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);
}
};
Rendered in Red
with a heavier alpha setting so you can see the control better: 使用较重的alpha设置呈现Red
,以便您可以更好地查看控件:
This control is embedded in an AbsoluteLayout
that uses dynamic bounds so even orientation changes are handled cleanly: 此控件嵌入在使用动态边界的AbsoluteLayout
,因此即使方向更改也可以干净地处理:
AbsoluteLayout.SetLayoutFlags(overlay, AbsoluteLayoutFlags.All);
AbsoluteLayout.SetLayoutBounds(overlay, new Xamarin.Forms.Rectangle(0, 1, 1, 0.3));
There is no way to define a gradient in Xamarin Forms. 无法在Xamarin Forms中定义渐变。 Your best bet would be to use an image. 你最好的选择是使用图像。 However, you could also try writing a custom renderer that used the underlying platform API to draw a gradient background. 但是,您也可以尝试编写使用底层平台API绘制渐变背景的自定义渲染器。
Here is a thread that discusses using the custom renderer approach. 这是一个讨论使用自定义渲染器方法的线程 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.