I have a website that allows users to view PDF documents. In mobile safari in iOS 8 I am having issues with landscape oriented PDF's being squeezed to fit the window. This pdf should have a landscape orientation (it looks like the browser is forcing it into portrait). The user is being directly linked to the pdf file they wish to view aka: http://whatever.com/anygivenpdf.pdf
Here is a screenshot of the issue in the IOS simulator (Iphone 5, IOS 8.1). I do not have this issue in IOS 7. Any thoughts on a fix or where the issue is originating from? I'm thinking it's either way the PDF's are saved or something must be fixed for the browser itself.
I regard this primarily as a Safari bug in iOS 8.
However, I have found a way to modify a PDF document to avoid this problem. My method works only on a Mac:
Open the existing PDF doc by the Preview app.
Select "Export as PDF..." from the File menu.
In the pop-up box where you select the new file name, click first on the button "Show details" in the lower left corner.
Select the icon for landscape orientation!
Give the document a new filename.
Click Save.
(I run a Swedish version of Mac OS X, so I am not 100% sure that I have used exactly the correct terms used in the menus of the English version, but I think you will find your way based on my description.)
Credits to these posts, putting me on the right track:
https://discussions.apple.com/thread/6540211
and
http://www.appligent.com/my-pdf-document-is-rotated-how-do-i-fix-that/
In the second one, you will find a specific description on how to fix the problem using Acrobat Distiller, if you happens to have that application installed. That should be a way forward if you run Windows, I believe.
Related
Just updated to Xcode 13 and Visualstudio Mac to 8.10.10. Since then my app:
Wont display the splash screen.
The app is cropped at top and bottom.
Ui is acting generally weird.
Now I have read old threads on similar problems and adding the Launch screen interface file base name. in the info.plist file does make the app cover the whole screen.
I have tried switching splash screens and change location. But it's just black. I don't use a storyboard for the splash and instead provide several different resolutions, which have worked fine for several years.
The UI is glitching like the loader picture, and several different ui elements where colors are provided are "cut" in the middle showing two colors when it should switch.
I have read the release notes for xcode13 but haven't found anything related that would break the whole UI.
The interface glitching and no splash screen I can't seem to find a solution for. Everything worked fine before the update.
What could be the problem? Some setting in the info.plist, a checkbox in the storyboard?
I'm still new to Xamarin and iOS development and greatly accept suggestions.
Let me know if I can clarify anything.
Thanks
iOS load glitch picture
According to your statement, you are not using a storyboard, so you need to replace the Launch Screen with a LaunchImage, then check the LaunchImage file (if it does not exist, you need to create it yourself) and add all strictly standardized pictures inside.
When I first started to create my app, I thought that using launch screens would be a good idea, so I added the LaunchScreen.storyboard file and created a view controller meant to be the launch screen.
Now, however, I would like to remove this launch screen now. I have tried to delete the view controller and the file itself, which does not work, as the launch screen view controller still appears somehow. I have tried this answer, but nothing changed. I tried another answer(can't remember the link) which told me to delete a key-value pair in the project info. After doing that, the launch screen is gone, but a black screen replaces it, and the app is not full screen anymore on iPhone 8. There are black bars on the top and bottom of the screen.
My question is: how can I remove the launch screen completely without any side effects?
Xcode 9, Swift 4
Using a Launch Screen
It’s best to use an Xcode storyboard for your launch screen, but you can provide a set of static images if necessary.
Including static images will increase the size of your binary because you must include all resolutions (see below) otherwise you will see "black screen & the app is not full screen".
Starting April 2018, all new iOS apps submitted to the App Store must be built with the iOS 11 SDK. All new apps for iPhone, including universal apps, must support the Super Retina display of iPhone X.
https://developer.apple.com/ios/submit/
So, you would be best off replacing the launch screen with a really simple view of your application (with no data).
Take at the Human Interface Guidelines for more information: https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/launch-screen/
To quote:
Design a launch screen that’s nearly identical to the first screen of your app.
Avoid including text on your launch screen.
Downplay launch
Don’t advertise.
You can do this by using the menu bar:
File >
New >
File
Once you have created your new LaunchScreen.storyboard you need to ensure it's the one assigned to the application. You can do this either through the project file explorer or through the application plist.
Using Static Images
If you are really committed to avoid using a storyboard then you can migrate to using launch images inside an asset catalog by pressing the button above the launch screen storyboard.
By migrating to launch screen images you will be required to provide all variants of screen sizes otherwise you will not support devices such as the iPhone X.
You might be required to delete the LaunchScreen.storyboard and delete the references in the project explorer / plist.
Final notes
You may be required to delete Derived Data to remove any cached version of the launch screen storyboard.
I connected iPhone to mac and I enabled Web Inspector in iPhone advanced settings, able to see the page in mac safari but not able to inspect any element and its style in safari. I am not seeing the elements panel or style panel.
Could anyone help me to find those panels to debug the styles, which i applied to page elements which I am testing in iPhone. I am able to see those panels in debugging the desktop safari pages. see the screenshot
Thanks in advance for any help.
If that type of problem ever happens to you in 2021, download and use Safari Preview instead of the regular Safari 👍
I got the problem with the following config:
MacOS Big Sur 11.4
Iphone 10 iOS 14.6
Cheers!
Update July, 2021:
Yes, the other answer for using Safari Technology Preview is working for me too: https://developer.apple.com/safari/technology-preview/
Debugging was broken for me with Safari on Big Sur: Version 14.1.1 (16611.2.7.1.4)
Debugging was working for me with Safari Technology Preview on Big Sur: Release 128 (Safari 15.0)
This was incredibly frustrating for me too. It's the small sidebar icon on the far top right, with elements tab open.
Before:
After:
From web inspector select any html element. Now in device it will be highlighted with blue color. The top right corner having expand window to show style, Layers, Node tabs. Select Style and edit css. Refer link given in comment for complete details.
In Safari 11.1.2, when the 'Computed' tab is selected, you can get back up to the non-computed properties (the Style Attributes) level by clicking the arrow beside any of the computed properties. See, for example, the grey arrow next to the -webkit-border-horizontal-spacing property in my attached screenshot.
Well, This is a normal problem in Catalina and BigSur updates after Mojave. Or if you are upgrading your MacOS to the later versions. I hope we don't get in Monterey!
I recommend to download - Safari Technology Preview -
BigSur - Download
with whatever you have been using.
If you are facing it with other lower versions -
try from here
The Answer is , need to select the DOM Tree from the dropdown as in the screenshot.
I am a newbie in iOS. I want to set Launch Image in my app. And I'm using Asset Catalog. And I know I have to drag and drop the image to the boxes that shows up when I'm using Asset Catalog. But a weird thing which is happening at that time is when I'm trying to drag-drop, it just comes back . As if Xcode is telling me NO PLACE HERE. Xcode doesn't let me set my Launch Images. I'm not able to DROP my images in those boxes. And I know the sizes of my images are quite correct. 640*960, 640*1136, 750*1334, 1242*2208.(And I don't want to use LaunchScreen because it only supports iOS 8 and later.)
It's even more weird that people are down voting without even telling the reason. (If you are not good enough to help at least don't discourage newbies)
Got the solution.
Just answering my question so that if anyone is having same problem then here is the solution. My problem was because by mistake I was using images of "jpg" format where in fact I should have used "png" . Now I'm using "png" and it works perfect.
Click on images.xcassets. You should see app icon in the list. At the bottom of that column there is a plus and minus button. Click the plus button.
Click on new Launch Image in the list. This covers iPad's and iPhone's from iOS 5-8 and covers portrait and landscape.
Launch screen can also be support for ios 8,
What you need to do set the Go to project->Media.xcassets on right side information tab you need to select iOS 7.0 and later sizes.
Then you set your launch screen inside the Launch images.
It will work definitely.
By apple provide the document Adding an iOS App Icon Set or Launch Image Set
Thanks
open Images.xcassets of your project
Drag file one by one on boxes as per its size.
See following image.
After doing all Remove LaunchScreen.xib file from your project
And remove Launch screen interface file base name from your plist file.
I have a website optimized as a web app with iOS safari, so that adding to home screen opens the app in a separate Webview. However, it always opens in the 3.5" letter boxed mode, instead of stretching to fill the screen. I know that with native apps, you just have to add the iPhone 5 sized launch image. How can I do this for a web app?
I found on this post that all that is required is that you remove width=device-width from the viewport meta tag. The blog talks about specifying a startup image, but this appears to be optional.
Edit: Original source of answer is Max Firtman. He indicates it may be a bug as well (see comments), but for now, this solution works.