Blog du Pôle .NET

Partager pour mieux développer...

TechDays - [MSTD10] - WPF Toolkit et bonnes pratiques

clock March 10, 2010 10:41 by author yvue

 

Bonjour,

Un peu de publicité ne fait de mal à personne ...

Voici la WebCast de la session que j'ai eu la chance d'animer avec Julien Corioland aux TechDays 2010 sur WPF Toolkit et Bonnes Pratiques

Suivra dès que possible un petit ticket sur les bienfaits de MVVM ...

Yoann Vue 

Be the first to rate this post

  • Currently 0/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Comparaison WPF et Silverlight

clock June 15, 2009 08:19 by author yvue

Un simple relais d'informations 

Sur le site codeplex, on retrouve un white paper tres sympa.

http://wpfslguidance.codeplex.com/

C'est une comparaison des technologies WPF et Silverlight

bonne lecture

Yoann Vue 

 

 

Be the first to rate this post

  • Currently 0/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Microsoft Health Graphing control

clock February 20, 2009 05:15 by author aequoy

 

La santé et le secteur hospitalier étant mes domaines fonctionnels d'origine, voici un petit billet pour vous informer de la sortie de nouveaux contrôles et guides WPF/Silverlight dédiés aux interfaces médicales. 

Si vous n'avez pas encore consulté le site http://www.mscui.net/ je vous y invite.



Source : http://www.mscui.net/Blog/post/Welcome-to-our-New-Graphing-Control.aspx

Alexandre Equoy

Currently rated 5.0 by 1 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Binding WPF dans une scène 3D

clock February 6, 2009 23:44 by author dox

Je viens de terminer une formation WPF et une fois le chapitre sur le binding de données terminé, un stagiaire me pose une colle, à peu près dans ce genre là :


"Il existe beaucoup d'applis de démos en WPF où l'on peut facilement changer l'angle de la caméra, à la souris ou autrement, mais comment faire pour binder la lumière, sur un contrôle Slider par exemple ?"

Bon, j’avais bien une idée en tête, mais sur le coup, je ne voyais pas comment l’implémenter. Je me suis mis au boulot en rentrant, et au bout d’une demi heure, j’ai terminé une petite application WPF que voici

Décortiquons un peu le contenu.
On commence par jeter un œil à la définition de la lumière en XAML, ce qui donne ceci :

<DirectionalLight x:Name="light" Color="White" 
    Direction="-5,-5,-5/>


On creuse un peu et on se rend compte que la propriété Direction est de type Vector3D, défini dans System.Windows.Media.Media3D, et qu’elle contient 3 valeurs : X, Y et Z (entre autres). La valeur « -5,-5,-5 » ne serait donc que le résultat de l’appel à la méthode ToString() sur la classe Vector3D.


On réalise que ça va être un peu dur (ou un peu long) de binder ça sur 3 contrôles différents, ou 3 sources différentes. Je commence donc par créer un UserControl, que j’appelle VectorControl et qui contient 3 contrôles de type Slider. J’ajoute les DependencyProperties qui me permettent de lier les valeurs des Sliders à mes propres propriétés : X, Y, Z et Vector3D, et j’ajoute les notifications correspondantes.

// dependencies
public static readonly DependencyProperty XProperty = 
    DependencyProperty.Register("X", typeof(double), 
    typeof(VectorControl), new UIPropertyMetadata((double)0));
...
public static readonly DependencyProperty Vector3DProperty = 
    DependencyProperty.Register("Vector3D", typeof(Vector3D), 
    typeof(VectorControl), new PropertyMetadata(
    new Vector3D(0, 0, 0)));

// constructeur
public VectorControl() {
    InitializeComponent();
    DependencyPropertyDescriptor.FromProperty(XProperty, 
        typeof(VectorControl)).AddValueChanged(this,
        delegate { Vector3D = new Vector3D(X, Y, Z); });
    ...
    DependencyPropertyDescriptor.FromProperty(Vector3DProperty, 
        typeof(VectorControl)).AddValueChanged(this,
        delegate { 
        X = Vector3D.X; Y = Vector3D.Y; Z = Vector3D.Z; });
}

Au final, j’obtient un UserControl qui ne paye pas de mine, mais qui est fully functionnal !

VectorControl
 
