Les pages applicatives

Première partie - Création d'une page applicative simple

03/04/2009 3 965 lectures 2 commentaires 4.9/5 (8 votes) Sébastien Sougnez

SharePoint peut afficher deux types de pages : Les pages applicatives et les pages de site. Les pages de sites peuvent être modifiées à souhait et façonnées comme nous le voulons et elles sont propres à chaque utilisateur. Par contre, les pages applicatives ne peuvent pas être modifiées par l'utilisateur et ces pages sont partagées entre tous les utilisateurs. Donc une visiteur X accèdera à la même page qu'un utilisateur Y. Alors que les pages de sites servent à afficher des données, ou autre, les pages applicatives permettent surtout d'effectuer des tâches importantes. Ce cours va être séparé en 4 parties bien distinctes. La première partie abordera les bases, nous verrons comment créer une page applicative dans Visual Studio 2008 et comment la déployer. Dans la seconde partie de ce cours, nous verrons comment ajouter le menu de navigation dans notre page. Ce cours sera assez cours mais il est toujours interessant de savoir le faire. La troisième partie vous permettra d'internationaliser nos pages pour les rendre accessibles dans plusieurs langues. Enfin, dans la dernière partie, nous illustrerons ce que nous avons appris dans un exemple concret en prenant soin d'apprendre une dernière notion permettant de respecter le design des pages SharePoint à la perfection. Passons donc maintenant immédiatement au développement d'une page applicative. Cette page ne sera pas bien compliquée, elle permettra simple de lister l'ensemble des listes présentes sur le site, nous n'irons pas plus loin dans l'intérêt de cette page car ici, nous ne voulons que vous montrer comment les créer, pour avoir un exemple concret, il faudra attendre la dernière partie de ce cours. Pour ce faire, commencez donc par créer un nouveau projet WSP Builder vide et nommez le PageApp1. Le soucis avec WSP Builder est qu'il ne gère pas encore la création de page applicative, nous allons donc devoir créer tout ça depuis 0. Une page applicative doit être déployée dans le dossier 12\TEMPLATE\LAYOUTS, créez donc un dossier TEMPLATE dans le dossier 12 de votre projet. Ensuite, créez un dossier LAYOUTS dans le dossier TEMPLATE précédemment créé. Nous allons maintenant passer à la création de la page ASPX, pour cela, cliquez avec le bouton droit sur le dossier LAYOUTS et cliquez sur Add > New Item. Choisissez Text File et nommez le PageApp1.aspx. Ceci est une petite astuce pour créer facilement des pages ASPX vide.
 

Image


Nous allons également ajouter une classe qui va nous permettre de gérer le code-behind de notre page ASPX. Cliquez avec le bouton droit de votre souris et choisissez Add > Class et nommez la PageApp1.cs.
 

Image


Nous allons devoir modifier quelques peu ce fichier pour lui permettre d'être associé à la page en tant que code-behind. La première chose que nous allons faire consiste à ajouter une référence à SharePoint. Cliquez donc avec le bouton droit sur le dossier References et cliquez sur Add Reference. Dans la fenêtre qui apparait, choisissez Windows SharePoint Services :
 

Image


Nous allons également devoir ajouter une références à System.Web. Refaites donc la même opération que la précédente, mais cette fois, choisissez System.Web :
 

Image


Revenez maintenant dans votre classe et ajoutez les directives suivantes :
 

using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; 


Nous allons ensuite déclarer notre classe comme public pour que la page ASPX puisse y accéder et elle va également devoir dériver de la classe LayoutPageBase pour que la page ASPX puisse en hériter. Modifiez donc la déclaration de votre classe de cette manière :
 

 public class PageApp1 : LayoutsPageBase 


Tant que maintenant, nous pouvons utiliser cette classe en tant que code-behind. Revenez maintenant dans votre page ASPX, nous allons tapez le code nécessaire à la réalisation de notre projet. La première chose à faire est d'ajouter une référence à l'assembly SharePoint, tapez donc la ligne suivante :
 

<%@ Assembly Name="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 


Nous allons maintenant devoir ajouter la référence à notre assembly car il contient le code-behind de la page. Commencez donc par compiler votre projet (en appuyant sur F6). Ouvrez ensuite Reflector (outil abordé dans le cours sur le matériel SharePoint), ouvrez le fichier dll correspond à votre assembly avec Reflector et récupérer la valeur du champ Name de votre fichier (autrement dit la signature de votre assembly). Ajoutez donc la ligne suivante :
 

<%@ Assembly Name="PageApp1, Version=1.0.0.0, Culture=neutral, PublicKeyToken=1b7f66872a925252" %> 


En remplacant la valeur de l'attribut Name par celui récupéré dans Reflector. Nous allons ensuite devoir déclarer la directive de compilation Page :
 

<%@ Page Language="C#" Inherits="PageApp1.PageApp1" MasterPageFile="~/_layouts/application.master" EnableViewState="false" EnableViewStateMac="false" %> 


