• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

maykar/lovelace-swipe-navigation: ↔️ Swipe through Lovelace views on mobile.

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称(OpenSource Name):

maykar/lovelace-swipe-navigation

开源软件地址(OpenSource Url):

https://github.com/maykar/lovelace-swipe-navigation

开源编程语言(OpenSource Language):

JavaScript 100.0%

开源软件介绍(OpenSource Introduction):

Archived

This project has been archived, but a maintained fork can be found here:

https://github.com/zanna-37/hass-swipe-navigation

Big thanks to @zanna-37!

Lovelace Swipe Navigation

hacs_badge hacs_badge

Swipe through Lovelace views on mobile.

Features:

  • Animated swiping through Lovelace 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.
  • Support RTL languages.

Installation:

Follow only one of these installation methods.

Installation and tracking with HACS:
  1. In "Frontend" hit the plus at the bottom right, search for "swipe navigation" and install.

  2. Refresh the Lovelace page, may need to clear cache.

Manual installation:
  1. Copy swipe-navigation.js from the latest release into /www/lovelace-swipe-navigation/

  2. Add the resource in ui-lovelace.yaml or in Lovelace Resources.

resources:
  # increase this version number at end of URL after each update
  - url: /local/lovelace-swipe-navigation/swipe-navigation.js?v=1.0.0
    type: module
  1. Refresh the page, may need to clear cache.

Config:

Mark Watt does an excellent job covering configuation in this youtube video.

  • Configuration is done in the root of your lovelace configuration.
  • If you just want to use the default config values you don't need to add a config at all.

Config Options:

Name Type Default Description
swipe_amount number 15 Minimum percent of screen needed to be swiped in order to navigate.
skip_tabs string A comma seperated list of views to skip when swiping. e.g., 1,3,5.
skip_hidden boolean true Automatically skips hidden tabs.
wrap boolean true Wrap from first tab to last tab and vice versa.
prevent_default boolean false Prevents the browsers default horizontal swipe actions. May require a browser refresh to take effect, if using an HA companion app this can be done by closing the app and reopening.
animate string Swipe animations. Can be: swipe, fade, flip. The swipe animation should be considered experimental and depending on your setup may appear buggy.

Example:
Don't just copy the example, it won't fit your needs. Build your own using the config options above.

swipe_nav:
  wrap: false
  animate: swipe
  skip_tabs: 5,6,7,8
  prevent_default: true
  swipe_amount: 30
  
views:

Thank you

Big thanks to:




鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap