How to disable URL drag in a Capacitor application for iOS? - ios

I have an iOS app written using Capacitor.
I have buttons which are links to different part of the application.
If I do a long press over some button then drag it the iOS shows a popup block exposing the internal link, something like "capacitor://...."
Is there any way to disable this behaviour?
I can change every link and replace href with onclick method but I wonder if there is an option somewhere in Xcode to do it for all links.

Related

Website wrapped in iOS App - Catching hyperlink click events

I have a iOS app that wraps a website. When the user clicks a link in the wrapped website, I want to trap the event in my app and be able to get information about the link that was clicked. Is this something that can be done in Swift?
I'm relatively new to iOS app development and I'm working on an app that has been around for a while.
The short answer is "Yes". There are a couple of views that you can use in iOS to display web content. One such view is WKWebView.
If you look at the documentation at that link, close to the bottom of the page you will find a header for "Managing Navigation Through your Web Content".
What you do is create a WKNavigationDelegate that you attach to your WKWebView. That delegate is notified when the user wants to navigate through the web content (for example, when they click on a link) and lets your application code participate in the navigation process. It can allow navigation, deny navigation, find out when it starts and stop, things of that nature.

iOS PWA standalone: how to force opening in a new window

I have a PWA saved on the home screen, this opens up standardly without search bar nor the bottom buttons (share, tabs, etc..).
So every link gets opened inside the PWA, and that is expected.
I have a problem when showing pdfs as they normally open in Safari with the "share" button and all the bottom bar, but in the PWA they open up without bottom bar and without any share button.
So my idea is to open the PDF link (http://www.mywebsite.com/download/pdf/12345) in a new safari window,.
I tried putting target="_blank" on the PDF link but this did not solve the problem.
I also tried forcing the iOS behavior by opening the app in safari with safari://http://www.mywebsite.com/download/pdf/12345 but with no luck.
How do I open a New Safari window to a link?
OK, the ONLY working solution is to tell iOS you are going onto another domain.
PWA stays in your app frame ONLY if you stay in the same domain.
To open a link within your domain in an EXTERNAL window (or inside the PWA but with Safari standard controls) you have to send it to an external/different domain.
So the PWA is on https://www.mywebsite.com/ and you want to open a PDF with all Safari control buttons, you just create a SUB domain and point the link to it, like https://media.mywebsite.com/download/pdf/12345 at this point the PWA thinks you are on a different domain and does the correct rendering! 🎉
You can try to use window.open(url).
But, remember to put it in an element with onclick event attribute.
For example,
<button class='btn' onclick='window.open("https://www.google.com", "_blank");'>Open Google search</button>
Reference: window.open(url, '_blank'); not working on iMac/Safari
EDIT
You can set a scope in manifest.json to customize where to open an external link.
You can refer https://developers.google.com/web/fundamentals/web-app-manifest on the property scope.

Issue with openning PDF in iOS 11.3 Using PWA

I've used Vuejs and Framework7 in my PWA. I want to open a remote PDF file in my PWA and also it's important to me that users be able to back to my PWA after opening PDF. I did this using :
window.open(pdf_url, "_blank");
And it works fine for iOS > 12 and after opening pdf file there is an "OK" button for closing pdf.
But for example in iOS 11.3 there is no button and user has to use home button to close PWA.
I tried to solve problem using iframe but I can show only first page of the pdf.
Is there any way to fix this issue?
You can resolve this issue by doing some tricks (for any device without back button):
if you use iframe, you can set height manualy with overflow scroll, and I think this will resolve issue (dependence of style or lib dependency, so that may be not work).
you can add back button to your navbar, or Toolbar to let user click on it to back to previous page. (I prefer this solution).
you can render pdf in popup nested of normal html page, and then you can customize popup component by handling back button, or handling close by dropback overlay.
I use second and third point in real project and its work fine...
This is sample close button code used in popup:
'<p>'+ i18nextHelper.i18next.t('Exit From PDF') +'</p>'
Note: You can also customize height page for pdf page only, and add normal button bellow it, or by add absolute positioning button above PDF, but I think if you use second or third point will be best.
Good luck.

How to change the keyboard in Phonegap iOS

I have making a phonegap app which have text fields in it.
Problem:- I want to remove the Done button from the keyboard or I want a Event listener of done button. Ether of the things will work for me.
My Problem is similar to this link
You can't remove the done button, since Phonegap uses a UIWebView to present the UI you will be stuck with keyboard used by the UIWebView.

How can I modify the browser control for phonegap in iOS to have menu buttons?

I have a PhoneGap application in iOS to display a web app. I want to modify the browser control that is displaying the web app to have a few buttons at the bottom that function as "back" "forward" "refresh" etc. is this possible? Do I need to use a plugin?
I suggest using html to implement those buttons, which is pretty easy with javascript. Since it's not performance-critical, doing this with native code is unnecessary.
I don't know any plugins for what exactly you want, but I have used the android version of this iOS ChildBrowser plugin which provides a pop-up browser with "back", "forward" and "refresh" buttons. It's quite convenient for browsing external web pages.

Resources