Compartir a través de


Información general sobre los elementos Web ASP.NET

Actualización: noviembre 2007

Los elementos Web ASP.NET son un conjunto integrado de controles para crear sitios Web que permiten a los usuarios finales modificar el contenido, la apariencia y el comportamiento de las páginas Web directamente desde un explorador. Las modificaciones se pueden aplicar a todos los usuarios del sitio o a usuarios individuales. Cuando los usuarios modifican páginas y controles, es posible guardar la configuración para conservar las preferencias personales de un usuario en futuras sesiones del explorador; esta característica se denomina personalización. Estas funciones de los elementos Web significan que los desarrolladores pueden permitir que los usuarios finales personalicen dinámicamente una aplicación Web, sin intervención del desarrollador o del administrador.

Utilizando el conjunto de controles de elementos Web, el usuario como desarrollador puede permitir que los usuarios finales hagan lo siguiente:

  • Personalizar el contenido de la página. Los usuarios pueden agregar nuevos controles de elementos Web a una página, quitarlos, ocultarlos o minimizarlos como las ventanas normales.

  • Personalizar el diseño de página. Los usuarios pueden arrastrar un control de elementos Web a una zona diferente de una página o cambiar su apariencia, sus propiedades y su comportamiento.

  • Exportar e importar controles. Los usuarios pueden importar o exportar configuraciones de controles de elementos Web para utilizarlas en otras páginas o en otros sitios, conservando las propiedades, la apariencia e incluso los datos de los controles. Esto reduce la necesidad de entrada de datos y de configuración por parte de los usuarios finales.

  • Crear conexiones. Los usuarios pueden establecer conexiones entre los controles de forma que, por ejemplo, un control gráfico podría mostrar un gráfico para los datos de un control de cotización bursátil. Los usuarios pueden personalizar no sólo la propia conexión, sino también la apariencia y los detalles de cómo el control gráfico muestra los datos.

  • Administrar y personalizar la configuración de todo el sitio. Los usuarios autorizados pueden configurar opciones para todo el sitio, determinar quién puede tener acceso a un sitio o a una página, establecer el acceso a los controles basado en funciones, etc. Por ejemplo, un usuario de una función administrativa podría establecer que un control de elementos Web estuviera compartido por todos los usuarios e impedir que los usuarios que no sean administradores personalicen el control compartido.

Fundamentos de los elementos Web

El conjunto de controles de elementos Web consta de tres pilares básicos: la personalización, los componentes estructurales de la interfaz de usuario y los controles de la interfaz de usuario de elementos Web reales. Para obtener más detalles, vea Información general sobre el conjunto de controles de elementos web. Gran parte del esfuerzo de desarrollo se centrará en los controles de elementos Web, que son simplemente controles ASP.NET que pueden utilizar las características del conjunto de controles de elementos Web.

Para ver un ejemplo de cómo pueden utilizarse los controles de elementos Web para crear páginas Web personalizables, examine la captura de pantalla siguiente.

Página típica de elementos Web

Esta página contiene varios elementos básicos de una aplicación de elementos Web:

  • Uso de zonas para el diseño de página. Hay dos columnas que pueden contener controles: una tiene los controles Weather y Stock Quotes, y la otra tiene los controles Hotmail y News. En la terminología de elementos Web, estas columnas se denominan zonas: las regiones de una página que contienen controles de elementos Web. Las zonas sirven para disponer los controles de elementos Web en una página y para proporcionar una interfaz de usuario común para los controles. En una página puede haber una o varias zonas, cada zona puede contener uno o varios controles de elementos Web y cada zona puede tener una orientación vertical u horizontal para el diseño de página.

  • Controles de elementos Web dentro de las zonas. Cada control tiene verbos de la interfaz de usuario (acciones que un usuario puede realizar) que pueden aparecer como vínculos, como botones o como imágenes seleccionables en el control. En la captura de pantalla anterior, observe que cada control tiene un botón en su barra de título que expone un menú desplegable. En los menús de cada control hay opciones para cambiar los detalles relativos a dicho control, así como otras opciones para realizar acciones frecuentes, como mover o eliminar un control y obtener Ayuda. Algunos controles, como el control Weather, permiten a los usuarios personalizarlos de manera que los controles sólo muestren información relevante para el usuario.

  • Vínculos para permitir una personalización amplia. Estos vínculos permiten a los usuarios cambiar el contenido, el color y el diseño de la página. Por ejemplo, si los usuarios hacen clic en el vínculo Agregar columna, una aplicación de elementos Web podría permitirles agregar otra columna a una página. O bien, los usuarios podrían hacer clic en el vínculo Agregar contenido, que muestra un catálogo de controles que pueden agregar opcionalmente a la página. Uno de ellos podría ser un control de gráfico de cotizaciones. Un usuario podría agregar ese control a una de las zonas de la página y, después, podría conectarlo al control Stock Quotes existente para representar gráficamente los datos bursátiles que contiene.

