flutter中 dp的理解
手机屏幕是由像素点组成的。
例:iPhone 6 Plus 采用标准的 1920×1080分辨率屏幕
就是高1920个像素点,宽1080个像素点 排列成的长方形
dpi为单位英寸下有多少个像素点。即像素。所以相同大小屏幕下的dpi与分辨率成正比
dpi越大,像素比大,像素越多

ios长度单位是pt,安卓长度单位是dp。
flutter是跨平台的,所以为了适配多平台,用了属于自己的pd(和安卓dp设计思路一样,但不是一个东西)

flutter规定 1dp = 160dpi
所以已知 分辨率和dpi。就能知道屏幕dp总数。=> dp = 手机分辨率w/160。
1dp = 160个像素点组成的长度(不同pdi手机dp物理长度不一样)

例:已知手机的分辨率为540×960,dpi为240,则:
1dp所占点数 = 240/160 = 1.5个点
屏幕宽dp数 = 540/1.5 = 360dp
所以,屏幕宽度有360个dp。此时将一张图片设宽度为72dp,则该图片占屏幕宽度为20%

px逻辑像素就是像素点的大小。所以比例是一样的。
同样设计图整体宽高,和元素宽高比就能推算出flutter中所占有屏幕比

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