You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Yes, there can be an issue if you directly use pixel (px) values from your Figma design in a Flutter app, where sizes are in density-independent pixels (dp). Here’s why:
Understanding the Difference:
• px (Pixels): Fixed-size units based on screen resolution.
• dp (Density-independent Pixels): scales based on device screen density (DPI).
• Figma px ≠ Flutter dp: The values in Figma are in px, while Flutter expects dp (logical pixels).
Potential Issues:
Size Discrepancy across Devices:
If you directly use 390x844 px in Flutter, it might look too small or too large on devices with different screen densities.
A high-density screen (xxhdpi, xxxhdpi) will make your UI appear smaller.
A low-density screen (mdpi, hdpi) will make it appear larger.
Scaling Problem on Different Devices:
The UI won’t be responsive, and elements may not align properly.
How to Fix It?
You need to convert px to dp based on the device’s pixel density (devicePixelRatio).
Convert px to dp manually
Formula:
dp=pxdevicePixelRatiodp = \frac{px}{devicePixelRatio}
Example:
No description provided.
The text was updated successfully, but these errors were encountered: