CheckZone

3 Boutons CheckZone Voir CheckZone: Exemple-920-CheckZone-3-onSelectFunction.ino
3 fonctions externes Voir CheckZone: Exemple-920-CheckZone-3-onSelectFunction.ino
1 fonction externe indiférenciée Voir CheckZone: Exemple-921-CheckZone-1-onSelectFunction.ino
1 fonction tri sur l'ordonnée Voir CheckZone: Exemple-922-CheckZone-Suivant-ordonnee.ino
loop() fait le travail Voir CheckZone: Exemple-923-CheckZone-loop.ino
loop() fait le travail, avec mémorisation Voir CheckZone: Exemple-924-CheckZone-Memoire.ino
Pour se détendre, utilisation de CheckZone Voir CheckZone: Exemple-925-Maison-CheckZone.ino

Dans les exemples qui suivent trois boutons sont placées à droite de l'écran. Leur définition est statique, on peut aussi les passere en dynamiques, cela ne change rien. Il y a plusieurs implantations possibles pour lire l'état des boutons et l'afficher. J'en montre ici 5, il y en a d'autres, par exemple par la lecture de la liste des contrôles. Le programme affiche l'état des boutons.

Premier exemple: 3 fonctions externes

PecheuxGraph.zip\PecheuxGraph\examples\Documentation\Exemple-920-CheckZone-3-onSelectFunction\Exemple-920-CheckZone-3-onSelectFunction.ino (dans votre fichier téléchargé):

// Mise em place de 3 boutons de type CheckZone (zone à cocher, pas de dessin
// dans le bouton). Quand on appuie sur un bouton, un disque blanc montre son
// activité

// Version 1:
// - Les boutons ont une définition statique
// - Utilise onSelectFunction pour exécuter l'action à faire
// - Une action différente pour chaque bouton

#include <PecheuxGraph.h> // Appel de la bibliothèque 


// Déclaration statique des instances, doit se faire en dehors du setup
// Dans ce cas les boutons sont accessibles partout
CheckZone boutonHaut(200,40,240,80); // Bouton en haut
CheckZone boutonCentre(200,100,240,140); // Bouton au centre
CheckZone boutonBas(200,160,240,200); // Bouton en bas


// Déclaration de 3 fonctions, une par bouton, qui feront ce qu'il faut
// faire à chaque changement
// Ces fonctions ne doivent pas avoir de paramètres et ne doit rien retourner
// Les noms peuvent être quelconques
void onSelectActionHaut() // Action à faire quand on appuie sur le bouton du haut
{
  if (boutonHaut.isSelected()) fillCircle(100,60,20,WHITE);
  else fillCircle(100,60,20,BLACK);
}


void onSelectActionCentre() // Action à faire quand on appuie sur le bouton du centre
{
  if (boutonCentre.isSelected()) fillCircle(100,120,20,WHITE);
  else fillCircle(100,120,20,BLACK);
}


void onSelectActionBas() // Action à faire quand on appuie sur le bouton du bas
{
  if (boutonBas.isSelected()) fillCircle(100,180,20,WHITE);
  else fillCircle(100,180,20,BLACK);
}


void setup()
{
  setGraphMode(PAYSAGE); // Initialisation de la carte
  rect(200,40,240,80,GREEN); // Carré du haut
  rect(200,100,240,140,GREEN); // Carré au centre de l'écran
  rect(200,160,240,200,GREEN); // Carré du bas
  text(F("Appuyez sur un carré"));
  
  boutonHaut.onSelectFunction=&onSelectActionHaut; // Fonction appelée si on active le bouton du haut de l'écran
  boutonCentre.onSelectFunction=&onSelectActionCentre; // Fonction appelée si on active le bouton au milieu de l'écran
  boutonBas.onSelectFunction=&onSelectActionBas; // Fonction appelée si on active le bouton en bas de l'écran
  boutonHaut.onUnselectFunction=&onSelectActionHaut; // Fonction appelée si on désactive le bouton du haut de l'écran
  boutonCentre.onUnselectFunction=&onSelectActionCentre; // Fonction appelée si on désactive le bouton au milieu de l'écran
  boutonBas.onUnselectFunction=&onSelectActionBas; // Fonction appelée si on désactive le bouton en bas de l'écran
}


void loop() 
{
  scanEvent(); // Gestion des boutons et des horloges, le plus souvent seul dans le loop
}

Deuxième exemple: 1 fonction externe indiférenciée

PecheuxGraph.zip\PecheuxGraph\examples\Documentation\Exemple-921-CheckZone-1-onSelectFunction\Exemple-921-CheckZone-1-onSelectFunction.ino (dans votre fichier téléchargé):

// Mise em place de 3 bouton de type CheckZone (zone à cocher, pas de dessin
// dans le bouton). Quand on appuie sur un bouton, un disque blanc montre son
// activité

