Mise en page et pagination des pages mobiles

Article
09/24/2014

Dernière modification : mercredi 5 mai 2010

S’applique à : SharePoint Foundation 2010

Dans cet article
Mise en page
Personnalisation des contrôles
Pagination

Une page mobile Microsoft SharePoint Foundation utilise des modèles à la fois pour décrire la mise en page et pour référencer des contrôles mobiles Microsoft Microsoft ASP.NET ou des contrôles mobiles natifs SharePoint.

Les fichiers MobileDefaultTemplates.ascx et GbwMobileDefaultTemplates.ascx contiennent tous les modèles de rendu utilisés dans les pages mobiles qui sont incluses avec SharePoint Foundation. Ces fichiers de contrôle utilisateur se trouvent dans le répertoire %ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\CONTROLTEMPLATES. Les modèles sont chargés de manière dynamique par l’infrastructure de rendu mobile à partir de cet emplacement. En plaçant des fichiers .ascx personnalisés qui définissent des modèles de rendu dans ce répertoire, et en affectant à ses modèles de rendu les identificateurs (ID) appropriés, vous pouvez substituer les contrôles par défaut qui remplissent une page mobile. Pour plus d’informations sur le processus de rendu de page et les ID des modèles de rendu, voir Système de rendu des pages mobiles.

Mise en page

Chaque page mobile SharePoint Foundation est divisée en zones d’en-tête, de sommaire et de pied de page généralement séparées par une ligne. La zone d’en-tête contient le titre du site Web, de la liste ou de l’élément. La zone de sommaire affiche le contenu, tel que des images, du texte wiki, des adaptateurs mobiles de composants WebPart, sur une page mobile standard. Dans une page d’affichage de liste, le contenu affiche les éléments dans une liste, tandis que dans un formulaire d’élément de liste, le contenu affiche les champs dans un élément de liste. La zone de pied de page contient les URL d’action permettant d’utiliser des éléments de liste et des URL de navigation afin d’accéder à d’autres pages.

Les contrôles par défaut sur une page mobile font référence aux modèles de rendu définis dans les fichiers MobileDefaultTemplates.ascx et GbwMobileDefaultTemplates.ascx. Ces modèles développent leurs modèles enfants et affichent les contrôles dans la page. Les zones d’en-tête et de pied de page implémentent l’élément <DeviceSpecific>ASP.NET et sont toujours affichées, même lorsque la zone de contenu est paginée.

L’exemple suivant montre les modèles qui sont utilisés dans la page mbllists.aspx (page « Liste des listes » pour les appareils mobiles).

<SPMobile:SPMobileForm RunAt="Server" 
  PageType="HomePage" 
  Paginate="true">
  <DeviceSpecific>
    <Choice Filter="supportsCss">
      <HeaderTemplate>
        <SPMobile:SPMobileComponent RunAt="Server" 
          Templatename="MobilePageTitleWithCss" Weightless="true" />
      </HeaderTemplate>
      <FooterTemplate>
        <SPMobile:SPMobileComponent RunAt="Server" 
          Templatename="MobilePageNavigationWithCss" Weightless="true" />
      </FooterTemplate>
    </Choice>
    <Choice>
      <HeaderTemplate>
        <SPMobile:SPMobileControlContainer RunAt="Server" Weightless="true">
          <SPMobile:SPMobilePageTitle RunAt="Server" />
          <SPMobile:SPMobileComponent RunAt="Server" 
            TemplateName="MobileDefaultSeparator" />
        </SPMobile:SPMobileControlContainer>
      </HeaderTemplate>
      <FooterTemplate>
        <SPMobile:SPMobileControlContainer RunAt="Server" Weightless="true">
          <SPMobile:SPMobileComponent RunAt="Server" 
            Templatename="MobilePaginateNavigation" />
          <SPMobile:SPMobileComponent RunAt="Server" 
            TemplateName="MobileDefaultSeparator" />
          <SPMobile:SPMobilePageNavigation RunAt="Server" />
        </SPMobile:SPMobileControlContainer>
      </FooterTemplate>
    </Choice>
  </DeviceSpecific>
  <SPMobile:SPMobilePageContents RunAt="Server" />
</SPMobile:SPMobileForm>

L’élément DeviceSpecific est un type d’instruction switch. Pour plus d’informations, voir Introduction to the DeviceSpecific Control. Dans ce cas, si l’appareil mobile prend en charge les fichiers de feuilles de style en cascade (CSS, Cascading Style Sheets), les zones d’en-tête et de pied de page utilisent des modèles de rendu qui recourent à des styles CSS. Sinon, ce sont des modèles de rendu qui contiennent leurs propres informations de style qui sont utilisés.

Notez que dans la section non-CSS du marquage, l’attribut TemplateName des contrôles SPMobilePageTitle et SPMobilePageNavigation n’est pas défini, ni l’attribut TemplateName du contrôle SPMobilePageContents. En effet, cette valeur de propriété est codée en dur dans la déclaration C# de ces contrôles. D’autres contrôles dans l’exemple utilisent l’attribut TemplateName pour identifier un modèle de rendu défini dans le fichier MobileDefaultTemplates.ascx.

