I want to take screenshot of IOS app for App store submit. But the saved screenshot image dimensions is always 750 × 1334 no matter how i scale the size of simulator or change the iPhone model type, the outcome is always the same.
Solution tried:
Unchecked Optimized Rendering for Window Size, choose Physical size and save the screen shot with cmd + s.
I was try the solution above, but it is not working at all
Use the iPhone Plus simulators to get your screenshots (e.g. iPhone 6 Plus, iPhone 7 Plus, etc.). They will generate a 1242x2208 screenshot size. You are most likely using one of the non-plus simulators (e.g. the iPhone 6) since their screen size is 750x1334; they are NOT the 5.5" devices.
I'm trying to build a responsive website for ipad and mobile as well.
This is the Link if you want to check it out.
Anyway, when I use the devTools in chrome for checking out the layouts on the Galaxy S5, then the landscape view is all good. When I check it on the actual device, then the height seems to be a bit less, and some parts of the website are actually cut out. Probably due to some parts of the device not being accounted for in the height.
Screenshot from the chrome dev tools, using the width and height of the S4 mini viewport when in landscape mode:
Screenshot from the actual device in landscape mode
So the questions are:
How do I actually use the devTools in Chrome to get a precise
representation?
Do I need to actually account for browser size in the #media (min-width: whatever px) query?
Is my question wrong from another perspective I haven't considered? Am I missing something?
So I have noticed that a website I created looks bigger in Chrome than it does in IE11.
I couldn't figure out why. The zoom was set to 100% in both browsers.
If I go to http://viewportsizes.com/mine/ it reports the following viewport sizes:
Chrome - 1280 × 619 and IE11 - 1920 × 906
My question is why does this happen? How can the two browsers report back two largely different sizes?
Please tell me what device are you using? (IE Version, Windows Version, Device size)
Probably you use a mobile device (like 10 inch tablet) with Full HD resolution. Unfortunately I have no such Windows device, but this is a common behavior of mobile devices and chrome/firefox.
The reason shortly is that viewport does not represent the screen resolution and is mostly optimized for better user experience. Here I mean, that for an 10 inch device, browsing webpages in full resolution would result in a non readable webpage, a short example you can find here
http://www.javascriptkit.com/dhtmltutors/cssmediaqueries3.shtml
More details about viewport you can find here: https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
Note that IE is 'integrated' with the operating system, meaning, that DPI settings on your device also should have influence on IE (icon text size on your desktop and context menu text size is probably the same as a text in IE).
I am taking screenshots from my iOS Simulator and trying to put them into iTunes Connect but it continues to tell me that I have the wrong size. They are the same size with the pictures that are already in iTunes Connect. What just happened?
For people who need to scale the window size of the simulator, turn off "Optimize Rendering for Window Scale". It's under "Debug" menu.
It would give you the screenshots of the device dimension.
iPhone 6.5 display screenshot specifications lists iPhone Xs Max and iPhone Xr which is misleading. You must take screenshots using the iPhone Xs Max simulator which generates a 1242x2688 image. iPhone Xr screenshots are 828x1792 and will be rejected.
"Debug > Optimize Rendering for Window Scale" does not exist in Xcode 10.2
Looks like iOS simulator started scaling screenshots. Just check its real size if you are using iOS simulator with non-100% scale.
For Xcode 11.0
Select simulator iPhone 11 ProMax
Window -> Physical size
File -> New Screen Shot
Resolution must be:
1242 x 2688 pixels (portrait)
2688 x 1242 pixels (landscape)
Above will be valid in iTunes Connect for:
6.5-inch Display
5.8-inch Display
For 5.5-inch Display and lower size use iPhone 8+ simulator
Resolutions reference
https://help.apple.com/app-store-connect/#/devd274dd925
I solved my problem this way:
I set simulator to physical size: Window > Physical Size (Shortcut:
command + 1)
I set High-Quality Graphics: Debug > Graphics Quality Override > High Quality
I used Xcode Version 11.3.1 and I make screenshots as follows:
for iPhone 6.5" Display - 1242 x 2688(portrait): simulator iPhone 11 Pro Max
for iPhone 5.5" Display - 1242 x 2208(portrait): simulator iPhone 8 Plus
for iPad Pro (3rd and 2nd generation) 12.9" Display - 2048 x 2732(portrait): simulator iPad Pro (12.9-inch) (3rd / 5th generation)
If you are using Xcode 9. Window > Zoom and take screenshot.
When using the 8Plus simulator all issues might be solved.
Give it a try.
On a 13" MBP using Xcode 11, Simulator using iPhone 11 Pro Max produced 1242 × 2688 screenshots accepted by App Store Connect for 6.5".
iPhone 11 only generated 828 × 1792.
Working for Xcode 9:
Uncheck Optimize Rendering for Window Size in the Debug menu.
Uncheck Show Device Bezels option in the Window menu.
Uncheck Physical Device option in the Window menu. (CMD + 1)
Click Zoomoption again in the Window menu. The simulator will take height equal to Mac's screen height.
In my case resolution of a screenshot is 1242 × 2208 for 5.5" Display and 2048 × 2732 for 12.9" Display(iPad).
Tested on iPhone 7 Plus, 8 Plus & iPad Pro (12.9").
I solved the problem by changing the scale of the simulator : Window -> Scale -> 100%
If you choose an other scale, the screenshots will also be scaled.
None of the above worked for me on XCode 10.2.1. The solution was to set High Quality under Debug --> Graphics Quality Override
For Xcode 12 / Simulator 12
In the Simulator, I had to choose Window > Pixel Accurate (or Command + 3).
On my mac book pro, this makes the simulator taller than the screen, making screenshots with Shift + Command + 5 impossible. Luckily, the Simulator has the Edit > Copy Screen command (or Control + Command + C), which will make a perfect copy of the simulator contents, and which includes the portion of the simulator that you can't see.
Paste the copied screen image into your preferred image editor and save as .png.
There seems to be an issue with some versions of the simulator. Simply setting "Optimize Rendering for Window Scale" as #Semloh suggested wasn't enough for me and my screenshots would be too small as I was doing this on an Macbook Air.
I was able to overcome this by turning bezels off, dragging the window to the bottom of the screen and then resizing it by dragging the top left corner to the top of the screen.
I did this this once/twice for getting iPhone screenshots and 2/3 times for getting iPad screenshots - the window would snap the the full height of the viewport but each screenshot would be successively bigger.
The size of the screenshot will max out at the appropriate size of the device.
Mine wasn't working at all uploading at App Store Connect, so I refreshed the upload page and now it works... give it a try
XCode 13.4.1:
I was trying to take screenshots for the 6.5" category ("6.5 inch (iPhone 13 Pro Max, iPhone 12 Pro Max, iPhone 11 Pro Max, iPhone 11, iPhone XS Max, iPhone XR").
I was trying in the iPhone 11 Simulator, and tried literally every different configuration available in Preferences and menu bar options. I'm using XCode 13.4.1 and many of the suggestions in this thread don't exist in this version.
I then tried again using the iPhone 13 Pro Max Simulator, and it took the correct size screenshots perfectly. So, my advice is to try another Simulator in the category you need.
How to test website compatibility for iPAD without having iPAD , in both condition Portrait and landscape?
on Windows PC
also, there is another web-site: http://ipadpeek.com/
but, if you have a special css file for ipad, this site cannot show it. you should change your main css file with ipad specific one...
also, you can rotate your ipad in ipadpeek.com
edit: there is an app for looking your layout on ios device here.
You'll probably have to use a windows browser to fake the browser-agent header. This page gives more information as well as the browser agent string.
You could use Chris Pederick's User Agent Switcher in Firefox, but you won't get webkit rendering. The best option is probably to use the developer tools in Safari and change the browser agent in the Develop menu.
You should also make sure your screen size matches the iPad (1024x768 if I'm not mistaken). To test landscape, just change the screen size.
What you won't get is multitouch and gesture testing...
What are you actually trying to test? If it's just a website, that should be sufficient.