40
Architecture d’application L’apprentissage automatique appliqué au modèle MVC

Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Embed Size (px)

Citation preview

Page 1: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Architecture d’applicationL’apprentissage automatique appliqué au modèle MVC

Page 2: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Plan de présentation Introduction Le modèle MVC Utilisation de la Kinect

Page 3: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Introduction L’objectif de ce cours de

vous montrer le modèle MVC.

Pour nous amuser un peu, nous allons utiliser le sdk 1,8 de la Kinect pour implémenter la théorie vue en classe.

Pour sauver du temps, est-ce que vous pouvez télécharger le SDK pendant le cours.

Page 4: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Le modèle MVC Le Modèle-Vue-Contrôleur est

un patron d'architecture et une méthode de conception qui organise globalement les classes d’une application.

Ce paradigme divise l’application en trois partie: un modèle (modèle de

données), une vue (présentation, interface

utilisateur) et un contrôleur (logique de

contrôle, gestion des événements, synchronisation).

Page 5: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Le modèle

Page 6: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Le modèle Le modèle représente le comportement de

l'application : traitements des données, interactions avec la base de données, etc.

Il décrit ou contient les données manipulées par l'application.

Il assure la gestion de ces données et garantit leur intégrité. Dans le cas typique d'une base de données, c'est le modèle qui la gère. Le modèle offre des méthodes pour mettre à jour ces données (insertion, suppression, changement de valeur). Il offre aussi des méthodes pour récupérer ces données.

Page 7: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

La vue

Page 8: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

La vue La vue correspond à l'interface avec laquelle

l'utilisateur interagit. Sa première tâche est de présenter les résultats. Sa seconde tâche est de recevoir toutes les actions

de l'utilisateur (clic de souris, sélection d'une entrée, boutons, etc.). Ces différents événements sont envoyés au contrôleur.

La vue n'effectue aucun traitement, elle se contente d'afficher les résultats des traitements effectués.

Page 9: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Le contrôleur

Page 10: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Le contrôleur Le contrôleur prend en charge la gestion des événements de

synchronisation pour mettre à jour la vue ou le modèle et les synchroniser.

Il reçoit tous les événements de l'utilisateur et enclenche les actions à effectuer. Si une action nécessite un changement des données, le contrôleur demande la modification des données au modèle, ce dernier avertit la vue que les données ont changée pour qu'elle se mette à jour. Certains événements de l'utilisateur ne concernent pas les données, mais la vue. Dans ce cas, le contrôleur demande à la vue de se modifier. Le contrôleur n'effectue aucun traitement, ne modifie aucune donnée. Il analyse la requête du client et se contente d'appeler le modèle adéquat et de renvoyer la vue correspondant à la demande.

Page 11: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

En résumé En résumé, lorsqu'un client envoie une requête à

l'application :1. la requête envoyée depuis la vue est analysée par le

contrôleur (par exemple un clic de souris pour lancer un traitement de données),

2. le contrôleur demande au modèle approprié d'effectuer les traitements et notifie à la vue que la requête est traitée,

3. la vue notifiée fait une requête au modèle pour se mettre à jour (par exemple affiche le résultat du traitement via le modèle).

Page 12: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Quels sont les patrons de conceptions de MVC?

Page 13: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Réponse Observer: Met à jour toute les vues Strategy: on pourrait utiliser plusieurs types de

modèles pour un Contrôleur dans la vue.

Page 14: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Différence avec l'Architecture trois tiers

L'architecture trois tiers est un modèle en couches, c'est-à-dire, que chaque couche communique seulement avec ses couches adjacentes (supérieures et inférieures) et le flux de contrôle traverse le système de haut en bas; les couches supérieures contrôlent les couches inférieures, c'est-à-dire, que les couches supérieures sont toujours sources d'interaction (clients) alors que les couches inférieures ne font que répondre à des requêtes (serveurs).

Dans le modèle MVC, il est généralement admis que la vue puisse consulter directement le modèle (lecture) sans passer par le contrôleur. Par contre, elle doit nécessairement passer par le contrôleur pour effectuer une modification (écriture). Ici, le flux de contrôle est inversé par rapport au modèle en couche, le contrôleur peut alors envoyer des requêtes à toutes les vues de manière à ce qu'elles se mettent à jour.

Page 15: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

En résumé!J'émets toutefois quelques réserves concernant ce pattern. Bien qu'il soit très utile grâce à ses avantages à long terme, celui-ci complique grandement votre code et peut le rendre très difficile à comprendre pour une personne extérieure à l'équipe de développement.

Le pattern MVC est un pattern composé du pattern observer et du pattern strategy.

Avec ce pattern, le code est découpé en trois parties logiques qui communiquent entre elles : Le modèle (données) La vue (fenêtre) Le contrôleur qui lie les deux.

L'implémentation du pattern observer permet au modèle de tenir informés ses observateurs.

L'implémentation du pattern strategy permet à la vue d'avoir des contrôles différents.

Page 16: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Exemple Aller chercher les documents d’exercice sur le

http://www.coupdeklaxon.ca Vue:

Demander le nom d’un fichier. Ajouter un bouton pour activer la lecture du fichier Ajouter un RichTextBox pour afficher les résultats

Controleur Vide pour le moment

Modèle Nous allons remplir une structure de données pour les

données et une pour les résultats. Résultat:

Afficher les données dans le RichTextBox.

Page 17: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Maintenant Amusons nous avec la Kinect!  Prenez le contrôle avec Kinect!

Page 18: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Évolution des interfaces

Source: http://homes.di.unimi.it/borghese/Teaching/IntelligentSystems/Seminari/kinecttrack-intro-131031061347-phpapp02.pdf

Page 20: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Kinect ? Qu’est ce que c’est ? Kinect est une caméra créée par

Microsoft La première caméra de détection et

retranscription de mouvement. Contrôler des logiciels et des jeux sans

souris ni clavier Interface naturelle (NUI) Windows Kinect VS Xbox Kinect

Page 21: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Éléments de la KinectÉmeteur (IR) Caméra RVB

Capteur de profondeur(IR)

Moteur

Microphones

Page 23: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Éléments de la Kinect

Le +/- 27 degrés vient du fait qu’il est possible de modifier l’angle de la Kinect de +/- 27 degrés.

Page 24: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Éléments de la Kinect

0.8m/2.6 ft

Page 25: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Éléments de la Kinect1.3’ 2.6’ 9.8’ 13.1’ 26.2’

.4 .8 3 4 8

DefaultMode

Near Mode

Pieds

Mètres

Inconnu Trop près Normal Trop loin

Page 26: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Possibilités de la Kinect Caméra BGRA Détection de la profondeur Détection de personne(Squelette) Reconnaissance vocale(si le temps le

permet)

Page 27: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Avant de commencer Si vous en manquer un bout de ma

présentation, vous pouvez aller sur le site suivant : http://

www.microsoft.com/en-us/kinectforwindowsdev/Start.aspx

Vous devez installer les éléments suivants Kinect for Windows SDK 1.8 Kinect for Windows Developer Toolkit 1.8

Connecter la Kinect (Tous les pilotes seront installés automatiquement)

Page 28: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

La caméra Résolutions :

640 * 480, 1280 * 1024 Format :

BGRA(Bleu, Vert, Rouge, Alpha) Evénementiel(AllFramesReady) Données fournies au travers d’un vecteur

de bytes BGRA (Rouge, Vert, Bleu, Alpha) Voici 4 pixels

B G R A B G R A B G R A ....

15 14 13 12 11 10 9 8 7 6 5 4

Page 29: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Caméra de profondeur Résolutions

640x480 320x240 80x60

Evénementiel Stockage sur 16 bits

13 bits pour la distance en millimètres depuis le capteur

3 bits pour donner l’index de la personne reconnue

Page 30: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Caméra de profondeur Retourne la distance et l’index du joueur

pour chaque pixel Ex: 320 x 240 = 76,800 pixels (x 16 bits) Distance en mm from Kinect ex: 2,000mm

1-6 Joueur(s) simultanément Ainsi pour chaque pixel, nous avons un

16-bit short

Page 31: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Caméra de profondeur Voici la représentation de deux pixels

D D D D D D D D D D D D D P P P

15 14 13 12 11 10 9 8 7 6 5 4 3 2 1 0

Depth Player Index

D D D D D D D D D D D D D P P P

15 14 13 12 11 10 9 8 7 6 5 4 3 2 1 0

Page 32: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Pour connecter la Kinect N’oubliez pas d’ajouter la référence

Microsoft.Kinect Nous allons créer une variable membre Nous allons se connecter à l’événement

AllFramesReady Nous allons initialiser le bon angle pour la

caméra(_sensor.ElevationAngle = 0;) Nous allons convertir les images reçus en Image

et nous allons les afficher dans des picturebox.

private KinectSensor _sensor;

Page 33: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Démo

Page 34: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Détection des squelettes Reconnaissance immédiate Evénementiel 6 squelettes détectés

Chaque squelette donne sa position

2 squelettes suivis (tracked) Liste de joints (points de contrôles)

Page 35: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Squelettes détectés

Identifiés

Tracked

Page 36: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Points détectés sur un squelette

FootLeft

AnkleLeft

KneeLeft

HipLeft

HipCenter

HipRight

FootRight

AnkleRight

KneeRight

Spine

HandLeft

WristLeft

ShoulderLeft

Head

ElbowLeft

ShoulderRight

HandRight

WristRight

ElbowRight

ShoulderCenter

Page 37: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Coordonnées des jointures

Z Axis X Axis

Y Axis

Negative

Positive

Positive Negative

Page 38: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Démo!

Page 39: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Conclusion Le modèle MVC est un modèle

étoffé qui permet aisément la modification et l’extension d’une application.

Page 40: Architecture dapplication Lapprentissage automatique appliqué au modèle MVC

Période de questions Vous avez des questions?