Converting iOS PT to Android DP?
Asked Answered
T

1

12

I have a style guide of iOS app which specifies height, width, padding, font size etc in PT (1x as base). I have converted them successfully in pixels for various iPhones like iPhone 5,6,6s Plus, 7, iPad.

Now I need to use the same style guide for Android App, but I am clueless how should I convert iOS PT to android DP or pixel?

Is there any common method or something which can specify like: 30pt of 1x iOS converts into X dp (or pixel) of mdpi android?

I have searched but couldn't find hint for this. If someone could help me here, that would be great.

Tarpaulin answered 28/2, 2017 at 8:39 Comment(5)
Is that style guide for iOS public? I was looking for an iOS style guide similar to the one we have available for material design - material.io/guidelinesReina
can you please share your iOS style guide.Reina
@Reina unfortunately I won't be able to share the guild with you as it's not public and was specifically for the particular project.Tarpaulin
Dang, thanks for the comment back though. If you ever have something htat is shareable with iOS style guide please keep me in mind. I'm looking for something like the materail design guidelines website but for iOS.Reina
It's way late, but this post does get some traffic, so I thought I'd mention that for any app made for IOS, one should keep Apple Human Interface Guidelines in mind. developer.apple.com/design/human-interface-guidelines/ios/…Cordillera
B
13

The DP is supposed to be equal to the PT in IOS. You should not need any translation at all. They are both a representation of the experienced resolution, and they hide the true resolution.

By the way, you may have made a small mistake by using @2x as base for your design guide. When one works from a design guide one should not have to think about pixels, Only PT/DP. Only icons and images should be produced in different resolutions. The UI should be defined in PT/DP with 1x (The "official" resolution) as the base. For iPhone 4/4S that resolution would be 320x480 even though the actual resolution is 640x960. For Android it's not that simple because of the unrestricted sizes available for any vendor to produce. I would recommend using something like 1080p (DP) resolution for the design guide, but use a relative design, and be mindful of the components that will need to resize to accommodate any screen size.

Beltran answered 28/2, 2017 at 11:3 Comment(3)
Ok, but for PT, it is mentioned that Points are an abstract measured value based on a pixel density of 163 PPI. The pixel dimensions can be calculated as follows: px = PPI * PT / 163 So based on your answer, I assume 30PT = 30DP for Android. But 30 DP for mdpi or hdpi or xxhdpi? How can I determine that? because if I consider PT as DP, then the iOS and Android UI looks a lot different.Tarpaulin
material.io/devices this list should help a bit. IOS-devices are very cleverly designed in such a way that every screen can scale up, but this is not the case for Android. Screens can be very different in aspect ratios, and to be able to define equal designs for both IOS and Android, one must define the designs using PT and DP, but be mindful of which parts of the design will be stretched when applicable.Cordillera
Sorry there was my mistake. I have the design based on 1x only. I have updated my question to reflect the same. I got your point for 1080p for android, but the problem for me is I only have design guide which has PT of 1x :( I can't ask for another guide. Is there any chance I can convert it to dp or px as close as possible, if not perfect.Tarpaulin

© 2022 - 2024 — McMap. All rights reserved.