Silverlight May 2010 - Artículos - ILUMINA TU CÓDIGO

ILUMINA TU CÓDIGO

LA REVOLUCIÓN SILENCIOSA

May 2010 - Artículos

Ordenación y agrupación de datos en WCF R.I.A para Silverlight 4

En artículos anteriores hemos visto como podemos implementar WCF R.I.A Services en Silverlight 4. Ahora vamos a ir más allá para poder ver una parte del abanico de posibilidades que nos puede ofrecer este modelo.

Lo primero de todo es situarnos.Tenemos un proyecto que toma como fuente de datos, la archiconocida base de  datos Northwind. Las distintas tablas sobre las que vamos a trabajar (en concreto Orders, Employes y Customers) están relacionadas entre sí. Los datos de la tabla Orders son presentados en la interfaz de usuario a través del control DataGrid. El objetivo que perseguimos es poder ordenar estos datos y a la vez agruparlos según los criterios que consideremos relevantes.

Queremos realizar una organización de los datos del DataGrid. Para ello vamos a ordenarlos por el campo ShipCity y agruparlos por el campo ShipCountry.

Accedemos a el esquema de Home.xaml (debido a que es la página con la que trabajamos por defecto) para seleccionar el objeto ordersDomainDataSource. En la propiedad SortDescriptors, hacemos clic sobre el botón que esta anexo al título de la propiedad para editar los elementos de la colección.Cómo podemos observar a continuación:

image

En el editor de la colección de elementos añadimos un nuevo SortDescriptor. En el campo PropertyPath introducimos el valor del campo (ShipCity) por el cual van a ser ordenados los diferentes datos.

image

Ejecutamos la aplicación y podemos observar como los datos son ordenados por el campo deseado.

image

El siguiente paso es aplicar a los datos ordenados por el campo ShipCity, una agrupación por el campo ShipCountry. Para ello teniendo seleccionado el mismo objeto sobre el que hemos realizado la ordenación de datos, vamos a acceder a la propiedadad GroupDescriptor. Al hacer clic sobre el botón anexo al título de la propiedad, surgirá una nueva ventana emergente en la que debemos añadir un nuevo GroupDescriptor. En la propiedad PropertyPath el valor que tomará para realizar el agrupamiento será ShipCountry.

image

Ejecutamos el proyecto y vemos como además de estar ordenado esta agrupado por los campos que hemos decidido a lo largo de este apartado.

 

image

Posted: 26/5/2010 9:33 por RAÚL MAYO | con 1 comment(s)
Archivado en: ,
SharePoint 2010-Evolución vs Revolución

MOSSEvo_2blog

El próximo día 15/06/2010 a partir de las 11 de la mañana realizaremos el evento SharePoint 2010-Evolución vs Revolución en los Centros de Excelencia Software.

La Agenda del evento será la siguiente:

o Novedades generales de SharePoint 2010:

-Capacidades disponibles por defecto

-Versiones de SharePoint 2010.

o Cambios en la interfaz de usuario y en la arquitectura.

o SharePoint como plataforma de creación de soluciones de negocio:

-Visual Studio 2010 Tools para SharePoint

-Posibilidades a nivel de desarrollo

o Modelo de Objetos SharePoint en cliente:

-Acceso a datos desde cliente Silverlight

-Rich User Interface en SharePoint

Como ponentes contaremos con el MVP de SharePoint Juan Carlos González del CIIN, que nos mostrará la evolución que ha realizado dicha plataforma en su versión 2010.

Por otro lado los componentes del CES Microsoft Goretti Ortigosa y Raúl Mayo, se encargarán de presentarnos revolución del modelo de objetos SharePoint 2010 en el lado del cliente.

Si deseáis conocer más sobre esta temática, os animo a que asistáis inscribiéndoos aquí

Agilizando el diseño de proyectos con SketchFlow

Desde Cein venimos realizando una serie de jornadas, encaminadas al desarrollo de proyectos, mediante herramientas y metodología ágiles. Hoy me quiero sumar a esta causa, mostrándoos como podéis agilizar la parte de diseño de un proyecto a través de la herramienta SketchFlow de Microsoft.

