Usando UserControl

En el capítulo anterior hemos creado un UserControl, y ahora trataremos de usarlo por primera vez. Selecciona una página de tu proyecto, o crea una nueva para este fin, ábrela. Lo primero que debemos hacer es declarar nuestro UserControl. Puede ser realizado en cada página en que sea usado, o globalmente en el archivo web.config. No hay diferencia de rendimiento, pero cuando se declara UserControl en el archivo web.config, los controles deben residir en un directorio distinto a las páginas que lo utilizan.

Por ahora, declarémoslo dentro de la página. Agrega la siguiente línea debajo de la declaración Page:

<%@ Register TagPrefix="My" TagName="UserInfoBoxControl" Src="~/UserInfoBoxControl.ascx" %>

Asegúrate de que el valor de src sea igual a la ruta de tu archivo UserControl. Ahora ya puedes utilizar tu UserControl en tu página, como cualquier otro control. Por ejemplo, de esta manera:

<My:UserInfoBoxControl runat="server" ID="MyUserInfoBoxControl" />

Si miras la página ahora, verás a nuestro UserControl en acción, aunque la información estará un poco... limitada. Debemos dar valor a las propiedades que definimos, para hacer esto más interesante. Afortunadamente, es bastante fácil:

<My:UserInfoBoxControl runat="server" ID="MyUserInfoBoxControl" UserName="John Doe" UserAge="45" UserCountry="Australia" />

Verás, cada miembro public o protected puede ser accesado de manera declarativa, permitiendo un acceso sencillo a ellos cuando utilizamos nuestro control. Sin embargo, con este UserControl en específico, es más probable que recibas la información desde una fuente externa, como una base de datos, y de ahí llenes los datos. Esto usualmente involucra al CodeBehind de la página, ¿cómo podemos hacerlo? Muy sencillo, de hecho. En el CodeBehind de la página, prueba algo como esto:

protected void Page_Load(object sender, EventArgs e)
{
    // These values can come from anywhere, but right now, we just hardcode them
    MyUserInfoBoxControl.UserName = "Jane Doe";
    MyUserInfoBoxControl.UserAge = 33;
    MyUserInfoBoxControl.UserCountry = "Germany";
}

Cargando dinámicamente

Algunas veces querrás agregar UserControls a tú página de manera dinámica en vez de declararlos. Esto es también bastante sencillo. Necesitas un control existente donde puedas agregar UserControl, por ejemplo un Panel. Si no hay un control lógico en tu página donde puedas añadirlo, puedes crear uno con este fin - el control PlaceHolder fue hecho para situaciones como esta.

En tu página, defínelo así:

<asp:PlaceHolder runat="server" ID="phUserInfoBox" />

En el CodeBehind de la página, agregamos algo como esto:

phUserInfoBox.Controls.Add(LoadControl("~/UserInfoBoxControl.ascx"));

Usamos el método LoadControl para instanciar el UserControl especificando su ruta. Testo es muy fácil pero también muy anonimo - porque solo neceistamos el método LoadControl , no podremos realmente usar nuestras propiedades customizadas. Para hacer eso, necesitamos que .NET lo sepa. En una página tenemos que añadir la declaración arriba del todo:

<%@ Reference Control="~/UserInfoBoxControl.ascx" %>

Ahora podemos accesar a la clase UserInfoBoxControl como si fuera una clase común, esto significa que podemos castear el UserControl retornado por el método LoadControl a este tipo. En el siguiente ejemplo, hacemos justamente eso, después asignamos valor a las propiedades, al final, lo agregamos al PlaceHolder:

UserInfoBoxControl userInfoBoxControl = (UserInfoBoxControl)LoadControl("~/UserInfoBoxControl.ascx");
userInfoBoxControl.UserName = "John Doe";
userInfoBoxControl.UserAge = 78;
userInfoBoxControl.UserCountry = "Spain";
phUserInfoBox.Controls.Add(userInfoBoxControl);

Esto nos será útil, por ejemplo, puedes añadir varias instancias el mismo UserControl a solo una página, podrías hacerlo incluso dentro de un loop.