Paris Mix07
Mot de passe :
Bienvenue à tous
accueilVous voulez tout savoir, et bien vous ne saurez pas tout, seulement l'essentiel sur mon métier de Chef de projet .net et sur quelques centres d'intêrets. Bonne visite.
Enfin, il était temps !
Cela faisait une bonne année que j'étudiais la possibilité d'avoir un blog. Et puis en voyant réellement ce qu'est un blog, cela m'a vite dissuadé : lisibilité réduite, faible ergonomie et en plus il faut l'alimenter régulièrement, au risque d'y mettre n'importe quoi.
C'est la raison pour laquelle j'ai conçu ce portail, à mon avis plus en phase avec ma vision de ce que doit être un blog.
Bonne visite.
Mais qu'est ce que je fais ?
mon activitéL'informatique est à la fois ma passion et mon métier.
Découvrez ici mon parcours professionnel, mon métier et ma vision (orientée Microsoft) sur les technologies Web.
Microsoft.netVous l'avez sans doute remarqué, mais je suis très .net ! Mon objectif est de vous parler de mon retour sur expérience et des énormes capacités de ce Framework.
Tout abus d'Internet est dangereux pour la santé
insoliteQuelques moments droles, glanés sur le web, ainsi qu'une série de billets d'humeur
Parce qu'il faut bien se détendre un peu et le Web est tellement riche !
Mauvais sort pour un stormtrooper
Sports et loisirs
sportSi vous cherchiez des infos sur le football, et bien c'est pas ici que vous allez les trouver !
Nolan Ryan, le roi du strikeoutJ'ai une attirance toute particulière vers les sports américains, comme le baseball (j'y ai joué 13 ans) et le football américain
Résultat de la recherche pour Mai 2007
30/05/2007
Microsoft Surface, la table tactile de demain, aujourd'hui

Microsoft vient de dévoiler son nouveau projet, non pas un soft mais une table tactile, Surface. Il s'agit d'un écran de 30 pouces, capable d'interagir avec des objets communicants (appareil photo par exemple) grâce à des caméras infra rouges. Son interface utilisateur, très novatrice permet de manipuler des objets virtuels (photos, documents) mais également offre de nouveaux loisirs numériques (peinture par exemple).

Le site de Microsoft Surface montre bien les possibilités de ce produit tout droit issu des laboratoires de recherche de Microsoft.

Je suis toujours frappé par la capacité de Microsoft à mettre l'avenir à porter de main et surtout à transformer les résultats de leurs recherches au profit d'outils futuristes et surtout réalistes. Disponible fin 2007 à un prix réservé aux entreprises (Hotels, casinos...)

Microsoft Surface

Mots clés associés : Microsoft Surface Milan  | Lien permanent | Laissez le premier votre commentaire
Publiée dans la zone Technologies
17/05/2007
Mon Portail : CustomControl d'encadrement de vos formulaires et éléments

Les éléments graphiques du portail sont inclus dans un encadrement aux cotés arrondis. Cet encadrement peut prendre plusieurs couleurs et afin d'optimiser les développements j'ai réalisé un CustomControl très simple qui permet d'y inclure vos éléments. Nous allons donc voir comment ce CustomControl est utilisé dans l'interface graphique, ces implications au niveau des feuilles de style et la construction du CustomControl.

1. Utilisation du CustomControl

<elgee:Frame ID="FR12" runat="server" Couleur="jaune" Taille="275">

    <div class="billet_titre">Rechercher sur ce site</div><br />

    <div id="container_search_controls">

        <div id="google_search_form"></div>

        <div id="google_search_control"></div>

        <div id="live_search_container">

            <div id="live_search_query"></div>

            <div id="live_search_control"></div>   

        </div>

    </div>

</elgee:Frame>

Je prend l'exemple de la zone de recherche. Mon CustomControl s'appelle Frame et comme vous pouvez vous en rendre compte il inclut des éléments externes en son sein. Il dispose de 2 attributs, sa taille et la couleur à appliquer.

2. La gestion de l'apparence

On se basera donc sur une feuille de style. En se basant sur la valeur de l'attribut Couleur, on déclinera l'ensemble des éléments nécessaires au rendu graphique de l'encadrement.

.jaune_haut_gauche      {border-style: none; width:12px; height:21px; background-image: url(/App_themes/default/pics/box/jaune/haut_gauche.png);background-repeat: no-repeat; line-height:0; font-size:0;}

.jaune_haut             {border-style: none; height:21px; background-image: url(/App_themes/default/pics/box/jaune/haut.png);background-repeat: repeat-x; line-height:0; font-size:0;}

.jaune_haut_droite      {border-style: none; width:14px; height:21px; background-image: url(/App_themes/default/pics/box/jaune/haut_droite.png);background-repeat: no-repeat; line-height:0; font-size:0;}

.jaune_gauche           {border-style: none; width:12px; background-image: url(/App_themes/default/pics/box/jaune/gauche.png);background-repeat: repeat-y; line-height:0; font-size:0;}

.jaune_contenu          {border-style: none; background-color: #FFFFCC;}

.jaune_droite           {border-style: none; width:14px; background-image: url(/App_themes/default/pics/box/jaune/droite.png);background-repeat: repeat-y; line-height:0; font-size:0;}

.jaune_bas_gauche {border-style: none; width:12px; height:21px; background-image: url(/App_themes/default/pics/box/jaune/bas_gauche.png);background-repeat: no-repeat; line-height:0; font-size:0;}

.jaune_bas              {border-style: none; height:21px; background-image: url(/App_themes/default/pics/box/jaune/bas.png);background-repeat: repeat-x; line-height:0; font-size:0;}

.jaune_bas_droite {border-style: none; width:14px; height:21px; background-image: url(/App_themes/default/pics/box/jaune/bas_droite.png);background-repeat: no-repeat; line-height:0; font-size:0;}

Il y a donc une classe pour chaque coin de l'encadrement, pour chaque coté et le contenu. La règle de nommage consiste à commencer par le nom de la couleur, suivi de sa localisation. Comme vous le voyez, j'ai choisi un format PNG, qui gère mieux la transparence que le GIF. Mais attention aux surprises sur les navigateurs de type IE6 qui ne gère pas la transparence du format PNG.

3. Le code du CustomControl

Dans les attributs de la classe du CustomControl on définit la propriété par défaut et l'apparence coté designer en indiquant le nom du tag, ici Frame. Ne pas oublier les accesseurs publiques des propriétés.

   [DefaultProperty("Taille"), ControlValueProperty("Taille"), PersistChildren(true), ParseChildren(false),

   ToolboxData("<{0}:Frame runat=server></{0}:Frame>"), PersistenceModeAttribute(PersistenceMode.InnerProperty),

 Designer(typeof(System.Web.UI.Design.ContainerControlDesigner))]

    public partial class Frame : System.Web.UI.WebControls.WebControl

    {

        public int Taille

        {

            get { return _taille; }

            set { _taille = value; }

        }

        public string Couleur

        {

            get { return _couleur; }

            set { _couleur = value; }

        }

        private string _couleur = "blanc";

        private int _taille = 200;

        int _width = 0;

Il est ensuite nécessaire de surcharger les deux méthodes RenderBeginTag et RenderEndTag pour ajouter notre code. Vous noterez que la taille fournie au CustomControl est la taille totale, à laquelle je retire 26, car mes deux bordures ont 13 pixels de large. J'opte plutôt pour une table, plus fiable qu'un DIV dans ce cadre là.  

        public override void RenderBeginTag(HtmlTextWriter writer)

        {

            base.RenderBeginTag(writer);

            //Controls.Clear();

            _width = _taille - 26;

writer.AddStyleAttribute(HtmlTextWriterStyle.Width, _taille.ToString() + "px");

            writer.AddAttribute("cellpadding", "0");

            writer.AddAttribute("cellspacing", "0");

            writer.AddAttribute("border","0");

            writer.RenderBeginTag("table");     // Table container

            writer.RenderBeginTag("tr");        // TR de la premiere ligne

            writer.AddAttribute("class", _couleur + "_haut_gauche");

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

            writer.AddAttribute("class", _couleur + "_haut");

writer.AddStyleAttribute(HtmlTextWriterStyle.Width, _width.ToString());

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

            writer.AddAttribute("class", _couleur + "_haut_droite");

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

writer.RenderEndTag();          // Fin du TR de la premiere ligne

            writer.RenderBeginTag("tr");        // TR de la seconde ligne

            writer.AddAttribute("class", _couleur + "_gauche");

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

            writer.AddAttribute("class", _couleur + "_contenu");

writer.AddStyleAttribute(HtmlTextWriterStyle.Width, _width.ToString());

            writer.RenderBeginTag("td");

        }

        public override void RenderEndTag(HtmlTextWriter writer)

        {

            writer.RenderEndTag();

            writer.AddAttribute("class", _couleur + "_droite");

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

writer.RenderEndTag();          // Fin du TR de la seconde ligne

            writer.RenderBeginTag("tr");        // TR de la troisieme ligne

            writer.AddAttribute("class", _couleur + "_bas_gauche");

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

            writer.AddAttribute("class", _couleur + "_bas");

writer.AddStyleAttribute(HtmlTextWriterStyle.Width, _width.ToString());

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

            writer.AddAttribute("class", _couleur + "_bas_droite");

            writer.RenderBeginTag("td");

            writer.RenderEndTag();

writer.RenderEndTag();          // Fin du TR de la premiere ligne

            writer.RenderEndTag();          // Fin de la table

            base.RenderEndTag(writer);

        }

    }  

Le tour est joué, votre CustomControl d'encadrement est fait. Reste plus qu'a jouer sur le panel de couleurs disponibles dans les feuilles de styles. Pour plus de fiabilité, on peut s'appuyer sur une énumération pour la liste des couleurs.

Mots clés associés : ASP.Net Tutoriel CustomControl Microsoft c#  |