vp、fp、px的区别？

Question

vp、fp、px的区别

Answer 1

距离使用 vp (virtual pixel)，字体大小使用 fp (font pixel)。

• 虚拟像素单位：vp (virtual pixel)

  以屏幕相对像素为单位, 是一台设备针对应用而言所具有的虚拟尺寸（区别于屏幕硬件本身的像素单位）。它提供了一种灵活的方式来适应不同屏幕密度的显示效果,使用虚拟像素，使元素在不同密度的设备上具有一致的视觉体量。

• 字体像素单位：fp (font pixel)

  字体像素大小默认情况下与 vp 相同，即默认情况下 1fp = 1vp。如果用户在设置中选择了更大的字体，字体的实际显示大小就会在 vp 的基础上乘以 scale 系数，即 1 fp = 1 vp * scale。

• 屏幕像素单位：px (pixel)

  屏幕上的实际像素，1px代表手机屏幕上的一个像素点，常见的手机比如1080×1920 这个数值的单位都是px，由于px在不同手机上的大小不同，差别较大，适配性太差，不建议使用。

参考链接

像素单位

Answer 2

非常经典的问题，不单单是ArkUI，前端的常识问题，解释如下：
VP（Virtual Pixel）：虚拟像素，是一种相对于应用而言的虚拟尺寸单位。它提供了一种灵活的方式来适应不同屏幕密度的显示效果，使元素在不同密度的设备上具有一致的视觉体量。虚拟像素主要用于宽度和高度的计算。
FP（Font Pixel）：字体像素，是字体大小单位。在默认情况下，字体像素的大小与虚拟像素相同，即1 FP = 1 VP。开发者可以在设置中修改字体显示大小，此时字体像素的实际显示大小会在虚拟像素的基础上乘以一个比例系数。字体像素主要用于字体大小的计算。
PX（Pixel）：屏幕像素，是实际像素单位，用于表示屏幕上的像素点。在鸿蒙开发中，不建议使用屏幕像素单位进行宽度和高度的计算，因为不同设备的屏幕像素密度不同，导致适配性较差。

本文参与了思否 HarmonyOS 技术问答马拉松，欢迎正在阅读的你也加入。