// Version 2:
// - Les boutons ont une définition statique
// - Utilise onSelectFunction pour exécuter l'action à faire
// - Une seule action pour les trois boutons, qui ne fait pas de différence entre les boutons

#include <PecheuxGraph.h> // Appel de la bibliothèque 


// Déclaration statique des instances, doit se faire en dehors du setup
// Dans ce cas les boutons sont accessibles partout
CheckZone boutonHaut(200,40,240,80); // Bouton en haut
CheckZone boutonCentre(200,100,240,140); // Bouton au centre
CheckZone boutonBas(200,160,240,200); // Bouton en bas


// Déclaration d'une fonction qui fera ce qu'il faut faire à chaque changement
// Cette fonction ne doit pas avoir de paramètres et ne doit rien retourner
// Le nom peut être quelconque
void onSelectAction() // Action à faire quand on appuie sur un bouton
{
  if (boutonHaut.isSelected()) fillCircle(100,60,20,WHITE); // On s'occupe du premier bouton
    else fillCircle(100,60,20,BLACK);
  if (boutonCentre.isSelected()) fillCircle(100,120,20,WHITE); // Puis du deuxème
    else fillCircle(100,120,20,BLACK);
  if (boutonBas.isSelected()) fillCircle(100,180,20,WHITE); // Puid du troisième
    else fillCircle(100,180,20,BLACK);
}


void setup()
{
  setGraphMode(PAYSAGE); // Initialisation de la carte
  rect(200,40,240,80,GREEN); // Carré du haut
  rect(200,100,240,140,GREEN); // Carré au centre de l'écran
  rect(200,160,240,200,GREEN); // Carré du bas
  text(F("Appuyez sur un carré"));
  
  // Ici j'utilise pour l'exemple la triple affectation. Au lieu d'écrire a=1; b=1; c=1; on peut
  // écrire a=b=c=1 Cela doit se lire j'affecte 1 à c, cette affectation prned la valeur 1 et c'est
  // cette valeur que j'afffecte à b. Cettenouvelle afectation retourne 1 que j'affecte à a.
  boutonHaut.onSelectFunction= // Fonction appelée si on active le bouton du haut de l'écran
  boutonCentre.onSelectFunction= // Fonction appelée si on active le bouton au milieu de l'écran
  boutonBas.onSelectFunction=&onSelectAction; // Fonction appelée si on active le bouton en bas de l'écran
  boutonHaut.onUnselectFunction= // Fonction appelée si on désactive le bouton du haut de l'écran
  boutonCentre.onUnselectFunction= // Fonction appelée si on désactive le bouton au milieu de l'écran
  boutonBas.onUnselectFunction=&onSelectAction; // Fonction appelée si on désactive le bouton en bas de l'écran
}


void loop() 
{
  scanEvent(); // Gestion des boutons et des horloges, le plus souvent seul dans le loop
}

Troisième exemple: 1 fonction tri sur l'ordonnée

PecheuxGraph.zip\PecheuxGraph\examples\Documentation\Exemple-922-CheckZone-Suivant-ordonnee\Exemple-922-CheckZone-Suivant-ordonnee.ino (dans votre fichier téléchargé):

// Mise em place de 3 bouton de type CheckZone (zone à cocher, pas de dessin
// dans le bouton). Quand on appuie sur un bouton, un disque blanc montre son
// activité

// Version 3:
// - Les boutons ont une définition statique
// - Utilise onSelectFunction pour exécuter l'action à faire
// - Une seule action pour les trois boutons, différence faites sur les coordonnées

#include <PecheuxGraph.h> // Appel de la bibliothèque 


// Déclaration statique des instances, doit se faire en dehors du setup
// Dans ce cas les boutons sont accessibles partout
CheckZone boutonHaut(200,40,240,80); // Bouton en haut
CheckZone boutonCentre(200,100,240,140); // Bouton au centre
CheckZone boutonBas(200,160,240,200); // Bouton en bas


// Déclaration d'une fonction qui fera ce qu'il faut faire à chaque changement
// Cette fonction ne doit pas avoir de paramètres et ne doit rien retourner
// Le nom peut être quelconque
void onSelectAction() // Action à faire quand on appuie sur un bouton
{
  int y=getTouchY();
  if (y<90) // On a touché sur le bouton du haut
  {
    if (boutonHaut.isSelected()) fillCircle(100,60,20,WHITE); // On s'occupe du premier bouton
    else fillCircle(100,60,20,BLACK);
  }
  else if (y>150) // On a touché sur le bouton du bas
  {
    if (boutonBas.isSelected()) fillCircle(100,180,20,WHITE); // Puid du troisième
    else fillCircle(100,180,20,BLACK);
  }
  else // on a donc forcément touché sur le bouton du milieu
  { // (Accolades inutiles pour le dernier cas)
    if (boutonCentre.isSelected()) fillCircle(100,120,20,WHITE); // Puis du deuxème
    else fillCircle(100,120,20,BLACK);
  }  
}


void setup()
{
  setGraphMode(PAYSAGE); // Initialisation de la carte
  rect(200,40,240,80,GREEN); // Carré du haut
  rect(200,100,240,140,GREEN); // Carré au centre de l'écran
  rect(200,160,240,200,GREEN); // Carré du bas
  text(F("Appuyez sur un carré"));
  
  boutonHaut.onSelectFunction=  // Fonction appelée si on active le bouton du haut de l'écran
  boutonCentre.onSelectFunction= // Fonction appelée si on active le bouton au milieu de l'écran
  boutonBas.onSelectFunction= // Fonction appelée si on active le bouton en bas de l'écran
  boutonHaut.onUnselectFunction= // Fonction appelée si on désactive le bouton du haut de l'écran
  boutonCentre.onUnselectFunction= // Fonction appelée si on désactive le bouton au milieu de l'écran
  boutonBas.onUnselectFunction=&onSelectAction; // Fonction appelée si on désactive le bouton en bas de l'écran
}


void loop() 
{
  scanEvent(); // Gestion des boutons et des horloges, le plus souvent seul dans le loop
}

Quatrième exemple: 3 boutons, loop() fait le travail

PecheuxGraph.zip\PecheuxGraph\examples\Documentation\Exemple-923-CheckZone-loop\Exemple-923-CheckZone-loop.ino (dans votre fichier téléchargé):

// Mise em place de 3 bouton de type CheckZone (zone à cocher, pas de dessin
// dans le bouton). Quand on appuie sur un bouton, un disque blanc montre son
// activité

// Version 4:
// - Les boutons ont une définition statique
// - Teste dans le loop sans utiliser onSelectFunction

#include <PecheuxGraph.h> // Appel de la bibliothèque 


// Déclaration statique des instances, doit se faire en dehors du setup
// Dans ce cas les boutons sont accessibles partout
CheckZone boutonHaut(200,40,240,80); // Bouton en haut
CheckZone boutonCentre(200,100,240,140); // Bouton au centre
CheckZone boutonBas(200,160,240,200); // Bouton en bas


void setup()
{
  setGraphMode(PAYSAGE); // Initialisation de la carte
  rect(200,40,240,80,GREEN); // Carré du haut
  rect(200,100,240,140,GREEN); // Carré au centre de l'écran
  rect(200,160,240,200,GREEN); // Carré du bas
  text(F("Appuyez sur un carré"));
  }


void loop() 
{
  scanEvent(); // Gestion des boutons et des horloges, d'habitude seul dans le loop


  // On va tester systématiquement l'état des boutons. Dans la vraie vie, on ne ferai le
  // test que si on en a besoin. Si c'est pour faire le test systématique, autant passer
  // par onSelectFunction. Ici c'est pour montrer que cela est possible.
  // Ici on surcharge beaucoup la boucle loop(), le dessin est fait systématiquement.
  // On manque des inforlmations rapides sur les boutons
  if (boutonHaut.isSelected()) fillCircle(100,60,20,WHITE); // On s'occupe du premier bouton
    else fillCircle(100,60,20,BLACK);
  
  if (boutonBas.isSelected()) fillCircle(100,180,20,WHITE); // Puis du troisième
    else fillCircle(100,180,20,BLACK);
  
  if (boutonCentre.isSelected()) fillCircle(100,120,20,WHITE); // Puis du deuxème
    else fillCircle(100,120,20,BLACK);
}

Cinquième exemple: 3 boutons, loop() fait le travail, avec mémorisation

PecheuxGraph.zip\PecheuxGraph\examples\Documentation\Exemple-924-CheckZone-Memoire\Exemple-924-CheckZone-Memoire.ino (dans votre fichier téléchargé):

// Mise em place de 3 bouton de type CheckZone (zone à cocher, pas de dessin
// dans le bouton). Quand on appuie sur un bouton, un disque blanc montre son
// activité

// Version 5:
// - Les boutons ont une définition statique
// - Teste dans le loop sans utiliser onSelectFunction
// - On mémorise les actions faites pour ne pas surcharger loop()

#include <PecheuxGraph.h> // Appel de la bibliothèque 


// Déclaration statique des instances, doit se faire en dehors du setup
// Dans ce cas les boutons sont accessibles partout
CheckZone boutonHaut(200,40,240,80); // Bouton en haut
CheckZone boutonCentre(200,100,240,140); // Bouton au centre
CheckZone boutonBas(200,160,240,200); // Bouton en bas


