↔️ Swipe Navigation

Share your Projects! Dashboards & Frontend
1

Swipe Navigation

Swipe through views on mobile.

Features:

  • Animated swiping through views.
  • Configure views to skip over.
  • Set the swipe length needed.
  • Option to disable a browsers default swipe actions.
  • Wrap from first view to last view and vice versa.

This project is currently maintained by @Zanna_37 :

Big thanks to:

40 Likes
2

I’m surprised this hasn’t been done before. Quite an obvious feature to have!

Will give it a try!

3 Likes
3

Awesome Job! Works good even if a bit laggy.

WAY better than the alternative tho.

Thanks.

4

Wow, thank you so much! It works amazingly well for a first version. The only problem I’ve noticed so far is that it’s sometimes too sensitive and changes the view even though it wasn’t intended.

Will you also add support for the custom updater in the future? Or ist this just a POC and will be merged into custom compact header?

5

Just updated to add custom updater support and changed swipe amount to be based on a percentage of screen width. If you take a look at the code in the .js file you can see it’s now configurable in there as well.

I’m undecided on keeping this as a separate project or adding it to CCH or both. Adding it to CCH would allow for easy configuration if/when more options get added.

1 Like
6

I’ve been waiting for this for months, you are a hero sir.

Someone told me once it was doable with the swipe card however I never managed to make it (and that also meant no more tabs). I will try this tonight. But the comments sound promising. Great work!

Edit: just one question, the update log says “configurable swipe based on screen width percent”, but the readme says: “no configuration required”.

So what part is configurable? And how to do that?

7

If you look in the js file there is a config section at the very top. You shouldn’t need to configure anything, but if you want to play with swipe length do it there.

8

I have tried it, works fantastically (no animations though, but that is fine). However I have one question, would it be possible to make swipe to the left unavailable when on the first page? Now it will take you back to the last page. (Not a big deal) but I only have 5 tabs in my setup (down from 15) as I prefer it to be clean.

Anyways thanks a lot for this amazing work!

9

I’ll add a config option to turn off wrapping in the next release. Thanks!

10

Update 1.0.3

  • Added option to turn off wrapping from first to last tab and vice versa.
  • Prevent navigation to a tab hidden by compact-custom-header.
1 Like
11

Great work! You made me and my wife happy. This was the only thing missing since I left Homekit (oh and the scenes like homekit but that is another discussion haha).

12

I’m not having any success. Simple setup, but on my iPhone 12.2, iOS App 2.0 (35), and HA 92.0 no go.

13

I don’t own any iOS devices to test the iOS app. If you use a browser on the same device instead of the app, does it work?

14

Yes. Once a tab has been visited, I can swipe to it.

15

Not sure if this will ever be able to support the iOS app then. Will add it as a known issue to the readme.

1 Like
16

Too bad. Nice feature. I successfully use CCH. Thanks!

17

Works fine here with the iOS app.

Using HA 0.92.1, iOS 12.2, app 2.0 (35).

1 Like
18

Interesting, but good to hear. Thanks!

19

OK. Up to 92.1. Still not working.

20

It does I use the ios app, it is fantastic!

1 Like