SkiaSharp在Xamarin Forms上的文本大小

Question

SKPaint对象的TextSize属性如何与“标准”Xamarin Forms FontSize相关？

在图像中，您可以看到标签上大小为40和绘制大小的差异。我需要做什么才能使它们大小相同？

- Martynnw

Answer 1

正如@hankide所提到的那样，这与本地操作系统对UI元素的缩放有关，以便应用在不同设备上“看起来大小相同”。 这对于按钮等元素非常有用，因为操作系统正在绘制它们。 因此，如果按钮更大，则操作系统只会放大文本。 但是，使用SkiaSharp时，我们不知道您正在绘制什么，因此我们无法进行任何缩放。 如果我们要缩放，图像将在高分辨率屏幕上变得模糊或像素化。 使所有内容大小相同的一种方法是在绘制任何内容之前进行全局缩放：

var scale = canvasWidth / viewWidth;
canvas.Scale(scale);

这通常已经足够好了，但是有时候你真的希望在高分辨率屏幕上以不同的方式绘制物品。一个例子就是平铺背景。你可能不想在更大的画布上拉伸图像，而只是想将其平铺 - 保留像素。

对于这个问题，你可以在绘制之前缩放整个画布，也可以只缩放文本：

var paint = new SKPaint {
    TextSize = 40 * scale
};

这样做可以增加文本大小，但绘图的其他部分将在更大的画布上进行。

我在GitHub上有一个示例：https://github.com/mattleibow/SkiaSharpXamarinFormsDemo 这比较了Xamarin.Forms、SkiaSharp和本地标签。(它们应该都是完全相同的大小)

- Matthew

Answer 2

我认为问题在于Xamarin.Forms处理字体大小的方式。例如，在Android上，您可以以像素（px）、独立比例像素（sp）、英寸（in）、毫米和密度无关像素（dp/dip）定义字体大小。

我记不清Xamarin.Forms如何处理大小（px、sp或dp），但您看到的差异就是因为这个原因。您可以创建一个Effect来更改本地控件上的字体大小处理，并尝试匹配SkiaSharp提供的大小。

- Timo Salomäki

---

我会看一下并查看发生了什么... 我认为 Xamarin.Forms 的值也可能会乘以屏幕密度... 你可以尝试使用 paint.TextSize = 40 * density。 - Matthew