Swipe Gestures

[ollyde]

We're running Svelte inside Capacitor.

We're wondering if it's possible to include Swipe back / forward in this library, or are there plans too?

We have the following inside the WebView iOS view controller, but it doesn't work with this routing lib.

import UIKit
import Capacitor

class MyViewController: CAPBridgeViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        webView!.allowsBackForwardNavigationGestures = true
    }
}

[mefechoel]

Hey there, unfortunately I know nothing about Capacitor, so I'm not sure if I can help much. First of all though, no gesture control will be added to the library. That's just not a router's concern. But it seems from your description, as though Capacitor already handles the gestures, they just don't get translated quite right. My guess is, that the app runs in some sort of browser-like environment, that either has no window object or more likely is more like an iframe, which causes svelte-navigator to use a memory history. This means that a back and forth navigation (like hitting the browsers back or forth button, which is probably what Capacitor is emulating) is not intercepted, because the router thinks there isn't a proper browser. You can try forcing svelte-navigator to use a proper browser history, which would detect these navigations by creating a browser history manually:

<script>
    import { createHistory } from "svelte-navigator";

    const browserHistory = createHistory(window);
</script>

<Router history="{browserHistory}">
    <!-- ... -->
</Router>

If that does not work, beybe you can find a way where you can hook into the handling of the swipe gestures. If you can call some js code in response to Capacitor registering the back/forth gestures, you can perform the navigations manually:

import { globalHistory } from "svelte-navigator";

// I'm making up this api, I have no idea if anything like this exists in Capacitor
Capacitor.onSwipeBack = () => globalHistory.navigate(-1);
Capacitor.onSwipeForward = () => globalHistory.navigate(1);

If none of that works, I guess you could still try to catch the gestures youself using a library like hammer or something similar...

[ollyde]

@mefechoel thanks, I figured out the swipe back animation, let's see if I can get swipe forward animation working :-)