Donnez votre avis !                        Depuis votre smartphone, sur :                         http://notes.mstechdays....
Deep Dive WinJS                       Thomas LEBRUN / Jonathan ANTOINE                           Développeurs, Consultants...
INFINITE SQUARE                     STAND 44 ESPACE WINDOWS 8 & EXPÉRIENCES NUMÉRIQUES                      Société de co...
Ce que l’on va apprendre       • Ce que permet WinJS       • Comment utiliser WinJS pour être productif            –     P...
WinJS.Promise       • Abstraction d’une tâche asynchrone            – done/then lorsque le traitement est terminé         ...
demoDeep Dive WinJS
Le framework de navigation       • Template de base            – WinJS.Navigation : abstraction            – Application.P...
demoDeep Dive WinJS
Les Bindings sont très puissants 1/2                  • Tire la valeur d’un objet JS sur un élément HTML                  ...
Les Bindings sont très puissants 2/2                  • Syntaxe data-win-bind                           cible : source act...
demoDeep Dive WinJS
Le système de contrôles       • Interface réutilisable cross-projets       • Un contrôle = une classe JS            – Le c...
demoDeep Dive WinJS
Internationalisation       • HTML :            – Attributs « data-win-res »            – Utiliser WinJS.Resources.processA...
demoDeep Dive WinJS
Listview et itemTemplate       • De façon déclarative dans l’HTML       • Une fonction de templating direct       • Une fo...
Listview et virtualisation des données       • Une DataSource custom c’est            – Une classe dérivant de WinJS.UI.Vi...
demoDeep Dive WinJS
Noter cette session !Deep Dive WinJS
Prochain SlideShare
Chargement dans…5
×

Deep Dive WinJS – Profitez à 100% de son potentiel

446 vues

Publié le

WinJS est simple d’utilisation pour vos besoins basique mais saviez-vous qu’il est possible de le personaliser ? Dans cette session vous découvrirez plusieurs incontournables, comme par exemple: • Comment construire votre propre contrôle WinJS • Comment personnaliser le système de navigation • Comment utiliser à 100% le système de binding de WinJS

0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
446
Sur SlideShare
0
Issues des intégrations
0
Intégrations
1
Actions
Partages
0
Téléchargements
4
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Deep Dive WinJS – Profitez à 100% de son potentiel

  1. 1. Donnez votre avis ! Depuis votre smartphone, sur : http://notes.mstechdays.fr De nombreux lots à gagner toutes les heures !!! Claviers, souris et jeux Microsoft… Merci de nous aider à améliorer les TechDayshttp://notes.mstechdays.fr
  2. 2. Deep Dive WinJS Thomas LEBRUN / Jonathan ANTOINE Développeurs, Consultants .NET Infinite Square #AP304 infinitesquare.comCode / Développement
  3. 3. INFINITE SQUARE STAND 44 ESPACE WINDOWS 8 & EXPÉRIENCES NUMÉRIQUES  Société de conseil, d’expertise, de réalisation et de formation exclusivement sur les technologies de développement d’applications et la plateforme applicative Microsoft.  30 collaborateurs spécialisés sur les techno MS, dont 10 MVP.  GOLD Certified Partner sur 4 domaines de compétences.  Agréé CIR.  Centre de formation agréé.Infinite Square aux TechDays 2013
  4. 4. Ce que l’on va apprendre • Ce que permet WinJS • Comment utiliser WinJS pour être productif – Promises – Le framework de navigation – Les Bindings – Le système de contrôles – Globalisation des applications – La ListView et son système de templatingDeep Dive WinJS
  5. 5. WinJS.Promise • Abstraction d’une tâche asynchrone – done/then lorsque le traitement est terminé – 3 possibilités : complete/error/progress • Ne rend pas asynchrone • Pleins d’helpers dont disponibles – Join, thenEach, wrap, chaining,etc.Deep Dive WinJS
  6. 6. demoDeep Dive WinJS
  7. 7. Le framework de navigation • Template de base – WinJS.Navigation : abstraction – Application.PageControlNavigator : pratique • Uri locales : une uri = une page • Facile à personnaliser – Centralisation du sharing – Centralisation de l’internationalisation.Deep Dive WinJS
  8. 8. demoDeep Dive WinJS
  9. 9. Les Bindings sont très puissants 1/2 • Tire la valeur d’un objet JS sur un élément HTML – Déclaratif dans l’HTML : data-win-bind – Appel à WinJS.Binding.processAll dans le JS – Parfait pour la mise en place d’MVVM • Possible de binder des fonctionsDeep Dive WinJS
  10. 10. Les Bindings sont très puissants 2/2 • Syntaxe data-win-bind cible : source action • Valeurs possibles : – WinJS.Binding.defaultBind – WinJS.Binding.oneTime – WinJS.Binding.setAttribute – WinJS.Binding.setAttributeOneTime – Fonction customDeep Dive WinJS
  11. 11. demoDeep Dive WinJS
  12. 12. Le système de contrôles • Interface réutilisable cross-projets • Un contrôle = une classe JS – Le constructeur prend l’élément et les options en paramètres – L’ élément peut être vide • Un fichier JS et un fichier CSSDeep Dive WinJS
  13. 13. demoDeep Dive WinJS
  14. 14. Internationalisation • HTML : – Attributs « data-win-res » – Utiliser WinJS.Resources.processAll – Appeler le fichier « resources.resjon » • Dans le code JS : – ResourceLoader de WinRTDeep Dive WinJS
  15. 15. demoDeep Dive WinJS
  16. 16. Listview et itemTemplate • De façon déclarative dans l’HTML • Une fonction de templating direct • Une fonction de templating « déporté » • Utiliser le système de virtualisation de l’UIDeep Dive WinJS
  17. 17. Listview et virtualisation des données • Une DataSource custom c’est – Une classe dérivant de WinJS.UI.VirtualizedDataSource – Une classe implémentant WinJS.UI.IListDataAdapter • Pourquoi ? – Ne pas avoir à charger toutes les données d’un bloc – Exposer des données custom directement à la ListviewDeep Dive WinJS
  18. 18. demoDeep Dive WinJS
  19. 19. Noter cette session !Deep Dive WinJS

×