3 个不稳定版本

0.1.1 2024年3月15日
0.1.0 2024年3月13日
0.0.0 2024年2月20日

#361 in GUI

Download history 13169/week @ 2024-05-02 12682/week @ 2024-05-09 14374/week @ 2024-05-16 14724/week @ 2024-05-23 17680/week @ 2024-05-30 17415/week @ 2024-06-06 17651/week @ 2024-06-13 18536/week @ 2024-06-20 21832/week @ 2024-06-27 28890/week @ 2024-07-04 31345/week @ 2024-07-11 32214/week @ 2024-07-18 43255/week @ 2024-07-25 42570/week @ 2024-08-01 51157/week @ 2024-08-08 40177/week @ 2024-08-15

181,945 每月下载量
用于 557 个库(6 直接使用)

Apache-2.0

40KB
1K SLoC

DPI

为什么我应该关心 UI 缩放?

现代计算机屏幕的分辨率与尺寸之间没有一致的关系。1920x1080是桌面和移动屏幕的常见分辨率,尽管移动屏幕的尺寸通常不到桌面屏幕的四分之一。此外,无论是桌面还是移动屏幕,它们自己尺寸类别内的分辨率也不一致 - 常见的移动屏幕分辨率范围从低于720p到高于1440p,桌面屏幕分辨率范围从720p到5K及以上。

鉴于这一点,假设2D内容只会在具有一致像素密度的屏幕上显示是错误的。如果你在一个1080p屏幕上渲染一个96像素平方的图像,然后在同样大小的4K屏幕上渲染相同的图像,那么4K版本在物理空间上的占用将只有1080p屏幕的四分之一。这个问题在文本渲染中尤其严重,其中四分之一大小的文本成为显著的易读性问题。

未能考虑缩放因子可能会造成用户体验的严重下降。最值得注意的是,它可能会让用户觉得自己视力不好,这可能会导致他们考虑自己变老,从而引发存在主义危机。一旦用户进入这种状态,他们就不会再专注于你的应用程序。

我应该如何处理?

这个问题的解决方案是考虑设备的 缩放因子。缩放因子是 UI 元素应该缩放的因子,以与用户的整个系统保持一致 - 例如,通常宽度为50像素的按钮,在缩放因子为 2.0 的设备上宽度将是100像素,在缩放因子为 1.5 的设备上宽度将是75像素。

许多 UI 系统,如 CSS,公开了依赖 DPI 的单位,如 pointspicas。这通常是一个错误,因为缩放因子和屏幕实际 DPI 之间没有一致映射。除非打印到物理介质,否则你应该在缩放像素中工作,而不是任何依赖 DPI 的单位。

位置和尺寸类型

类型 PhysicalPosition / PhysicalSize / PhysicalUnit 与设备上的实际像素相对应,而 LogicalPosition / LogicalSize / LogicalUnit 类型则对应于通过缩放因子除以物理像素。

位置和尺寸类型在它们的精确像素类型 P 上是通用的,以允许API在适当的情况下具有整数精度(例如,大多数窗口操作函数)以及必要时具有浮点精度(例如,具有分数缩放因子的逻辑尺寸和触摸输入)。如果 P 是浮点类型,请不要使用 as {int} 将值转换为整数。这样做会截断浮点数的分数部分而不是正确地四舍五入到最接近的整数。请使用提供的 cast 函数或 From/Into 转换,这些转换能够正确地处理四舍五入。请注意,当将浮点数四舍五入到整数时,仍会丢失精度,尽管四舍五入可以减少这个问题。

Cargo功能

此crate提供以下Cargo功能

  • serde:启用使用 Serde 对某些类型的序列化/反序列化。
  • mint:启用 mint(数学互操作性标准类型)转换。

依赖关系

~190KB