L’étape suivante consiste à intégrer mon UserControl dans mon application, qui contient déjà un ViewPort3D hébergeant ma scène 3D, et à renseigner ses propriétés. Au passage, j’en ai profité pour en créer 2 :

• Un pour la lumière
• Un pour la caméra (puisque la direction est aussi une propriété de type Vector3D)

<!-- les usercontrol ici --> 
<StackPanel Orientation="Vertical" Grid.Column="0"> 
    <local:VectorControl x:Name="lightVectorControl" 
        Title="Lumière ambiente" X="-4" Y="-2" Z="-1"/> 
    <local:VectorControl x:Name="lookDirectionVectorControl" 
        Title="Caméra" X="-5" Y="-5" Z="-5"/> 
</StackPanel>

Il ne me reste plus qu’à modifier la ligne de définition de la lumière (et celle de la caméra), et de binder la propriété Direction à mon UserControl, ce qui donne ceci :

<DirectionalLight x:Name="light" Color="White" 
    Direction="{Binding ElementName=lightVectorControl, 
    Path=Vector3D}"/>

Un test en runtime pour vérifier que tout fonctionne bien, et on obtient une application dans laquelle on peut modifier directement la direction de la lumière, et celle de la caméra :

 VectorControlApp


En espérant que ça pourra être utile à quelqu’un ;-)

Dominique Thery

Currently rated 5.0 by 4 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Microsoft Surface Camp : day 2

clock February 6, 2009 04:58 by author aequoy

Après une première journée dont l'objectif était de défaire les illusions vis à vis de Microsoft Surface et de nous projeter dans ce que l'on peut attendre de l'outil, cette seconde journée démarre sur le design d'application sur Surface.
Yoann has improved his english. He is certainly fluent now... ;)
Notre interlocuteur a commencé par évoquer des guidelines de design.
L'aspect multi user et l'aspect contextuel (l'endroit, les types de participants...) influent énormément sur le design et les comportements d'application
.
Nos scénarios de tests vont devoir s'étoffer afin de prendre en compte tous les cas d'utilisations.

Nous continuerons à vous donner des nouvelles.

Repeat after me Yoann, my taylor is rich ....

Après 2 jours passés ensemble, Yoann s'est enfin décidé à me demander en mariage. Et comme tout "bons" devs que nous sommes nous avons décidé de préparer l'événement par une application Surface.

L'idée de cette application est de préparer un plan de table, d'assigner des personnes à ces tables, d'imprimer des tags sur les cartes d'invitation et le jour J (un jour mon prince viendra...) par la reconnaissance des tags_id de placer les gens automatiquement.

Nous avons codé une partie de la nuit ce début d'application sur le simulateur et nous l'avons testé en réel sur la table cet après midi.

Enormément d'idées arrivent du fait de passer sur la table (c'est l'application bien sûr qui est passée sur la table ;)). Plutôt que d'utiliser des bouton nous allons utiliser des objets réels que nous placerons et qui par reconnaissance de forme donneront au final le même rendu.

Lorsque notre interlocuteur nous prévenait qu'il fallait absolument une table pour développer, c'est VRAI !!! (Arnaud, Eric, Olivier si vous nous lisez :) )

Les idées fusent à partir du moment où d'autres utilisateurs peuvent interagir.

Expérience fantastique ! Nous sommes comme 2 gosses devant un jouet.

Marvellous comme dirait Yoann ;)

Alexandre Equoy

Quelques photos de l'évenement :

 



Avec le témoin ;)
Laurent tu seras mon témoin


Currently rated 3.9 by 9 people

  • Currently 3.888889/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Microsoft Surface Camp : day 1

clock February 5, 2009 07:48 by author aequoy

J'ai la chance d'être avec mon collègue Yoann (YoView pour les intimes) de participer à un séminaire Microsoft Surface.

C'est le début de l'aventure Access it sur cette technologie.

Nous ne sommes pas assujettis à un NDA quelconque donc nous vous donnerons des nouvelles, des samples assez rapidement.

En attendant la table Access it :) (message subliminal pour nos boss :) , nous proposerons un résumé de ce séminaire où des choses très intéressantes se disent.

Un premier constat que notre interlocuteur américain nous fait justement remarquer est qu'il faut revoir notre façon de penser.

