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.
Related
I'm facing a very awkward trouble with my XF NavigationPage on iOS, and can't find anything about it on google. When I navigate from one page to another using Navigation.PushAsync there is 1pt line of previous page on the left of the screen visible untill replace that loading page's content from codebehind, you can see it here: screenshot (I actually have an image im my XAML and it's replaced with content that is loaded from server). If I disable animations with false param on PushAsync this dosen't happen.
Is there any way to preserve animations and get rid of this? Any suggestions appreciated, thank's in advance.
Update to the Latest version of Xamarin Forms, as I remember facing this bug on some previous version of XF probably 3.5 something but when i updated to the latest it started working
Good luck
Revert in case of queries
I'm working on a webapp built with Cordova for both iOS and Android. Everything was fine until I launched tests on the new Apple's iPhoneX. As you may know, Apple decided to remove the physical home button by replacing it by a home indicator at the bottom of the screen:
This home indicator is always visible on your screen and it goes over your webapp content. When user want to navigate between apps or to go back to the home screen, he has to swip up this home indicator (which is very sensitive). This wonderful invention brought to my webapp 2 main problems:
This break my webapp design because it goes over the content.
The system gesture enter in conflict with my webapp gesture. My entire gameplay is based on drag & drop and all draggable icon are at the bottom of the screen, under the home indicator.
1. How to hide the home indicator?
To solve the first point I found a plugin called cordova-plugin-hide-home-indicator. This will hide (with fadeIn/Out effect) the home indicator after a few second of inactivity. But every times a touchscreen event is detected, the home button is visible again... I have red here that even if the Objective C (Xcode) function prefersHomeIndicatorAutoHidden() (which I guess is used by this Cordova plugin) return true it doesn't mean that the home indicator will be hidden for ever. Well... if somebody has a better solution I would appreciate your help!
2. How to lock system gesture?
I found a Xcode function called preferredScreenEdgesDeferringSystemGestures() They explain that normally the system will always take precedence on an app gesture, but in some cases (for immersive games for exemple) you can ask for your app to take precedence on the system. This sounds great! But unfortunately I don't know anything of Objective C :) I didn't find any plugin about that point.
In this video from Apple at 10:33, they talk about edge protection, which should do the trick by giving the app gesture the precedence, but again, I didn't find any plugin for Cordova...
Any ideas? Thanks!
Don't hide the home indicator. The solution by Apple is to use the new CSS constants as padding for the safe areas of the device. Read this to get starting point: iPhone X support
You can use this plugin in order to avoid edge gestures at iOS
https://github.com/distinctdan/cordova-plugin-screen-edges
It's very easy to use, i used in a cordova project and it works as expected
I was working through the swift tutorial:
https://www.raywenderlich.com/115279/swift-2-tutorial-part-2-a-simple-ios-app
On the section (about 1/3 way down)
But I'm noticing a problem when I attempt these steps in my xcode environment. I am able to successfully embed a navigation bar, but "double clicking" doesn't allow me to set the text at all, in fact it really doesn't let me do anything just highlighting the nav bar region:
See:
I can also put up code at request, but being this is so early in the project, I haven't coded really anything yet, it seems more like a UX challenge. Am I missing some particular setting in Xcode editor that allows the text to be highlighted, or has the guide skipped some trivial, but necessary step to making this work?
#sschale's answer is a good solution:
For user's that come across the post, it isn't obvious where that menu is. After some digging I found that you need to hit a certain middle icon (in the red box) so it is blue to find the form. Image attached:
Sometimes it can be hard for it to register there. You can edit it in the right sidebar directly, when the Navigation Item is selected:
I'm starting a new iOS project in Swift, and my experience programming native iOS applications is minimal, so please bear with me if I use some whacky terminology or overlook some simple solutions.
I'm looking to replicate a pattern in the Instagram application, as seen here:
Selected Tab
Swiping Transition
For those who don't use Instagram, what's essentially going on here is something like a UIPageViewController (with swiping functionality), but with the tabs on top indicating the selected page.
Like in Instagram, I'm planning to have this functionality within a child UIViewController of a UITabBarController (you can see the "main" tabs on the bottom).
What I started out doing was creating static tabs and adding left and right gesture recognizers to the child UIViewController, which would change the page and update the indicator of the selected page on the tabs.
This works but I'm not really loving the way it looks, nor the way it's written. I don't like the idea of needing 2 instances of the tabs, and that certainly doesn't seem to be the way Instagram is doing it, because as shown in the second image, the indicator slides between the tabs.
I've searched a fair bit, but all references to replicating Instagram patterns seem to be outdated and don't address this specific element. Like I said, though, I haven't been programming native iOS for very long (I'm an Android developer and have used Xamarin for iOS), so it's possible I'm just not using the right keywords.
I'd appreciate any help y'all can offer!
Thanks
Has anyone ever had this issue:
When you slide your finger from the bottom of your iOS screen to the top, it shows the control center - and then you swipe your finger down to get rid of it, but now when you try to use your app - a lot of the dynamic content is completely broken.
After pressing the home button and coming back to the app, everything is back to normal.
It appears the Control Center breaks my dynamic code - which is basically just a UIWebView that I'm assuming is not refreshing properly.
Does this have something to do with the "app entering the background" and "coming back to foreground"... or is there some sort of event where I can track what's going on?
This is a very strange issue.
It seems I was improperly using "applicationWillResignActive" when I really wanted to use "applicationDidEnterBackground".
By making sure to use "applicationDidEnterBackground" instead of the "applicationWillResignActive", my app appears to function perfectly fine again. Viewing the Control Center or Notification Center no longer breaks my app.
Hope this helps someone else who makes a silly mistake.