Tutorial: Personalización de una página de vista de lista móvil

En este tutorial se describe cómo personalizar una página de vista de lista móvil mediante la implementación de un control RenderingTemplate personalizado. En este ejemplo se muestra cómo personalizar la sección de contenido de la página. Para obtener información general sobre cómo personalizar cualquier sección de un formulario o página de vistas de listas móvil, consulte Procedimiento para personalizar las páginas de vista de lista móvil y formulario.

Según se describe en Sistema de representación de páginas móviles, se llama a un control de selector de plantillas Microsoft.SharePoint.MobileControls.SPMobileListContents mediante una cadena de llamadas desde un control de la página.

Según el tipo de lista actual, este objeto determina qué control RenderingTemplate se representa en la sección de contenidos de la página principal móvil. El control busca un objeto RenderingTemplate denominado Mobile_ListTypeID_View_Contents, donde ListTypeID es el número de identificación de una definición de lista o un valor SPListTemplateType. Si no existe ningún objeto RenderingTemplate con ese identificador, entonces se utiliza el objeto RenderingTemplate con el identificador Mobile_Default_View_Contents.

No hay ninguna objeto de clase RenderingTemplate con el identificador Mobile_Announcements_View_Contents (o Mobile_104_View_Contents, que hace referencia al mismo tipo de lista) que se incluye cuando se distribuye Windows SharePoint Services 3.0. En este tutorial creará uno que agrega un saludo encima de la lista Anuncios.

Procedimiento

Para personalizar la sección de contenidos de la página de vista móvil Anuncios.

1. Con cualquier editor de texto, cree un archivo de texto (UTF-8) con el nombre AnnouncementsViewPageContents.ascx en la carpeta unidad_local:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\CONTROLTEMPLATES.

2. Agregue las siguientes directivas al archivo:.

   <%@ Control Language="C#" %>
   <%@ Assembly Name="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
   <%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile, Version=1.0.3300.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" %> 
   <%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
   <%@ Register TagPrefix="SPMobile" Namespace="Microsoft.SharePoint.MobileControls" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
   <%@ Import Namespace="Microsoft.SharePoint" %>
   

3. A continuación de las directivas, agregue un objeto RenderingTemplate y asígnele el identificador que busca el objeto SPMobileListContents en la página de vista: Mobile_104_View_Contents.

   <SharePoint:RenderingTemplate ID="Mobile_104_View_Contents" RunAt="Server" >
   
   </SharePoint:RenderingTemplate>
   

4. Dentro del elemento RenderingTemplate defina un elemento Template que tenga un control secundario Label. Establezca el atributo de la etiqueta Text como se muestra a continuación:

     <Template>
       <SPMobile:SPMobileControlContainer RunAt="Server">
         <SPMobile:SPMobileComponent RunAt="Server" TemplateName="MobileViewPicker" />
         <SPMobile:SPMobileComponent RunAt="Server" TemplateName="MobileDefaultSeparator" />
       </SPMobile:SPMobileControlContainer>
       <mobile:Label RunAt="Server" Text="Hello SharePoint Mobile User!"/>
       <SPMobile:SPMobileListItemIterator RunAt="Server" ListItemSeparatorTemplateName="MobileListItemSeparator" />
     </Template>
   

5. Guarde y cierre el archivo.

6. Restablezca Internet Information Services (IIS), escribiendo iisreset en una línea de comandos.

7. Si está utilizando un emulador de dispositivos en un equipo, en vez de un dispositivo móvil real, deberá eliminar los archivos temporales de Internet.

8. Vaya a la lista Anuncios con su emulador o dispositivo. Debe ver el saludo encima de la lista tal y como se muestra en la siguiente captura de pantalla:

Figura 1

Vea también

Otros recursos

Diseño y paginación de las páginas móviles
Procedimiento para personalizar las páginas de vista de lista móvil y formulario
Sistema de representación de páginas móviles