Rien de bien compliqué. La directive de compilation Page permet de définir quelques options de la page ASPX en question. L'attribut Language va nous permettre de définir dans quel language le code-behind de la page sera implémenté. Dans notre cas, il le sera en C#. L'attribut Inherits permet de faire dériver notre page d'une classe, ici, nous allons dériver de notre classe créée précédemment. Nous tapons donc le chemin complet vers celle-ci, donc le namespace suivi du nom de la classe. L'attribut MasterPageFile permet de définir la Master Page de notre page, ici, nous prenons la Master Page par défaut des pages applicatives. Les deux attributs suivants permettent de désactiver le ViewState. Tant que maintenant notre page ASPX est relativement vide, pour ne pas dire complètement. Etant donné qu'elle appartient à une Master Page, nous allons devoir déclarer quelques éléments Content pour remplir les Content Place Holder de la Master Page. Le premier que nous allons définir est le Content Place Holder servant à contenir le contenu de la page, son nom est PlaceHolderMain :
 

<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
	<asp:Label ID="lblListes" runat="server" />
</asp:Content> 


Comme vous le voyez, ici, nous ajoutons un Label avec comme ID lblListes. Nous modifierons la valeur de ce Label par le nom de toutes les listes présentes sur le site. Passons maintenant au Content Place Holder servant à modifier le titre de la page :
 

<asp:Content ContentPlaceHolderID="PlaceHolderPageTitle" runat="server">
	AreaProg - Pages applicatives
</asp:Content> 


Comme vous le voyez, ici, il suffit de taper le texte que vous voulez voir apparaitre dans la barre de titre. Le dernier ContentPlaceHolder à remplir se nomme PlaceHolderPageTitleInTitleArea, et oui, rien que ça. Ce dernier va permettre d'afficher un titre dans la page, dans le cadre orange. Voyez par exemple l'écran suivant :
 

Image


Comme vous le voyez, cette page contient une zone orange qui va permettre de contenir le titre de la page applicative. Tapez donc le code suivant dans votre page ASPX :
 

<asp:Content ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
	Première partie
</asp:Content> 


Comme vous le voyez, ce n'est pas très compliqué, nous nous contentons d'insérer un contrôle Content qui permettra de remplir la zone PlaceHolderPageTitleInTitleArea. Tant que maintenant, le design de notre page applicative est terminé, nous allons maintenant passer au code-behind permettant d'afficher l'ensemble des listes présentes sur le site. Pour cela, ouvrez votre classe et commencez par déclarer cette variable de classe :
 

protected Label lblListes = null; 


Ici, nous déclarons un objet avec l'accesseur protected pour pouvoir récupérer la référence au Label inséré directement dans la page ASPX. Faites attention que l'objet doit porter le même nom dans la page ASPX et dans le code-behind, dans le cas contraire, la correspondance ne pourra être effectuée. Nous allons ensuite devoir surcharger la méthode OnLoad qui sera appelée au chargement de la page. Tapez donc la fonction suivante :
 

protected override void OnLoad(EventArgs e)
{
	foreach (SPList list in SPContext.Current.Web.Lists)
	lblListes.Text += list.Title + "<br />";
}


Comme nous l'avons vu précédemment, surcharger cette fonction va nous permettre d'effectuer des opérations au chargement de la page. Ici, nous allons remplir le Label avec le nom de toutes les listes du site. Lorsque nous exécutons une page, nous pouvons accèder au contexte d'exécution actuel grâce à l'objet SPContext. Cette classe va nous permettre notamment de récupérer l'objet SPWeb associé à notre page ASPX. Nous bouclons donc sur tous les objets SPList contenus dans la collection de liste du site attaché au contexte d'exécution actuel. Pour chacune de ces listes, nous modifions la propriété Text du Label en lui rajoutant le titre des listes en question. Il ne vous reste maintenant plus qu'à déployer votre solution, mais soyez vigilent, il semblerait que WSP Builder ne gère pas les pages applicatives à la perfection. Effectivement, en ce qui me concerne, si je modifie une page ASPX, que je la sauve et que je fais Deploy, WSP Builder ne semble pas remarquer que la page a été modifiée et il ne me demande donc pas de rebuilder la solution, ce qui fait qu'il déploye exactement la même version que la précédente, nous vous conseillons donc toujours de faire Build suivi de Deploy pour déployer vos pages applicatives, vous serez ainsi sûr que la version déployée est bien la dernière en date. Compilez et déployez donc votre solution et ouvrez votre site SharePoint. Votre page sera accessible à l'adresse http://site/_layouts/page.aspx, ainsi, dans notre cas, l'adresse sera : http://pc-de-zick/_layouts/PageApp1.aspx. Bien entendu, chez vous, http://pc-de-zick/ changera mais le reste de l'Url restera la même si vous avez bien nommé votre page PageApp1.aspx. Si tout se passe bien, au final, votre page devrait avoir l'aspect suivant :
 

Image


Comme vous le voyez, ce n'est pas mal, mais si vous êtes pointilleux, cela ne vous conviendra pas, effectivement, cette page a approximativement le look d'une page SharePoint, mais pas totalement. Effectivement, il manque les liens permettant d'afficher "l'endroit" où l'on se trouve, autrement dit, le SiteMap. Nous avons également une présentation bien différente de celle des pages SharePoint ou nous avons, normalement, à gauche une explication de la page, et à droite, sur fond bleu, les options de la page. Nous allons voir ces deux concepts dans les cours suivants. Nous verrons également comment internationaliser vos pages en les proposants dans plusieurs langues différentes.

Noter

Veuillez vous identifier ou vous inscrire pour donner une note à cet article.

Commentaires / Questions

Adrien M (10/05/2010 - 17:44)

Thanks :)

joel (22/05/2012 - 00:56)

thanks Seb!

Veuillez vous identifier ou vous inscrire pour réagir à cet article.