Vamos a empezar situándonos y que mejor forma de comenzar describiendo que es  SketchFlow. Es la herramienta de Microsoft que permite convertir los prototipos o bocetos de un proyecto de desarrollo de software en el diseño final de la aplicación. Este diseño permitirá ser entregado al equipo de desarrollo y a la vez será comprendido por este de una forma rápida y sencilla, lo que conlleva reducción del tiempo de desarrollo gracias a la agilidad que ofrece  SketchFlow. También permite un contacto continuo con el cliente final, debido a que los bocetos pueden ser editados en todo momento como veremos más adelante.Finalmente el cliente puede ver constantemente la evolución del proyecto y por tanto sentirse integrado en el proyecto.

IMAGE_006   image

 

Una vez situados, os surgirá la duda de que herramientas he de utilizar para poder aprovecharme de todas las funcionalidades de  SketchFlow. Esta herramienta viene incluida en Expession Studio a partir de la versión 3. Aunque realmente donde vamos a utilizarla es en Expression Blend .

Para empezar a plasmar las ideas que quiere el cliente, ejecutaremos Expression Blend 4. A la hora de crear un nuevo proyecto de SketchFlow podemos tener dos vertientes. Por un lado que nuestro proyecto final se desarrolle en la plataforma WPF o en Silverlight.

En el menú superior elegiremos Archivo->Nuevo y elegiremos la opción de la plataforma en la que deseemos realizar nuestro proyecto como podemos observar a continuación:

Silverlight

image 

WPF

image

En el ejemplo que os muestro en este artículo voy a utilizar Silverlight. Como podemos ver, al crear el proyecto de SketchFlow consta de dos áreas diferenciadas, por un lado está el proyecto de Silverlight que realmente consta de App.xaml que sirve como motor de SketchFlow. Por otro lado tenemos el área dedicada a las distintas pantallas de nuestro prototipo.

image

Situándonos en el archivo Screen 1 vamos a introducir los diferentes elementos que hemos consensuado en una reunión previa a la elaboración del prototipo. Este constará en una pantalla inicial de un menú de etiquetas, cada una de ellas referenciará a un sitio distinto. Además tendrá una descripción de la empresa, ya que estamos desarrollando la Home de nuestro proyecto.Para realizar esta acción en la barra de herramientas elegiremos el icono de búsqueda image . En el área de búsqueda introduciremos SketchFlow. De este modo tendremos a nuestra disposición todos los objetos que podemos usar con la herramienta indicada.

Seleccionaremos el objeto TabControl-Sketch, que es el elemento que nos permitirá introducir las diferentes etiquetas. En este ejemplo he incluido 4 etiquetas (Inicio, Cursos, Certificaciones y Eventos). Ahora  elegiremos un bloque de texto siguiendo los mismos pasos que hemos tenido en cuenta con anterioridad. El resultado de nuestra página de Inicio debería ser parecido al siguiente:

image

Como hemos podido comprobar al añadir los diferentes elementos al prototipo, estos elemento se construyen  mediante Xaml. Por ello pueden ser utilizados con posterioridad en el proyecto final. Además Dicho lenguaje permite la fluida comunicación entre el diseñador y el desarrollador, además del cliente final.

Otras de las características que vamos a tener en cuanta es el SketchFlow Map, que es una vista gráfica de las distintas pantallas del prototipo y sus conexiones. Dicho elemento se encuentra en la parte inferior del área de diseño. Si no estuviera visible podemos mostrarla presionando la combinación de teclas Shift+F12.

image

Con este elemento podemos navegar y editar las distintas páginas del prototipo. Para añadir una nueva página basta con hacer clic sobre la página y presionar sobre crear una nueva pantalla de contenido como podemos observar en la siguiente imagen:

image

También podemos categorizar las distintas pantallas por colores, de forma que podamos distinguir el organigrama de las diferentes pantallas. Para ellos nos situaremos sobre la pantalla que deseemos categorizar y presionaremos sobre la paleta de colores y elegiremos el color acorde con la categoría deseada:

image

En nuestro caso queremos que el menú de etiquetas esté presente en todas las páginas, sin necesidad de repetir de nuevo la creación de los diferentes objetos. Para ello seleccionamos el objeto (TabControl-Sketch) y con el botón derecho sobre el mismo seleccionamos convertir en un componente de la pantalla.

image

Le daremos un nombre a dicho control común:

image

De este modo podremos introducir este elemento en cualquier pantalla sin necesidad de volverlo a crear.

