Conjuntos de plantillas y controles con plantillas

Actualización: noviembre 2007

ASP.NET proporciona controles con plantillas que exponen varias propiedades de plantilla que definen el contenido y el diseño del control. Estas plantillas se insertan en los lugares adecuados durante la representación del control. Por ejemplo, hay plantillas para el control List, tales como las plantillas de encabezado y pie de página. Esta función permite personalizar significativamente la apariencia de los controles en tiempo de ejecución, basándose en el dispositivo.

Los controles de ASP.NET Mobile amplían este modelo e introducen la noción de conjuntos de plantillas. Un conjunto de plantillas es una colección de plantillas. Sin embargo, un único control con plantillas puede hacer referencia a varios conjuntos de plantillas, y cada uno de los conjuntos puede tener criterios diferentes específicos de dispositivos.

Criterios de representación de conjuntos de plantillas

Cada conjunto de plantillas de un control con plantillas está contenido en un elemento <Choice> que, a su vez, reside en un elemento <DeviceSpecific> compartido. En tiempo de ejecución, las opciones del elemento <DeviceSpecific> se evalúan en orden. El primer elemento <Choice> coincidente se utiliza para el contenido específico de dispositivos. Si la opción seleccionada contiene plantillas, el control las utiliza. Si no se encuentran plantillas, o si ninguna de las opciones especificadas es correcta, el control representa el marcado predeterminado.

Plantillas no dependientes de los dispositivos

Cualquier control con plantillas puede tener una plantilla que no dependa del dispositivo. Para especificar plantillas que no dependan del dispositivo, utilice un elemento <Choice> sin un atributo Filter explícito. Cuando se especifique, una opción que no dependa del dispositivo debe ser siempre la última opción declarada, de tal manera que se seleccione sólo si no se pueden aplicar otras opciones al dispositivo de destino.

Representación específica de controles

El comportamiento de la representación de controles en el modo con plantillas es específico de cada control. Algunos controles, como List y ObjectList, podrían representar todo su contenido utilizando las plantillas proporcionadas. Otros controles pueden agregar el contenido de plantillas específicas a su contenido predeterminado. Por ejemplo, si se selecciona una plantilla de encabezado o de pie de página para el control Form, el marcado que contenga la plantilla se agregará al contenido del formulario como encabezado o pie de página, respectivamente.

Configurar las propiedades de un control con plantillas

Para establecer las propiedades de un control en una plantilla mediante programación, es necesario obtener una referencia al contenedor de nomenclatura y utilizar el método FindControl para encontrar el control. Después, se pueden establecer sus propiedades. Esta técnica se ilustra en el siguiente ejemplo.

Nota:
Dado que información de la hoja de estilos se carga antes de que se pueda cambiar la propiedad StyleReference mediante programación, cambiarla en el código no tiene ningún efecto.

void Page_Load(Object sender, EventArgs e)
{
    // Iterate through the controls in the form.
    foreach(Control c in Form1.Controls)
    {
        if(c.GetType()) == typeof(TemplateContainer)
        {
            // Get the link control.
            Link ctrl = (Link)c.FindControl("myLink");
            if (ctrl != null)
            {
                // Set the text and url properties.
                ctrl.Text = "Home Page";
                ctrl.NavigateURL = "https://www.microsoft.com";
            }
        }
    }
}

Configuraciones y estilos de plantillas

Los estilos de un control StyleSheet también pueden contener conjuntos de plantillas. Por lo tanto, se pueden tener controles con varias plantillas que hagan referencia al mismo estilo, utilicen los mismos conjuntos de plantillas y proporcionen las mismas ventajas de encapsulación que proporciona un estilo. Dispone de un ejemplo en el que se ilustran los conjuntos de plantillas en el tema Tutorial rápido de controles ASP.NET Mobile.

Plantillas de estilo frente a propiedades de estilo

Se puede heredar un estilo de un elemento primario, se puede establecer explícitamente la propiedad StyleReference o se puede heredar el estilo mediante agregación. Sin embargo, con las plantillas no se produce el efecto de cascada. No se puede recuperar una plantilla de una plantilla de estilo primario a no ser que se utilice una plantilla dentro de una hoja de estilos. Para obtener más información, vea Estilos.

Plantillas agregadas dinámicamente

