Débutant
1 MIN

Animer un bouton avec un Custom State

Dans ce tout premier épisode de Tips & Tutos, nous allons voir comment animer un bouton grâce à l'utilisation intelligente d'un Custom State.
Illustration de comment animer bouton custom state
Clement Ballion, expert Bubble.io & No code
Clément Ballion
Fondateur Emvpee & Expert Bubble.io.
Logo LinkedinPhone iconeMail icone

Les Custom States, ce sont des variables temporaires qui nous permettent de créer des éléments visuels dans nos applications sans avoir à faire de changements en base de données.

Dans cet épisode de Tips &Tutos, on va voir l'utilisation d'un Custom State la plus simple qui soit : Animer un bouton.

A découvrir aussi : Comment changer d'interface avec un Custom State

1️⃣ Etape 1 : Créer le Custom State

→ Cliquer sur le bouton > Créer un Custom State > Type Oui/Non (Valeur par default : NON)

Capture création Custom State

2️⃣ Etape 2 : Créer un conditionnel sur le bouton pour en changer le visuel (lorsque le Custom State passe en OUI).

When This button's Custom State is OUI
→ Changer le label et la couleur.

Capture conditionnel Bouton

3️⃣ Etape 3 : Editer le Workflow du bouton

When this button is clicked :

1. Set state of an Element > le bouton > son Custom State > OUI
2. Add a pause (1500 ms)
3. Set state of an Element > le bouton > son Custom State > NON
4. Réaliser l'action (créer produit dans ce tutoriel)

Capture création Workflow - Custom State

Bannière EMVPEE

Une idée d'application ?

On t'accompagne dans la création de ton App Bubble de A à Z.

  • Conception sur mesure
  • Intégrations API
  • Optimisation performances
  • Formation de prise en main

Nos derniers Tips & Tutos

Retrouvez nos derniers Tips & Tutos sur Bubble et ne manquez pas les suivants !

Tous les Tips & Tutos