// Pour mémoriser les actions faites, on a recours à trois variables
// qui vont permettre de savoir si un bouton a changé
boolean ancienEtatBoutonHaut; // ancien état du bouton du haut
boolean ancienEtatBoutonCentre; // ancien état du bouton du centre
boolean ancienEtatBoutonBas; // ancien état du bouton du bas


void setup()
{
  setGraphMode(PAYSAGE); // Initialisation de la carte
  rect(200,40,240,80,GREEN); // Carré du haut
  rect(200,100,240,140,GREEN); // Carré au centre de l'écran
  rect(200,160,240,200,GREEN); // Carré du bas
  text(F("Appuyez sur un carré"));
  }


void loop() 
{
  scanEvent(); // Gestion des boutons et des horloges, d'habitude seul dans le loop

  // On va tester systématiquement l'état des boutons pour savoir si l'un d'eux a changé.
  // Si c'est le cas, on agit.
  // Ici on surcharge peu la boucle loop(), le dessin est fait que si nécessaire.
  if (boutonHaut.isSelected()!=ancienEtatBoutonHaut)
  { // Le bouton haut a changé d'état, on le redessine
    if (boutonHaut.isSelected()) fillCircle(100,60,20,WHITE); // On s'occupe du premier bouton
    else fillCircle(100,60,20,BLACK);
    ancienEtatBoutonHaut=boutonHaut.isSelected(); // Et on met à jour la mémoire
  }
  
  if (boutonCentre.isSelected()!=ancienEtatBoutonCentre)
  { // Le bouton du centre a changé d'état, on le redessine
    if (boutonCentre.isSelected()) fillCircle(100,120,20,WHITE); // Puid du troisième
    else fillCircle(100,120,20,BLACK);
    ancienEtatBoutonCentre=boutonCentre.isSelected(); // Et on met à jour la mémoire
  }
  
  if (boutonBas.isSelected()!=ancienEtatBoutonBas)
  { // Le bouton bas a changé d'état, on le redessine
    if (boutonBas.isSelected()) fillCircle(100,180,20,WHITE); // Puis du deuxème
    else fillCircle(100,180,20,BLACK);
    ancienEtatBoutonBas=boutonBas.isSelected(); // Et on met à jour la mémoire
  }
}

Sixième exemple: 3 boutons, 3 fonctions externes

PecheuxGraph.zip\PecheuxGraph\examples\Documentation\Exemple-925-Maison-CheckZone\Exemple-925-Maison-CheckZone.ino (dans votre fichier téléchargé):

// L'intérieur d'une maison est dessinée. Deux boutons de type CheckZone 
// permettent d'allumer la lumière. Ce sont des va et vient (boutons à 2
// positions comme les cases à cocher)

#include <PecheuxGraph.h>

// Déclaration statique des instances, doit se faire en dehors du setup
// Dans ce cas les boutons sont accessibles partout
CheckZone bouton1(186, 124, 212, 152); // Définit une zone cliquable à droite
CheckZone bouton2(8, 124, 34, 152); // Définit une zone cliquable à droite

// Déclaration d'une fonction qui fait ce qu'il faut faire à chaque changement
// Cette fonction ne doit pas avoir de paramètres et ne doit rien retourner
// Le nom peut être quelconque
// Cette fonction allume ou éteint la lampe. Elle est allumée si un seul des
// deux boutons est actif. C'est pour celaqu'on utilise le ou-exclusif ^
void lampe()
{
  fill(160, 30+1, bouton1.isSelected() ^ bouton2.isSelected() ? YELLOW : BLACK); // La lampe copie l'état des boutons
}


void setup()
{
  bouton1.onSelectFunction = &lampe; // Change l'état de la lampe si on active le bouton de droite
  bouton2.onSelectFunction = &lampe; // Change l'état de la lampe si on active le bouton de gauche
  bouton1.onUnselectFunction = &lampe; // Change l'état de la lampe si on désactive le bouton de droite
  bouton2.onUnselectFunction = &lampe; // Change l'état de la lampe si on désactive le bouton de gauche

  setGraphMode(PAYSAGE); // Initialisation

  // Consigne
  setTextCursor(10, 200);
  text(F("Appuyez sur un bouton de\n  chaque côté de la fenêtre"));

  maison(1,1); // avec 2 boutons
}

void loop()
{
  scanEvent(); // Gestion des boutons et des horloges, le plus souvent seul dans le loop
}

Voir aussi:
- scanEvent(); Moteur de la gestion des évènements
- PushZone; Bouton poussoir sans dessin
- CheckCoche; Bouton bistable (va vient) case à cocher
- CheckCircle; Bouton bistable (va vient) rond
- RadioZone; Bouton radio (un seul bouton actif parmi plusieurs) sans dessin