在 Xamarin Forms 自定义标签渲染器中，增加边界的大小

Posted 2023-03-25

【中文标题】在 Xamarin Forms 自定义标签渲染器中，增加边界的大小

【英文标题】：In a Xamarin Forms Custom Label Renderer, increase the size of the bounds

【发布时间】：2021-12-03 21:09:23

【问题描述】：

我有一个自定义渲染器，它试图创建一个带有圆角的白色正方形，其中包含顶部的单个字体图像和下方的文本。我已经能够用 ImageRenderer 做类似的事情，但我希望在这个版本中支持字体图像。 在 LayoutSubviews 中，我将框架设置为请求的大小，设置角半径，并将 Clip to Bounds 设置为 true。在这个时间点，Bounds 仍然是 (0,0,0,0)，但是在这里设置没有任何效果。

            Control.Layer.CornerRadius = 10;
            Control.Layer.MasksToBounds = false;
            Control.Layer.Frame = new CGRect(0, 0, element.WidthRequest, element.HeightRequest);
            Control.Layer.BackgroundColor = HelperUtilities.GetColor(element.Item.BackgroundColor, Color.White).ToCGColor();
            Control.ClipsToBounds = true;

我还在调用基本代码之前和之后检查了 Draw 中的 Bounds 的值，它们与预期的一样 - (0,0,126,126)。然而，当屏幕被绘制时，白色背景太短 - 它是一个适当宽度的矩形，但字体图标的高度，而不是给定的高度。我可以通过将 VerticalTextAlignment 从 Start 更改为 End 来更改字体图标在方形区域内的位置，这将其从正方形的顶部移动到底部。 接下来，我为附加文本添加 UIView 并将其锚定到控件的底部锚点，它锚定到白色区域的底部而不是正方形的底部，这告诉我控件的边界已更改，因此高度没有更长的 126 但是所使用的 Font 和 FontSize 的实际高度。

我需要设置和/或覆盖什么才能使控件具有给定的高度而不是字体高度？

这是显示的内容：

这就是我希望它显示的内容：

【问题讨论】：

你把这个白色方块的VerticalOptions设置成EndAndExpand了吗？似乎不是下面部分需要带角半径的白色正方形，而是后面的图像。您还需要编辑白色方块背景颜色的不透明度以达到您想要的效果。

对象的 VerticalOptions 是 StartAndExpend，但这不会使白色扩展到可用区域的底部。白色方块是在 ios 渲染器中创建的，因此它没有 VerticalOptins。白色方块后面不应该有任何东西。第一张图片中的粉红色是用于测试的背景，白色应该下降到粉红色的底部。

您介意与我们分享一个基本的、最小的测试项目吗？您可以将其上传到 github 并在此处附上链接。

【参考方案1】：

我能够通过在我的表单应用程序中从 Label 继承的对象底部添加填充来解决此问题，以解决扩展区域的问题。如果 iOS 作为 android 没有问题，我只添加填充。这比将其添加到自定义渲染器中要容易得多。