Otro de los añadidos es la posibilidad de añadir notas a nuestras pantallas. Con esta características podremos indicar acciones o modificaciones que el cliente requiere en un momento dado sin tener el riesgo de perdida de información.

Para utilizar esta característica nos situamos en la barra de herramientas presionamos sobre el botón de búsqueda image y en el área dedicada para este fin introducimos notes, seleccionamos el elemento y podremos introducir las notas que deseemos.

image

Una vez creada las sucesivas pestañas podemos ver el comportamiento de nuestro prototipo ejecutándolo F5. También podemos realizar correcciones del boceto y exportar las mismas.

Para realizar correcciones debemos seleccionar la pestaña Feedback y utilizar las diferentes herramientas:

image

Para exportar el Feedback tendremos que situarnos en la pestaña Feedback y presionar sobre el icono representado con una carpeta u elegir exportar Feedback.

Otra opción que aún permite mejorar la comunicación entre el equipo de desarrollo y el cliente final es la posibilidad de empaquetar el prototipo y enviárselo al cliente para su posterior revisión. Para realizar esta acción, simplemente accederemos al menú archivo y la opción empaquetar el proyecto SketchFlow.

Por último, he de mencionar la capacidad que tiene SketchFlow para poder exportar nuestro prototipo a Microsoft Word. De esta forma se incluirán en el documento el mapa del prototipo, las diferentes pantallas, elemento enriquecidos de pantalla, etc..

Para ello entramos en el menú archivo y elegimos la opción exportar a Word y el resultado es el siguiente:

image

Como podéis ver SketchFlow tiene una gran versatilidad lo que ayuda a incrementar la agilidad a la hora de pasar de un prototipo al diseño definitivo del proyecto. Por otro lado la citada herramienta tiene una perfecta simbiosis con Silverlight y WPF, lo que nos otorga una menor perdida de esfuerzo a la hora de realizar los proyectos. Aumentando con todo esto la satisfacción del cliente gracias a una fluida comunicación,  a la par que se reduce el tiempo de entrega del producto final.

Error de Vulnerabilidad de MOSS y WSS

El miércoles 28 de abril, se puso en conocimiento a través de Chema Alonso, un error de vulnerabilidad de las plataformas Microsoft Office SharePoint Server 2007 (MOSS) y Windows SharePoint Services 3.0. El origen de este fallo radica en un ataque XSS sobre la página que ejecuta la ayuda (help.aspx) de las plataformas citadas con anterioridad.

La solución a este inconveniente afortunadamente se erradica de forma sencilla y rápida. Lo primero es localizar el archivo help.aspx, que se encuentra en la siguiente ruta Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\TEMPLATE\LAYOUTS. Una vez localizado lo abrimos con un editor de texto y eliminaremos el Form incluido dentro de la etiqueta <body> . Remplazamos dicho elemento por un mensaje amigable como “En este momento la ayuda por motivos de seguridad, disculpen las molestias” o el que tu creas más conveniente. A continuación podéis ver el resultado final de help.aspx:

help.aspx
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2. "http://www.w3.org/TR/html4/strict.dtd">
  3. <html runat="server"
  4. dir="<%$Resources:wss,multipages_direction_dir_value%>"
  5. >
  6.       <%@ Assembly Name="Microsoft.SharePoint.ApplicationPages" %> <%@ Page Language="C#" Inherits="Microsoft.SharePoint.ApplicationPages.HelpPage"%>
  7. <%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Import Namespace="Microsoft.SharePoint" %>
  8.     <head>
  9.         <META HTTP-EQUIV="expires" CONTENT="0" />
  10.         <link rel="stylesheet" type="text/css" href="/_layouts/<%= UiLcid.ToString(System.Globalization.CultureInfo.InvariantCulture) %>/styles/help.css"/>
  11.         <title><%# Microsoft.SharePoint.Utilities.SPHttpUtility.HtmlEncode(PageTitle) %></title>
  12.     </head>
  13.     <SharePoint:ScriptLink language="javascript" name="core.js" runat="server" />
  14.     <body class="<%# GetCssClassName("body") %>">
  15.         Se ha deshabilitado la ayuda por motivos de seguridad, disculpen las molestias.
  16.     </body>
  17. </html>

Hasta que en próximos días Microsoft ponga a disposición de todos los usuarios un parche para solucionar este bug deberemos de utilizar este método que aunque no es el más ortodoxo si es el más eficaz.

image