Aller au contenu principal

Atelier 8 : Gestionnaire de tâches interactif

Description du projet​

Vous allez créer une application JavaFX de gestion de tâches avec les fonctionnalités suivantes :

  1. Ajout de tâches : Un champ texte pour entrer une nouvelle tâche et un bouton pour l'ajouter
  2. Contrôle de priorité : Un slider pour définir la priorité (1 à 5) avec affichage en temps réel via ChangeListener
  3. Liste de tâches : Affichage des tâches avec leur priorité
  4. Drag & Drop : Possibilité de glisser-déposer des tâches pour les réorganiser
  5. Gestion au clavier : Appuyer sur Entrée dans le champ texte pour ajouter rapidement une tâche

Interface attendue​

L'application doit contenir :

Zone de saisie​

  • Un TextField avec le texte d'invite "Entrez une nouvelle tâche..."
  • Un Button "Ajouter" à côté du champ texte
  • Ces deux éléments doivent être dans un HBox

Zone de priorité​

  • Un Label "Priorité :"
  • Un Slider avec des valeurs de 1 à 5, valeur par défaut 3
    • Afficher les graduations et les marques
    • Incrément majeur de 1
    • Accrocher aux graduations (snap to ticks)
  • Un Label pour afficher la priorité actuelle (ex: "Priorité : 3")
  • Ces éléments doivent être dans un VBox

Zone de liste​

  • Un VBox qui contiendra toutes les tâches
  • Ce VBox doit être dans un ScrollPane pour permettre le défilement
  • Fond gris (#f0f0f0) avec bordure (#ccc)

Tâche individuelle​

Chaque tâche doit :

  • Afficher la priorité et le texte (ex: "[P3] Faire les courses")
  • Avoir un bouton "X" pour la supprimer
  • Avoir une couleur de fond selon la priorité :
    • Priorité 1-2 : Vert (#c8e6c9)
    • Priorité 3 : Jaune (#fff9c4)
    • Priorité 4-5 : Rouge (#ffcdd2)
  • Être contenue dans un HBox avec padding et bordure

Partie 1 : EventHandler​

Étape 1.1 : Ajouter une tâche avec le bouton​

Créez un EventHandler pour le bouton "Ajouter" qui :

  • Récupère le texte du champ et le nettoie (trim)
  • Vérifie que le texte n'est pas vide
  • Récupère la valeur actuelle du slider de priorité
  • Crée un nouveau composant de tâche avec le texte et la priorité
  • Ajoute ce composant à la liste des tâches
  • Vide le champ texte

Étape 1.2 : Ajouter une tâche avec la touche Entrée​

Créez un EventHandler sur le champ texte qui :

  • Détecte lorsque l'utilisateur appuie sur la touche Entrée
  • Déclenche l'action du bouton "Ajouter"
  • Consomme l'événement pour éviter le bip sonore

Partie 2 : ChangeListener​

Étape 2.1 : Afficher la priorité en temps réel​

Ajoutez un ChangeListener sur la propriété valueProperty() du slider qui :

  • Met à jour le texte du label de priorité avec la nouvelle valeur
  • Convertit la valeur en entier pour l'affichage

Étape 2.2 : Changer la couleur selon la priorité​

Modifiez le ChangeListener pour également :

  • Changer la couleur de fond du label selon la priorité :
    • Priorité 1-2 : Vert (#c8e6c9)
    • Priorité 3 : Jaune (#fff9c4)
    • Priorité 4-5 : Rouge (#ffcdd2)
  • Ajouter un padding de 5 pixels au label

Partie 3 : Drag & Drop​

Étape 3.1 : Créer une méthode pour générer une tâche​

Créez une méthode creerTache(String texte, int priorite) qui retourne un HBox contenant :

  • Un Label affichant "[Priorité}] texte"
  • Un Button "X" pour supprimer la tâche
  • Le fond coloré selon la priorité
  • Un EventHandler sur le bouton de suppression qui retire la tâche de la liste

Utilisez cette méthode dans votre code d'ajout de tâche.

Étape 3.2 : Implémenter le glisser-déposer​

Dans la méthode creerTache, ajoutez les gestionnaires de drag & drop sur le HBox retourné :

1. Démarrer le drag (setOnDragDetected)​

  • Démarrer le drag avec le mode TransferMode.MOVE
  • Créer un ClipboardContent et y mettre le texte de la tâche
  • Placer ce contenu dans le Dragboard
  • Consommer l'événement

2. Autoriser le survol (setOnDragOver)​

  • Vérifier que la source n'est pas la tâche elle-même
  • Vérifier que le Dragboard contient une chaîne
  • Accepter le mode de transfert MOVE
  • Consommer l'événement

3. Gérer le dépôt (setOnDragDropped)​

  • Récupérer le Dragboard
  • Si le Dragboard contient une chaîne :
    • Trouver l'index de la tâche source (celle qui est traînée)
    • Trouver l'index de la tâche cible (celle sur laquelle on dépose)
    • Retirer la tâche source de la liste
    • Réinsérer la tâche source à l'index de la cible
    • Marquer l'opération comme réussie
  • Indiquer si le drop a réussi avec setDropCompleted
  • Consommer l'événement

4. Fin du drag (setOnDragDone)​

  • Consommer l'événement (optionnel, pour compléter le cycle)