En algunos escenarios avanzados es útil crear instancias de forma dinámica y agregar plantillas. En el ejemplo de código siguiente se agregan plantillas a un controlador de eventos Init.

<%@ Page Language="C#" 
    Inherits="System.Web.UI.MobileControls.MobilePage" %>
<script >
    private void Form_Init(object sender, System.EventArgs e)
    {
        DeviceSpecific devSpecific = new DeviceSpecific();

        // Create the choice tag.
        DeviceSpecificChoice devChoice = 
            new DeviceSpecificChoice();
        devChoice.Filter = "isHTML32";

        // Create the template.
        ITemplate myTemplate = 
            new CustomTemplate("HeaderTemplate");

        // Create the templateContainer.
        TemplateContainer container = new TemplateContainer();
        myTemplate.InstantiateIn(container);

        // Create the tree.
        devChoice.Templates.Add("HeaderTemplate", myTemplate);
        ((IParserAccessor)devSpecific).AddParsedSubObject(devChoice);
        ((IParserAccessor)form1).AddParsedSubObject(devSpecific);
    }
    public class CustomTemplate : ITemplate
    {
        String strWhichTemplate;

        public CustomTemplate(String strTemplate)
        {
            strWhichTemplate = strTemplate;
        }

        public void InstantiateIn(Control container)
        {
            if (strWhichTemplate == "HeaderTemplate")
            {
                System.Web.UI.MobileControls.Label lb =
                    new System.Web.UI.MobileControls.Label();
                lb.Text = "Header Template";

                System.Web.UI.MobileControls.Command cmd = 
                    new System.Web.UI.MobileControls.Command();
                cmd.Text = "heLLo";

                container.Controls.Add(lb);
                container.Controls.Add(cmd);
            }
            else if (strWhichTemplate == "FooterTemplate")
            {
                System.Web.UI.MobileControls.Label lb = 
                    new System.Web.UI.MobileControls.Label();
                lb.Text = "FooterTemplate";
                container.Controls.Add(lb);
            }
        }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
  <mobile:form id="form1"  OnInit="Form_Init">
  </mobile:form>
</body>
</html>

Consideraciones especiales para la utilización de plantillas específicas de dispositivos

Cuando se mezclan lenguajes de marcado específicos de dispositivos con controles móviles, se debe garantizar la coherencia, basándose en lo que los controles móviles están representando. El motivo es que no se admite la detección y adaptación inteligente cuando se combinan el marcado con lenguaje específico de dispositivos y el marcado con lenguaje independiente de dispositivos.

Por ejemplo, observe el valor alignment del primer control Panel y del control Label en el siguiente ejemplo de código:

<mobile:Panel runat=server alignment="right">
<DeviceSpecific>
  <Choice Filter="isWML11">
    <ContentTemplate>
      <table columns="2" align="LR">
        <tr><td>
    </ContentTemplate>
  </Choice></Devicespecific>
</mobile:panel>

<Mobile:Label id="label1" runat=server Text="HELLO, HOW ARE YOU?" 
    alignment="left">
</Mobile:Label>
<mobile:Panel runat=server>
<DeviceSpecific>
  <Choice Filter="isWML11">
    <ContentTemplate></td><td>
    </ContentTemplate>
  </Choice>
</DeviceSpecific> 
</mobile:panel>

Se utilizan elementos <p> para representar una alineación no predeterminada. En el ejemplo anterior, el segundo control Label está dentro de un elemento <td> de WML y el elemento <p> generado para el segundo control Label se representa incorrectamente en el explorador porque se encuentra dentro del elemento <td>.

En este caso, el control Label no hereda la alineación del primer control Panel, por lo que genera una etiqueta <p> para su alineación. Sin embargo, en esta situación, no se puede agregar una etiqueta <p>. Esta situación no es habitual, pero el problema se puede solucionar marcando el control Label como visible si el dispositivo de destino no está basado en WML y especificando el texto del control Label dentro de la plantilla.

Marcado arbitrario específico de dispositivos

En algunos casos, puede que desee insertar un marcado arbitrario para un dispositivo o tipo de dispositivo específico. Con este fin, las páginas Web de ASP.NET Mobile proporcionan una plantilla de contenido para el control Panel. Si una opción seleccionada contiene una plantilla de contenido, el control se representa utilizando la plantilla en lugar de su contenido habitual.