[CARTE] Swiper card

Hello, voici une carte que je viens juste de decouvrir et qui me paraît intéressante : je vous la partage donc pour ceux qui ne la connaissent pas :

(GitHub)

Je pense que je vais la tester.

Pour ceux qui l’utilise déjà, si vous le souhaitez vous pouvez partager vos cartes et configuration dans un post.

Quelques images (tirées du lien du topic EN) :
Il faut cliquer sur l’image pour démarrer le gif
image

image

image

image

2 « J'aime »

J’ai mis a jour ton post et le nom du topic pour la recherche sur le site.


J’ai utilisé cette carte fut un temps (il doit peut être m’en rester une dans une de mes pages de tests).

Je trouve cette carte fabuleuse, mais la configuration au début est plus compliquée que d’autre carte je trouve car la documentation renvoi sur vers la page de l’API, et au début, ça peux effrayer.

Ce que je peux conseiller c’est de parcourir (en entier…?) le post de la communauté mondiale, car il y a beaucoup de configurations intéressantes.

Je vais essayer de retrouver ma configuration, qui n’a rien de bien folichon, mais je sais que je l’avais imbriquée, ça pourra donner des idées à certain.
edit: non, je ne l’ai plus.

1 « J'aime »

Je viens de me rendre compte que le mot-clé swipe sur hacf, renvoi quelques résultat… :+1:

Super @Clemalex :+1: merci d’avoir partagé ton expérience sur cette carte :wink:

Vu effectivement sur le post de @McFly , c’est facile à mettre en oeuvre et puissant car ça peut permettre d’améliorer la lisibilité de son lovelace en occupant la place d’1 carte pour afficher 2, 3 cartes :+1:

Et il y a beaucoup plus de paramètres…

1 « J'aime »

Hello
j’aurais une question au sujet de la swipe card
Pour mon interface j’ai plusieurs boutons que j’utilise pour la navigation
j’ai rajouter des boutons mais du coup cela alourdis un peu le visuel, je me suis donc penché sur la swipe card
J’ai ceci
image

avec ce code :

      - type: custom:swipe-card
        cards:
          - type: horizontal-stack
            cards:
              - type: custom:mushroom-template-card
                icon: mdi:home
                layout: vertical
                icon_color: blue
                tap_action:
                  action: navigate
                  navigation_path: home
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }
              - type: custom:mushroom-template-card
                icon: mdi:lightbulb
                layout: vertical
                icon_color: yellow
                tap_action:
                  action: navigate
                  navigation_path: lumiere
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }
              - type: custom:mushroom-template-card
                icon: mdi:window-shutter
                layout: vertical
                icon_color: white
                tap_action:
                  action: navigate
                  navigation_path: volets
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }
              - type: custom:mushroom-template-card
                icon: mdi:garage-variant
                layout: vertical
                icon_color: green
                tap_action:
                  action: navigate
                  navigation_path: Garage
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }
              - type: custom:mushroom-template-card
                icon: mdi:thermometer
                layout: vertical
                icon_color: red
                tap_action:
                  action: navigate
                  navigation_path: Température
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }
              - type: custom:mushroom-template-card
                icon: mdi:security
                layout: vertical
                icon_color: cyan
                tap_action:
                  action: navigate
                  navigation_path: Température
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                      }        
              - type: custom:mushroom-template-card
                icon: mdi:multimedia
                layout: vertical
                icon_color: purple
                tap_action:
                  action: navigate
                  navigation_path: multimedia
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }
              - type: custom:mushroom-template-card
                icon: mdi:home-assistant
                layout: vertical
                icon_color: '#87cefa'
                tap_action:
                  action: navigate
                  navigation_path: multimedia
                card_mod:
                  style: |
                    ha-card {
                    box-shadow: none;
                    background: none;
                          }

je n’ai pas trouvé comment espacer chaque boutons de Xpx pour qu’il y’ai que 6 boutons à l’écran par exemple.
Avez vous une solution svp ?

Merci

EDIT: ok autant pour moi, il faut que je créer plusieurs horizontal-stack avec le nombre de boutons que je souhaite

Cette carte semble sympa mais sur le github il n’a plus de version a jour

Est ce qu’il y a une nouvelle version ou bien celle-ci fonctionne ?

le bon github est GitHub - bramkragten/swipe-card: Card that allows you to swipe throught multiple cards for Home Assistant Lovelace , ca du changer depuis les années passer .

merci pour la réponse

Bonjour, je suis en train de faire plus ou moins la même chose et ton code ressemble au mien :

  • chaque bouton renvoi vers une autre page via le tap_action

Par contre j’ai un soucis que je n’arrive pas à débloquer : sur pc cela fonctionne très bien…mais sur mobile, quand on « slide » pour afficher les autres entrées, cela exécute aussi le « tap_action » du bouton sur lequel on appuie « forcément » quand on fait le geste…

Est-ce ton cas aussi? Je cherche dans les paramètres du site Swipe card : comment ne faire défiler qu’avec les boutons? sans succès.

Merci d’avance!

Auto-réponse si ca peut aider certains : j’ai trouvé mon bonheur avec le mod « tabbed-card » qui correspond à mon besoin sans usage « détourné » de « swipe-card ».

Si jamais cela peut aider…https://github.com/kinghat/tabbed-card

Salut
j’ai refait le test, je n’ai pas de souci sur téléphone ou sur mon écran NS, la carte change bien de vue sans ouvrir les boutons

Bonjour

je n’ai pas rencontré le problème, par contre j’ay essayé d’avoir un défilement infini mais il affiche a chaque fois une carte vide avant de repartir de la première card. C’est étrange