Yet Another FlipControl [Custom Control]

2 commentaires


    Lorsque vous développez une application Silverlight ou Wpf, certaines questions se posent avec plus de force. C'est notamment le cas concernant l'ergonomie. Définir un zoning simple et sans heurts est indispensable pour une utilisation intuitive de votre application. Vous remarquerez souvent que certains usages ou même certaines entités métier présentent plusieurs facettes.
    Prenons l'exemple de plusieurs classes héritant d'une classe ou implémentant une interface. Nous pourrions partir du principe que chaque sous-classe présente des membres communs a la classe mère ainsi qu'un jeu de propriétés ou de méthodes qui lui est spécifique. Lorsqu'une vue de l'application représente ce type d'instance, nous pouvons répartir l'affichage de cette dernière en deux zones distinctes que l'utilisateur n'aura pas forcément besoin de voir en même temps. La rotation 3D de la surface est un bon moyen d'y parvenir. Je mets à disposition un nouveau contrôle utilisateur : le FlipControl. Il est constitué de deux faces qui exposent chacune, un visuel distinct. On affiche successivement les deux faces par une rotation 3D sur l'axe horizontal ou vertical.
    Je mets donc à disposition un contrôle de ce type directement utilisable dans Blend. C'est un ContentControl qui possède les propriétés Header, FrontContent, BackContent et FrontTemplate et BackTemplate représentant le DataContext de chaque face.

    Il possède également une propriété IsFlipped sur laquelle vous pourrez créer une liaison de donnée afin de déclencher une rotation 3D du contrôle. L'avantage principal de ce FlipControl est de faciliter la configuration du contenu de chaque face directement dans Blend.

    Install Microsoft Silverlight

    Les sources de base ainsi que le projet de test sont téléchargeables à cette adresse.

    Bookmark and Share

    2 Comments so far

    1. Olivier Dahan on March 24th, 2011

      Salut Eric,
      L’idée d’implémenter un flip control sous la forme d’un conteneur est une excellente idée, bien plus propre que les contrôles ou les behaviors qui nécessitent d’avoir deux visuels un peu caché ailleurs.
      En revanche je trouve que le fading qui joue la transition n’est pas très convaincant, on voit les deux faces en même temps durant un court instant, ce qui est impossible sur un objet à deux faces, et l’oeil sait détecter ce genre de chose!
      Est-ce une contrainte de ton implémentation ou bien est-il possible d’avoir une transition “franche” ?
      (tu vas me dire, je n’ai qu’a regarder le code, et finalement tu as raison, c’est ce que je vais faire :-) )
      merci pour la publication du code.

    2. Eric Ambrosi on March 25th, 2011

      Il est possible de faire une transition franche. J’ai fais un mini moteur 3D donc dans l’absolu, je devrais faire un flip réel en l’utilisant. Puis je pourrais animer le flip via ma librairie d’animation tweened afin de proposer les équations d’accélération qui vont bien dans le panneau des propriétés.
      Mais je ne l’ai pas fait faute de temps…

    Leave a Reply

    Security Code: