Post on 04-Apr-2015
ASP .NET 2.0 : Création de contrôles serveursASP .NET 2.0 : Création de contrôles serveurs
Présenté par Pierre Lagarde
pierlag@microsoft.comRelation Développeurs
Microsoft France
Level 300Level 300
Deux visions de l’approche composantDeux visions de l’approche composant
L’approche Contrôle Utilisateur (UserControl)L’approche Contrôle Utilisateur (UserControl)Créer une pagelet réutilisable (*.ascx) dans le Créer une pagelet réutilisable (*.ascx) dans le designer graphiquedesigner graphique
Facile à développerFacile à développer
Pas multi-projetPas multi-projet
L’approche Contrôle Server (CustomControl)L’approche Contrôle Server (CustomControl)Créer un composant .NET Web réutilisable depuis Créer un composant .NET Web réutilisable depuis la toolboxla toolbox
Modèle compilé dans une dllModèle compilé dans une dll Multi-projetMulti-projet
Pas facile à développerPas facile à développer
Identifié par un tag dans le flux aspxIdentifié par un tag dans le flux aspx<asp:button …><asp:button …>
Les contrôles serveurs peuvent :Les contrôles serveurs peuvent :Générer un flux HTML vers le client dans la Générer un flux HTML vers le client dans la méthode Renderméthode Render
writer.RenderBeginTag(HtmlTextWriterTag.Span);writer.RenderBeginTag(HtmlTextWriterTag.Span);
Générer du script client (cas des contrôles Générer du script client (cas des contrôles Validators)Validators)
RegisterClientScriptBlockRegisterClientScriptBlock
Adapter leur rendu aux différents clientsAdapter leur rendu aux différents clientsMobile / IE / FirefoxMobile / IE / Firefox
L’approche Contrôle Server L’approche Contrôle Server
La nouvelle Architecture des ContrôlesLa nouvelle Architecture des Contrôles
BaseDataBoundControl
DataBoundControl HierarchicalDataBoundControl
TreeView
Menu
ListControl CompositeDataBoundControl
BulletedList
CheckBoxList
DropDownList
ListBox
RadioButtonList
DetailsView
FormView
GridView
WebControl (1.x)
BaseDataList (1.x)
Control (1.x)
2 : Mon premier contrôle serveur2 : Mon premier contrôle serveur
demodemo
<span style="font-size:XX-[Large / Small]">Test Phrase
</span>
Sauvegarde des propriétésSauvegarde des propriétésLe contrôle serveur est créé à chaque génération de Le contrôle serveur est créé à chaque génération de page il faut donc implémenter un mécanisme de page il faut donc implémenter un mécanisme de sauvegarde des donnéessauvegarde des données
Utilisation du ViewStateUtilisation du ViewState
public bool LargeText{ get {
object o = ViewState["LargeText"];if (o == null)
return _largeText;else
return (bool)o; } set { _largeText = value; ViewState["LargeText"] = _largeText; }}
Visibilité des propriétés dans l’inspecteur d’objetVisibilité des propriétés dans l’inspecteur d’objet
Utilisation des attributs sur les Utilisation des attributs sur les propriétéspropriétés
[Bindable(true), Category("Appearance"), DefaultValue("true")]public bool LargeText{ …}
[EditorBrowsable(EditorBrowsableState.Never), DefaultValue(false)]public override bool Visible{ …}
3 : Modifier mon premier contrôle3 : Modifier mon premier contrôle
demodemo
Contrôle invisibleContrôle invisible
Réaliser un contrôle visible par Visual Réaliser un contrôle visible par Visual Studio mais invisible dans la page Studio mais invisible dans la page HTMLHTML
Utilisation des « Utilisation des « ControlDesignerControlDesigner » »[DesignerAttribute(typeof(InvisibleControlControlDesigner))]public class InvisibleControl : Control{
…}public class InvisibleControlControlDesigner : ControlDesigner {
public override string GetDesignTimeHtml() {return base.CreatePlaceHolderDesignTimeHtml();}
}
4 : Contrôle Invisible4 : Contrôle Invisible
demodemo
Ajout de fonctionnalités à un contrôle existantAjout de fonctionnalités à un contrôle existant
Créer un DropDownList multicoloreCréer un DropDownList multicolore
<html> <body> <select> <option style="color:red;font-weight:700;font-family:courier new;">One</option> <option>Two</option> <option>Three</option> </select> </body></html>
Hériter du DropDownListHériter du DropDownList
Ajout de propriétésAjout de propriétés
Réécrire le RenderContentsRéécrire le RenderContents
Customiser le SmartTag pour la nouvelle DropDownListCustomiser le SmartTag pour la nouvelle DropDownList
Créer un nouveau ControlDesignCréer un nouveau ControlDesignpublic override DesignerActionListCollection ActionLists{
//Return DesignerActionListCollection()}
5 : MyDropDownListMyDropDownListControlDesign
5 : MyDropDownListMyDropDownListControlDesign
demodemo