WebPart Hello World

Le traditionnel et classique « Hello World ! » va se présenter sous la forme d’un premier WebPart.

Objectif du TP

Développer un WebPart qui affiche « Hello World ! » sur une page d’un site SharePoint.

Pratique

Cliquez sur Démarrer > Tous les programmes > Microsoft Visual Studio 2010 puis Exécuter en tant qu’administrateur Microsoft Visual Studio 2010

Sur la page de démarrage de Microsoft Visual Studio 2010, cliquez sur Nouveau projet…

Dans les Modèles installés (sur la gauche), développez Visual C# puis SharePoint, cliquez sur 2010 puis choisir Composant Visual Web Part
Composant Visual Webpart

Ensuite donnez un nom à votre projet : HelloWorld.

Composant Visual Webpart

Gardez les autres options par défaut puis cliquez sur le bouton OK

Dans la fenêtre qui s’ouvre, indiquez le site local et choisissez de Déployer en tant que solution de batterie :

Composant Visual Webpart

Puis cliquez sur Terminer. Sur la droite apparaît l’Explorateur de solutions :

Composant Visual Webpart

Un WebPart intitulé VisualWebPart1 apparaît.

Développez VisualWebPart1 pour faire apparaître le fichier VisualWebPart1.webpart et double cliquez sur ce fichier pour l’ouvrir.

Composant Visual Webpart

Changez le titre en Bonjour Monde !.

Ce qui donne :
<propertyname=« Title« type=« string« >Bonjour Monde !</property>
Faites un clic droit sur VisualWebPart1.cs, puis sélectionnez Afficher le code.

Dans la classe VisualWebPart1, après la parenthèse ouvrante, saisissez le code suivant :
protected Label lblAffichage;
Dans la méthode CreateChildControls(), après la parenthèse ouvrante, saisissez le code suivant :
lblAffichage = new Label(); lblAffichage.Text = « Hello World ! »; Controls.Add(lblAffichage);
Votre code devrait ressembler à :

Composant Visual Webpart

Pour télécharger le code correspondant à VisualWebPart1.cs.

Déploiement de la solution

Grâce au déploiement, le WebPart va être accessible dans le site http://terre/. Pour cela, dans l’explorateur de solutions, faites un clic-droit sur HelloWorld puis cliquez sur Déployer:

Composant Visual Webpart

Une fenêtre de sortie apparaît en bas de l’écran central :

Composant Visual Webpart

Insérer le WebPart dans le site

Lancez Internet Explorer avec l’url http://terre/SitePages/Accueil.aspx. Ensuite, cliquez sur Actions du Site > Modifier la page. Dans les Outils d’édition, cliquez sur Insérer puis Composant WebPart.

Dans les Catégories, sur la droite, cliquez sur Custom et sélectionnez Bonjour Monde ! que vous ajoutez à la page :

Composant Visual Webpart

Puis dans l’onglet Page, cliquez sur Enregistrer et fermer. Le résultat ne se fait pas attendre :

Composant Visual Webpart

Notez qu’il s’agit d’un « vrai » WebPart. Vous pouvez donc modifier son apparence pour faire changer ou faire disparaître le titre du WebPart (« Bonjour Monde ! ») :

Composant Visual Webpart

Il ne vous reste plus qu’à faire des petites modifications dans le code pour bien comprendre comment il fonctionne: n’oubliez pas de déployer entre chaque modification.

L’intérêt de développer une WebPart est d’intégrer de l’interactivité avec l’utilisateur en charge de la conception du site.

Le prochain exercice, plus élaboré, va manipuler les informations du site SharePoint grâce à un WebPart Dynamique.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *