I want to create blocks for a iphone/ipad) game. I want to use same model so i need screen sizes for coding.
For example iPhone has 320 pixels in X coordinate. we have 8 blocks, so 320/8 = 40 iphone has 480 pixels in Y coordinate. we have 12 blocks, so 480/12 = 40
ipad has 768 pixels in X coordinate. we have 8 blocks, so 768/8=96
ipad has 1024 pixels in Y coordinate. we have 12 blocks, so 1024/12=8
But i want to ask to program for pixels. It understands which device is running so define pixels otomatically. How can i do it?
You could simply ask for the UIApplication's window size.
[UIApplication sharedApplication].keyWindow.bounds
Keep in mind that the value returned here is measured in points not pixels. That means that the size is the same regardless of resolution (i.e. an iPhone 3G screen and an iPhone 4 screen measure the same even though the iPhone 4 has twice as many pixels)
For non-retina screens one point = one pixel. On retina screens you would need to check for the screen's scale to determine the conversion to pixels.
Related
Hello I have made a background image (size: 1136 x 650). Then I have implemented it into my app but on iPhone 5 it is too small though in all the guides I read they said that 1136x650 would be the size for a background image on iPhone 5. Then I have used the same image but with size: 2272x1300 (#2x) and now it fits perfectly.
Does that mean that I have to use a background image with the size: 2208x1242(normal) and 6624x3726 (#3x) for an iPhone 6+?
The number of physical pixels in the screen and the number of points in the screen's coordinate system are different numbers. As you have discovered an iPhone 5 has four times as many physical pixels on the screen as logical pixels.
For iPhone 6, in order to fill the whole screen in landscape orientation, you would need a 1334 x 750 image. For the 6+, you would need a 2208 x 1242 image. A quick way to tell is to check the requirements for the launch image, which you can get to from here.
I have this image called image.png - I have created it in the 3 differen't sizes.
image#3x.png - 1001x132px
image#2x.png - 668x88px
image.png - 334x44px
What I dont understand is how come the #2x is 668px in width, when the iPhone 5&5S are only 640px wide?
I have designed the #3x using iPhone 6+ screen size.
Could someone please explain?
Let me explain you the difference between the iPhone screens, so you will understand the need of these #?x suffixes.
The first iPhone, and the two after it (3G and 3GS) had the standard display with dimensions w:320, h:480. With the introducing of iPhone 4, Apple also introduced the so called Retina display, which "packs" 4 physical pixels in 1 logical pixel (also called "point"), i.e.:
Now, even though the pixel dimensions of the iPhone 4 are w:640, h:960 (and iPhone 5/5C/5S w:640, h:1136), you still have screen size of w:320, h:480 points (respectively w:320, h:568 for 5/5C/5S). But because the coordinate system of the display uses points instead of pixels, the dimensions and position in points of all UI elements remains the same for every device.
What about the prefixes?
Now, the ratio between point and pixels is called "scale". UIScreen, UIView, UIImage, and CALayer classes have a property called scale, and when you load image with prefix #2x, the scale will be 2.0 and the display will fit 2x2 bitmap pixels from the image in one point. iPhone 6+ uses the #3x suffix because of the Retina HD display, which has scaling factor 3 and the image is afterwards downscaled from rendered 2208 × 1242 pixels to 1920 × 1080 pixels (points on the screen).
The downscaling ratio is 1920 / 2208 = 1080 / 1242 = 20 / 23. That
means every 23 pixels from the original render have to be mapped to 20
physical pixels. In other words the image is scaled down to
approximately 87% of its original size.
(source).
Required image sizes
For example if you want to have an image of green circle in a black square with dimensions w:100, h:100, you will need two more images: one with dimensions w:200, h:200 and one with w:300, h:300, as the system will scale them according to the suffix.
Where to go next
Here is some stuff to read (if I didn't explain it right or easy to understand). My advice: check the link above and the official Apple documentation for further knowledge:
Apple documentation: Supporting high-res devices
Apple documentation: Points vs. Pixels
#2x is using for retina display, like iphone 4, 4s, 5, 5s, 6, ipads ....
The image has 668px in width, I think it use for a view that could have extra area for view, like horizontal scroll view, tutorial pages, or for ipad ... ... or something like that ..
And yes, you're right about the width of retina display, it is just 640px.
Hope this may help.
There is one image1 and one label1 in the view. I set auto layout in IB as
"image1.leading equal label1.leading, multiplier=1, constant = 30"
I thought it would get different visual distance between on iPad and on iPad Retina. But actually they are same.
This is why? Thanks.
iOS uses points to abstract away from the physical pixels of the screen.
In this case, your constant is set to 30 points (not pixels). This is where the scale of a display comes into play.
The iPad has a scale of 1.0 and the iPad retina has a scale of 2.0. The scale is used as a multiplier for points to translate them to pixels when rendering.
Your 30 points is shown as 30 pixels on the iPad (1.0 x 30 = 30) and 60 pixels on the iPad retina, (2.0 x 30 = 60). However, the pixels are more densely packed in the iPad retina, so the physical space occupied by 30 pixels on the iPad and 60 pixels on the retina is the same when measured with a ruler.
I am trying to convert IOS points to real length(inches).
Im testing this on the New iPad. according to the spec. its width is 7.31 inches and in xcode it has 768 Points, which means it has 768/7.31 = 105 points per inch (horizontally).
From the calculation, a 105-point horizontal line should be displayed as 1 inch on physical screen.
However, when i draw on the screen and measure the distance its shorter that calculated.
Am I missing something here?
Thanks,
From the specs, the 7.31 inches is the total width of the device, not the screen. There is a bezel around the screen to allow the user to hold the iPad without touching interface controls on the screen.
Also, if scroll down a bit, you'll see that the screen is
2048-by-1536 resolution at 264 pixels per inch (ppi)
Well, I have basically two questions regarding screen resolution in iOS devices.
1) In iOS documentation, on the Point vs Pixels section, it states the coordinates are passed in to framework as points, and that "One point does not necessarily correspond to one pixel on the screen." as found here: https://developer.apple.com/library/ios/#documentation/WindowsViews/Conceptual/ViewPG_iPhoneOS/WindowsandViews/WindowsandViews.html
When they are different? Up until now I was assuming they were equal and passing in pixel coordinates. Is this a parameter that changes from device to device?
2) I'm also a little bit confused about PPI. I know what it means on the hardware screen (if a 10" and a 7" display have the same pixel resolution then the 7" display will have a better image quality since the PPI is higher). But what difference it makes if I save a .png with 72ppi or 96 or even 326? Is it just for printing or does it make any difference visually on my screen?
Thanks
On retina devices (iPhone 4, 4S, or 5, and iPad 3 or 4), there are 2 pixels per point. On non-retina devices, there is 1 pixel per point.
Except for the iPhone 5, all iPhones have a screen size of 320x480 points. The retina iPhones have a screen size of 640x960 pixels (but the same point size as the non-retina devices).
When working with images in iOS, it is the pixel size that matters, not the PPI. Just remember that your #2x images should have twice the width and height of the regular, non-retina images.