Escenarios de desarrollador para utilizar elementos Web

Normalmente hay tres formas de trabajar con elementos Web: crear páginas que utilicen controles de elementos Web, crear controles de elementos Web individuales o crear aplicaciones Web completas personalizables, como un portal.

Desarrollo de páginas

Los desarrolladores de páginas pueden utilizar herramientas de diseño visual como Microsoft Visual Studio 2005 para crear páginas que utilizan elementos Web. Una ventaja del uso de una herramienta como Visual Studio es que el conjunto de controles de elementos Web ofrece características para crear y configurar controles de elementos Web en un diseñador visual mediante operaciones de tipo arrastrar y colocar. Por ejemplo, puede utilizar el diseñador para arrastrar una zona de elementos Web, o un control editor de elementos Web, hasta la superficie de diseño y, después, configurar el control directamente en el diseñador utilizando la interfaz de usuario proporcionada por el conjunto de controles de elementos Web. Esto puede acelerar el desarrollo de aplicaciones de elementos Web y reducir la cantidad de código que tiene que escribir.

Desarrollo de controles

Puede utilizar cualquier control ASP.NET existente como un control de elementos Web, incluyendo los controles de servidor Web estándar, controles de servidor personalizados y controles de usuario. Para lograr el máximo control de programación de su entorno, también puede crear controles de elementos Web personalizados que derivan de la clase WebPart. Para el desarrollo de controles de elementos Web individuales, normalmente creará un control de usuario y lo utilizará como un control de elementos Web o desarrollará un control de elementos Web personalizado.

Como ejemplo del desarrollo de un control de elementos Web personalizado, podría crear un control que ofreciera cualquiera de las características proporcionadas por otros controles de servidor ASP.NET que pudiera ser útil empaquetar como un control de elementos Web personalizable: calendarios, listas, información financiera, noticias, calculadoras, controles de texto enriquecido para actualizar contenido, cuadrículas modificables que se conectan a bases de datos, gráficos que actualizan dinámicamente los datos o información meteorológica y de viajes. Si proporciona un diseñador visual con su control, cualquier desarrollador de páginas que utilice Visual Studio puede arrastrar su control hasta una zona de elementos Web y configurarlo en tiempo de diseño sin necesidad de escribir código adicional.

Desarrollo de aplicaciones Web

El desarrollo de aplicaciones Web totalmente integradas y personalizables, como un portal, implica el uso más completo de elementos Web. Puede desarrollar un sitio Web que permita una personalización completa de la interfaz de usuario y del contenido, con características similares a MSN. O incluso puede desarrollar una aplicación empaquetada que se puede distribuir y ser utilizada por compañías o ISP que proporcionan servicios de alojamiento de portales.

En un escenario de aplicación Web, puede proporcionar una solución completa para que los usuarios finales administren y personalicen la aplicación. Esto puede incluir un conjunto de controles de elementos Web que proporcionen las características deseadas para el sitio, un conjunto coherente de temas y estilos que permita a los usuarios personalizar la interfaz de usuario de manera coherente, catálogos de controles de elementos Web entre los cuales los usuarios puedan seleccionar los que deseen que aparezcan en una página, servicios de autenticación y administración basada en funciones (por ejemplo, permitir a los usuarios administrativos personalizar controles de elementos Web y la configuración del sitio para todos los usuarios).

Para cada parte de su aplicación, puede extender el conjunto de controles de elementos Web según sea necesario para proporcionar un mayor control sobre el entorno. Por ejemplo, además de crear controles de elementos Web personalizados para la interfaz de usuario principal de las páginas, quizás desee crear también un catálogo personalizado de elementos Web que sea coherente con la apariencia y el funcionamiento de su aplicación, y que ofrezca a los usuarios más flexibilidad para elegir cómo se agregan los controles a una página. O bien, podría extender un control de zona para proporcionar opciones adicionales de interfaz de usuario para los controles de elementos Web que contiene. También podría escribir un proveedor de personalización personalizado para ofrecer más flexibilidad y control sobre cómo se almacenan y se administran los datos de personalización.

Vea también

Tareas

Tutorial: Crear una página de elementos Web

Tutorial: Crear una página de elementos Web en Visual Web Developer

Conceptos

Información general sobre la personalización de elementos Web

Referencia

Información general sobre el conjunto de controles de elementos web

System.Web.UI.WebControls.WebParts