Nunca encuentras lo que necesitas (parte 1 de 2)

¿Requieres un nuevo panel porque entre los que te ofrece Silverlight ninguno cumple tus demandas? No hay problema, aquí te explicamos cómo construir uno… o varios.

Silverlight incluye una cantidad generosa de controles. Si entre ellos no está el que necesitas puedes buscarlo en el Toolkit. Y si aun no lo encuentras hay muchos terceros que tienen enormes librerías de controles. Pero si aun no lo encuentras… agárrate de donde puedas, tocó sacar martillo y serrucho para comenzar a construir uno nuevo.

Afortunadamente Silverlight permite extender o reemplazar sus controles (de ahí decimos que Silverlight es “Extensible”). Sin embargo, crear un panel no es lo mismo que crear un control. No es más fácil ni más difícil, simplemente es un concepto diferente.

Comencemos por aclarar que la razón de ser de un panel es presentar y organizar en su interior (o en ocasiones fuera de él) uno o varios controles. El Grid, el Canvas y el StackPanel son ejemplos de paneles. Cada uno organiza los controles en su interior de una manera diferente y, generalmente, el panel mismo no tiene una representación visual, su único trabajo es acomodar sobre la interfaz otros controles.

Teniendo claro qué es un panel y lo que hace, podemos inferir que nuestro trabajo se reduce, como mínimo, a organizar una serie de controles sobre la interface. Antes de lanzarnos a escribir código es imprescindible conocer la teoría básica de cómo el mismo Silverlight organiza los controles en la interface ya que debemos hacerlo de forma similar.

Lo que vamos a hacer

Comencemos por el final, he aquí el panel que vamos a crear: 

MyCustomPanel

Este panel hace lo siguiente:

· Organizar un grupo de controles alrededor de un centro.

· Mientras sea posible, los controles quedarán circunscritos al interior del panel y no serán dibujados fuera de él.

· El espacio entre los controles serán proporcional, esto es, se dividirá una circunferencia de 360° (como todas) entre el número de controles y en cada extremo de la división se dibujará un control.

· Si el panel llegase a estar dentro de un contenedor que no restringe el tamaño de sus controles, como es el caso del Canvas, se asumirá un tamaño máximo de 300 por 300 puntos y no un tamaño ilimitado.

Estas reglas son importantes porque es lo que necesitamos que haga nuestro panel. También es igualmente importante aclarar que estas reglas son exclusivas para lo que necesitamos en este ejemplo específico.

Así debemos hacerlo

Todos los paneles deben heredar de la clase Panel y sobrescribir un par de métodos que el Layout System ejecuta en el siguiente orden:

MeasureOverride: Aquí a nuestro panel se le indica de cuanto espacio (expresado como un área rectangular) dispone. Este dato le llega del control donde reside el panel, que a su vez puede ser otro panel. Adicionalmente hacemos algunos cálculos y le indicamos a los controles hijos de nuestro panel de cuanto espacio dispone cada uno. Finalmente le indicamos al control padre (aquel que contiene a nuestro panel) de cuanto espacio preferiríamos disponer, en caso de que el otorgado no fuese suficiente. En resumen, en este método hacemos un estimado del espacio que necesitaremos.

ArrangeOverride: Aquí a nuestro panel se le indica, finalmente y después de muchos cálculos organizando este y otros controles sobre la interfaz, de cuanto espacio dispone. Tengamos presente que este espacio puede llegar a ser diferente al informado en el MeasureOverride. Ya teniendo este datico procedemos a calcular la posición y el espacio final para cada uno de los controles hijos. Finalizamos informando al control padre (aquel que contiene a nuestro panel) la cantidad de espacio que nuestro panel utilizará. En resumen, en este método todos los hijos de nuestro panel serán ubicados en su posición final.

Teniendo esto claro, nos vemos en una próxima edición de Silverideas para que veamos, código en mano, como implementar un panel.

PD. La próxima edición ya está lista… aquí.

Anuncios

Acerca de SilverIdeas

Instructor y entusiasta en el uso de Silverlight y otras tecnologías XAML.
Esta entrada fue publicada en Silverlight. Guarda el enlace permanente.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s