I have put the meta tags in my html header to transform my site into an fullscreen webapp. Everything is working fine, without the known swipe back gestures from safari.
Does anyone know why its not working and how to fix it?
This gesture is not supported in full screen web apps. I suggest adding the appropriate UI to your web application so that the user can navigate without it. Hopefully this is something that gets added in the future.
Related
I am dealing with a weird bug on Ionic's iOS native build where I sometimes cannot swipe back or switch tabs once I transition to a new page using router.navigateByURL(...), and trying to debug this issue has been troublesome since I can't "see" how the gestures are handled. Does anyone know where I should be looking in the code for handling transition gestures?
Here's a video demo of the problem: https://streamable.com/hk9c0
In the video, you can see me:
Swiping down to refresh using the ion-refresher element and you can see the page beneath (already entered a bug report for that part: https://github.com/ionic-team/ionic/issues/18284 )
Trying to tap the back arrow in the left corner
Attempting to swipe left to right to go back a page (hard to show that one)
Tapping the bottom tabs to transition to new tab, at one point, I tap on a tab that has an ion-fab element which appears in the bottom right because its z-index is higher than the "stuck" page.
Currently the best I've been able to do is by looking at the css classes that are added to the pages, but it's not much use....
Where app-release is the page you can see in the video and app-home is the page underneath the stack. It's my understanding that Ionic uses hammer.jsfor gestures, so I added it as a tag, please correct me if I am wrong. I cannot, for the life of me, recreate this bug consistently, but will often trigger 1 out of 50 tries.
I've been digging through the utils in Ionic Core to see where elements are being added and removed, with no luck.
I created a bug request for this here as well: https://github.com/ionic-team/ionic/issues/18305
Are you using #angular/animations to make the transitions between the pages? I had some issues like yours, as you can see in my question.
Router navigate on Ionic with animation blinking on ios using angular animations
If I am right about the use of #angualar/animations I suggest to use a custom animation of the Ionic itself, and not te angular's. You can see an working example here of its use here:
https://github.com/mhartington/ionic4-custom-animation
Since I have less tem 50 rep I cant comment so I had to post this anwser not knowing if it was really your case. Hope it helps.
I just added a web app manifest to my web app in order to have a better mobile experience.
When I now add my web app to my iOS home screen everything looks just like a real app, but unfortunately right and left swipe to jump to the previous seen page is not working anymore. It seems to be disabled.
Is there a way to enable this again?
When running the web app in safari the swipe gesture works just fine.
In my web app manifest I have
"display": "standalone" set.
I do not want to show the browser controls, it is supposed to look like a real app.
Is there a way to have the swiping enabled anyways again?
Thanks in advance!
Best regards
Chris
I never remember having this, but check out Framework7.io, they can do that with their framework 😀
I am having a very weird issue on an iPhone and I would like to have suggestions on the best way to troubleshoot. My web application works fine for a moment then suddenly all text fields and buttons will have no effect, but only to open the virtual keyboard.
For example, a "delete" button which used to display a "yes/Cancel" modal will only make the keyboard open, the modal won't show up... When I reload the page, everything is working as expected again.
I am testing with an iPhone 6 and Chrome.
Did someone already encountered an issue like that?
I have absolutely no idea how to track down this behaviour and all suggestions are welcomed, What do you suggest I should look in priority?
This issue was coming from a bug in a version of Chrome I was using at that moment (I have no idea which one, since my phone has regular automatic updates).
I strongly advise to have always at lease two different platforms when testing websites!
I am currently building my first HTML5 iOS app. Here is a screenshot of the HTML5/CSS3 app so far - http://prntscr.com/3km4wd
I want the app to be like the Medium.com app so that the user can swipe across and it will load a new quote, also I need to know how another quote can be loaded up. Thanks.
Try to use HammerJS in your html/javascript for swipe and many more gestures.
I'm making a web project that is fitted to the iPad screen. I'm trying to make it look as much like a native app as possible. It is loaded in safari or atomic browser. What I'm trying to find out is if it's possible to eliminate the drag and even the zoom functions of one of those browsers for just that site.
To rephrase, I want to make my site fixed on the screen at all times. The issue is, a user will try to hit a button and it will drag the screen.
PS. An additional question is how I can make it so images don't have the "save as" functionality if held down I tried putting a span over the images, and that worked for firefox, but not iPad safari.
If you can solve any or all of these, you would have my biggest thanks!
Turns out that there are several metatags that you can put in your js file which keep the screen fixed. Good stuff on that is here:
http://jakeboyles.com/2011/01/16/how-to-build-an-iphone-and-ipad-web-app/
As far as the "save as" issue, I don't know yet, that part of my app development hasn't been solved.