Le multitouch n'est absolument pas le fer de lance de cette technologie. Il faut penser "social computing", intégration de devices multiples, reconnaissance de formes.

C'est vrai qu'il est tentant de faire tout et n'importe quoi avec surface pour le "fun" mais à 10 000 euros la table c'est cher payé.

Mieux vaut un "bête" écran tactile. 

Nous avons donc du boulot pour imaginer de "vrais" scénarios métiers intégrant l'ensemble des capacités de la table.

Les scénarios multitouch étant simples à concevoir, je pense que dans un premier temps, il faut imaginer l'objet, le device qui va se "connecter" à la table.

Alexandre Equoy

Quelques photos pour la route :

 

YoView devant la table

Access it



Currently rated 5.0 by 2 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Héritage de classe générique sur une Window

clock January 21, 2009 04:38 by author Xavier Masclet
Par défaut en WPF les formulaires héritent de la classe System.Windows.Window.
Or il est peut être interessant de les faire hériter d'une classe tierse dans laquelle on factorise un certain nombre de choses (cette classe héritant elle même de System.Windows.Window pour que tout fonctionne bien).

Dans le cas de l'héritage d'un type simple il suffit de procéder comme suit :

1. On définit un type de base (à ajouter dans l'assembly contenant les formulaires ou dans une assembly connue de cette dernière)

namespace IHM.Common
{
   public class MyBaseWindow : Window

   {
      //...
   }
}

2. Il faut faire hériter notre formulaire de ce type

 - Coté code :

using IHM.Common;
namespace IHM.UI
{
   public class Window1 : MyBaseWindow
   {
      //...
   }
}

 - Et coté XAML : (et oui ! Le compilateur nous y oblige sous peine d'une erreur "Partial declarations of 'IHM.UI.Window1' must not specify different base classes")


   <src:MyBaseWindow
        x:Class="IHM.UI.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:src="clr-namespace:IHM.Common"
        Title="Une Fenetre"
        Height="300"
        Width="300">
   ...
   </src:MyBaseWindow>


Comment faire si maintenant nous souhaitons hériter d'une classe générique ?
En l'occurrence :

namespace IHM.Common
{
   public class MyBaseWindow<T> : Window

   {
      //...
   }
}

1. Coté code pas de soucis :

using IHM.Common;
using Rules;

namespace IHM.UI
{
   public class Window1 : MyBaseWindow<MyRule>
   {
      //...
   }
}

2. Coté XAML, petite subtilité avec l'utilisation de la propriété "TypeArguments" qui permet de spécifier le type générique à utiliser :

   <src:MyBaseWindow
        x:Class="IHM.UI.Window1"
        x:TypeArguments="r:MyRule"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:src="clr-namespace:IHM.UI"
        xmlns:r="clr-namespace:Rules;assembly=Rules"
        Title="Recherche de personnes"
        Height="300"
        Width="300">
   </src:MyBaseWindow>

Notez la déclaration du namespace : xmlns:r="clr-namespace:Rules;assembly=Rules" (préfixé par la lettre 'r')
qui permet au compilateur de retrouver notre type 'MyRule' dans la spécification du type générique : x:TypeArguments="r:MyRule"

Currently rated 4.3 by 3 people

  • Currently 4.333333/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


SILVERLIGHT 2 : release finale lancée

clock October 14, 2008 08:11 by author aequoy

SilverLight 2 final Release est lancée aujourd'hui pour tout le monde.

http://www.microsoft.com/silverlight/

Pour une installation réussie sur un poste de développement, je vous conseille de tout désinstaller auparavant :

- SL2 RC0 ou Beta 2

- DeepZoom

- SL2 SDK

Si vous voulez récupérer les outils de développement...

 

 Alexandre Equoy

Currently rated 5.0 by 1 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


MSDN Technet Tour 2008

clock September 2, 2008 12:27 by author aequoy

Juste un petit billet pour vous signaler que le Technet Tour 2008 passera sur Lille les 13 et 14 octobre 2008.

Inscrivez vous en cliquant sur l'image

Inscrivez vous.

Alexandre Equoy

Currently rated 5.0 by 1 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Un contrôle Wonderful de WPF : la listbox

clock May 20, 2008 08:48 by author yvue

Longtemps dénigré pour son look & feel très basique et austère, la listbox n'était utilisée qu'en dernier recours.
Maintenant, WPF (Windows Presentation Foundation) est passé par là et c'est la renaissance de ce contrôle.

La nouveauté principale des contrôles de WPF est la suivante : Un contrôle WPF fournit essentiellement un comportement.

C'est à dire : un bouton fournit une interface graphique permettant de "cliquer".
Dans notre cas, la listbox fournit une interface affichant un ensemble de données, parmi lesquelles, l'utilisateur peut réaliser une séléction

Par défaut, en glissant une listbox sur votre fenetre, vous retrouverez l'interface graphique classique :


Mais la force de WPF est de nous permettre de transformer complétement l'apparence de notre contrôle.
Ceci est permis par l'utilisation des styles et des templates de la listbox.

Par exemple, on peut transformer notre listbox en gridview :

Et oui, c'est bien une listbox !!! Comment le faire ... Tout simplement en spécifiant le comportement de ma listbox.


Spécification de la mise en forme des éléménts sous la forme d'un stackpanel 

<ItemsPanelTemplate x:Key="ItemsPanelTemplate1">
    
<StackPanel IsItemsHost="True" Margin="0,0,0,10"/>
</ItemsPanelTemplate>

Spécification de la représentation d'un élément dans la liste (Une grille contenant les textboxs, checkbox et combobox nécessaires à l'affichage des informations de mon objet)

<DataTemplate x:Key="DataTemplate1">
  
<Grid Width="{Binding ElementName=lstContacts, Path=ActualWidth}">
    
<Grid.ColumnDefinitions>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_0"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_1"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_2"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_3"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_4"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_5"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_6"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_7"/>
        
<ColumnDefinition SharedSizeGroup="Column_SSG_8"/>
    
</Grid.ColumnDefinitions>

    
<Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="0">
         
<Label Content="&gt;" Margin="1" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" />
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="1">
         
<TextBox Text="{Binding Path=Nom}" HorizontalAlignment="Stretch"/>
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="2">
         
<TextBox Text="{Binding Path=Prenom}" HorizontalAlignment="Stretch"/>
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="3">
         
<TextBox Text="{Binding Path=Age}" HorizontalAlignment="Stretch"/>
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="4">
         
<CheckBox IsThreeState="False" VerticalAlignment="Center" IsChecked="{Binding Path=Sexe}" HorizontalAlignment="Center"/>
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="5">
          <TextBox Text="{Binding Path=Couleur}" HorizontalAlignment="Stretch"/>
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="6">
         
<ComboBox ItemsSource="{Binding Source={StaticResource OdpCommunes}}" 
                          
SelectedValue="{Binding Path=Ville.Id}" 
                         
SelectedValuePath="Id" 
                         
DisplayMemberPath="Nom" 
                         
HorizontalAlignment="Stretch"/>
    
</Border>

     <Border BorderBrush="Black" BorderThickness="1,1,0,0" Grid.Column="7">
         
<Image Source="../Images/Valider.png" Stretch="None"/>
     </Border>

     <Border BorderBrush="Black" BorderThickness="1,1,1,0" Grid.Column="8">
         
<Image Source="../Images/action-delete.gif" Stretch="None"/>
    
</Border>

     </Grid>
</DataTemplate>

Pour attacher tout cela a ma listbox, il me suffira alors d'ajouter les attributs nécessaires :

<ListBox x:Name="lstContacts"
           
ItemsSource="{Binding Source={StaticResource OdpContacts}}" 
           
ItemsPanel="{DynamicResource ItemsPanelTemplate1}" 
           
ItemTemplate="{DynamicResource DataTemplate1}"/>

et le tour est joué ...



D'autres exemples de customisation d'une listbox :


Une liste de polices de caractères disponibles sur notre poste client


 Ou encore un graphique en histogramme avec toujours le comportement d'une listbox

 

 

Un blog tres interessant sur le même sujet : The powerful of styles and templates in WPF

Yoann Vue
Consultant Technique Pôle.Net

Currently rated 3.8 by 4 people

  • Currently 3.75/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Calendrier

<<  March 2010  >>
MoTuWeThFrSaSu
22232425262728
1234567
891011121314
15161718192021
22232425262728
2930311234
Afficher en pleine page

Visiteurs