La balise SPMobilePageContents insère le corps dans la page, qui diffère en fonction de la définition du site, du type de liste ou du formulaire.

Personnalisation des contrôles

Pour appliquer un rendu spécial à une page mobile pour une définition de site spécifique, ou pour appliquer un rendu spécial pour un affichage de liste ou un formulaire d’élément spécifié, vous pouvez créer un modèle de rendu personnalisé dans un fichier .ascx personnalisé situé dans le répertoire %ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\CONTROLTEMPLATES. Attribuez à votre contrôle RenderingTemplate personnalisé une valeur d’attribut ID dans l’un des formats suivants. Pour plus d’informations détaillées, voir Système de rendu des pages mobiles, Procédure : personnaliser les pages d'accueil de l'affichage mobile, Procédure : modifier les pages de formulaire et d'affichage de liste mobiles et Procédure : personnaliser le rendu des champs sur les pages mobiles.

Page d'accueil

WebPartMobile_IDTypeSite_HomePage_Title
WebPartMobile_IDTypeSite_HomePage_Contents
WebPartMobile_IDTypeSite_HomePage_Navigation
WebPartMobileDetail_IDTypeSite_HomePage_Contents
WebPartMobileDetail_IDTypeSite_HomePage_Navigation
Mobile_IDTypeSite_HomePage_Title
Mobile_IDTypeSite_HomePage_Contents
Mobile_IDTypeSite_HomePage_Navigation

Les modèles de rendu WebPartMobile sont destinés à être utilisés sur une page mobile (mblwp.aspx ou mblwiki.aspx) qui correspond à une page de composants WebPart non mobile. Les modèles de rendu WebPartMobileDetail sont destinés à être utilisés sur une page mobile (mblwpdetail.aspx) qui présente un rendu plus détaillé d’une page de composants WebPart non mobile. Pour plus d’informations sur ces pages mobiles, voir Pages de composants WebPart et pages Wiki mobiles. Les modèles Mobile_*_HomePage_* sont destinés à être utilisés sur une page d’accueil de site Web héritée dont la page d’accueil non mobile correspondante ne comporte pas de composants WebPart et ne prend pas en charge les wikis.

Le type de page « HomePage » mobile comprend des pages qui, en réalité, ne sont pas des pages d’accueil pour un site. Ce type comprend des pages qui n’ont pas véritablement leur place dans d’autres catégories, telles qu’une page d’affichage de liste ou une page de formulaire. Par exemple, la page « Liste des listes » mobile, mbllist.aspx, est de type HomePage.

Notes

La page non mobile à laquelle correspond une page mobile est appelée la « page cible » de la page mobile.

Affichages de listes

Mobile_IDTypeListe_View_Title
Mobile_IDTypeListe_View_Contents
Mobile_IDTypeListe_View_Navigation
MobileDailyView_IDTypeListe_View_Navigation

Notes

Les modèles de rendu MobileDailyView* sont destinés à être utilisés sur la page d’affichage mobile des événements quotidiens du calendrier, ou des images d’une bibliothèque d’images, d’un site de travail de groupe (viewdaily.aspx). Pour plus d’informations sur cette page, voir Pages mobiles spécialisées.

Formulaires d'éléments

Mobile_IDTypeListe_NewForm_Title
Mobile_IDTypeListe_NewForm_Contents
Mobile_IDTypeListe_NewForm_Navigation
Mobile_IDTypeListe_EditForm_Title
Mobile_IDTypeListe_EditForm_Contents
Mobile_IDTypeListe_EditForm_Navigation
Mobile_IDTypeListe_DispForm_Title
Mobile_IDTypeListe_DispForm_Contents
Mobile_IDTypeListe_DispForm_Navigation

Attribution d’un nom aux modèles de rendu personnalisés

Attribuez à votre contrôle .ascx personnalisé un nom basé sur l’un des formats ci-dessus, en fonction du type de site, de page et de zone de page dont vous souhaitez personnaliser le rendu. Remplacez IDTypeSite par l’ID entier de la définition de site, ou par son nom, par exemple, STS, SGS ou BLOG. (Pour une définition de site personnalisée, vous devez utiliser le numéro d’ID.) Remplacez IDTypeListe par l’ID entier ou la valeur SPListTemplateType qui représente le type de liste spécifié.

Vous pouvez également créer une page et utiliser la fonctionnalité de redirection de page d’accueil. Pour plus d’informations, voir Procédure pas à pas : personnalisation de la page d’accueil mobile par le biais de la redirection.

Pagination

SharePoint Foundation utilise la pagination ASP.NET et le comportement de page associé pour prendre en charge la pagination de la zone de contenu des pages mobiles. Pour plus d’informations sur la pagination ASP.NET, voir Contrôles mobiles ASP.NET : pagination (éventuellement en anglais).