Una de las cosas que echaba de menos en Visual Studio 2010 y que no aparece de forma predeterminada, es la posibilidad de ver el número de línea en el que nos encontramos.
Esta capacidad nos permite acceder de forma rápida y precisa a un error que se ha producido, cuando realizamos pruebas de testeo de nuestras aplicaciones, etc..
Para utilizar la numeración de líneas en Visual Studio 2010, accedemos a Herramientas->Opciones
En Opciones expandiremos Editor de Texto->Expandiremos C#
Dentro de la pestaña General, tendremos que seleccionar Números de Línea.
De este modo podremos inmediatamente utilizar esta propiedad de Visual Studio 2010!!!!!
La unión hace la fuerza, basándome en esta celebre frase, vamos a unir la capacidad de respuesta y la interactividad de SharePoint 2010, con el amplio abanico de posibilidades que ofrece Silverlight en cuanto a la creación de experiencias de usuario se refiere.
Para demostrar la productividad de esta unión, vamos a crear un Webpart de basado en Silverlight.Este leerá el contenido de las diferentes listas, que contiene el sitio de SharePoint 2010 que usaremos para este artículo.
Comenzaremos accediendo a el sitio de SharePoint 2010 sobre el que vamos a trabajar a lo largo de este artículo. Dentro del mismo vamos a crear una biblioteca de documentos, en la que guardaremos el archivo .XAP. Resultante de implementar la solución desarrollada en Silverlight.
La creación de la biblioteca de documentos la realizaremos accediendo a Acciones de Sitio->Nueva Biblioteca de Documentos, como podemos observar en la siguiente imagen:
Al realizar dicha acción, nos surgirá una ventana emergente en la que introduciremos el nombre de la biblioteca de documentos.En este caso la nombraremos como StoreSilverlight el resto de opciones las dejaremos como en la siguiente imagen:
Ahora vamos a añadir una nueva WebPart con formato Silverlight. Nos situamos en Acciones del Sitio y elegimos la acción de Editar Página.
Al elegir está acción, nuestra página pasará a estado de edición. En la sección Herramientas de edición elegimos la pestana Insertar. Seguidamente seleccionamos la opción Elemento Web(Webpart).
Ahora en la sección Categorías seleccionamos Medios y Contenidos y por último elegimos Elemento Web de Silverlight y elegimos Aceptar.
Realizando la anterior acción, nos aparecerá una ventana emergente donde se pedirá la url donde vamos a situar el archivo .XAP. Elegiremos la url de la biblioteca de documentos StoreSilverlight, creada con anterioridad. En la parte final de este artículo, indicaremos al webpart el lugar y nombre exacto del archivo .XAP.
Como podéis observar se a creado el WebPart pero no tiene contenido, así que manos a la obra para crear ese contenido. Creamos un nuevo proyecto en Visual Studio 2010, la plantilla que vamos a utilizar es Visual C#->SharePoint->2010->Empty SharePoint Project. El nombre del proyecto será ImplementarSolSP.
Al crear este proyecto, se pide que apunte hacia el sitio web con el que estamos trabajando:
El siguiente paso es incluir un nuevo proyecto Silverlight, para ello nos situamos en la solución(ImplementarSolSP) con el botón derecho y elegimos Añadir nuevo proyecto. Elegimos la siguiente plantilla Visual C#->Silverlight->Silverlight Application. El nombre de el proyecto será AplicacionSilverlight. Al crear el proyecto debemos deseleccionar, la opción de crear un alojamiento de prueba para el proyecto creado como podemos observar en la siguiente imagen:
El último paso que realizaremos en nuestro proyecto Silverlight es cambiar el fondo de nuestro proyecto, para que este se distinga cuando sea implementado en el WebPart.
Accedemos al archivo MainPage.Xaml y dentro de la etiqueta Grid incluiremos el siguiente fragmento de código:
- <Grid.Background>
- <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
- <GradientStop Color="Black" Offset="0" />
- <GradientStop Color="White" Offset="1" />
- </LinearGradientBrush>
- </Grid.Background>
- </Grid>
Ahora añadimos a ImplementarSolSP el módulo que consigue incluir el archivo .Xap de Silverlight en SharePoint 2010. Presionamos con el botón derecho sobre la solución ImplementarSolSP, elegimos añadir nuevo elemento y elegimos la plantilla Visual C#->SharePoint->2010->Module. El nombre del módulo será ModuloSilverlight.
Seguidamente en el explorador de soluciones de Visual Studio 2010, vamos a situarnos con el botón derecho sobre el archivo Sample.txt y elegiremos la opción borrar.
Ahora vamos a decir a nuestro proyecto SharePoint que implemente la solución a través de el modulo de Silverlight que hemos creado con anterioridad. Para ello, hacemos Click sobre ModuloSilverlight y en la sección propiedades de Visual Studio 2010, seleccionamos el botón desplegable de la propiedad Project Output References como podemos observar en la siguiente imagen:
Al presionar dicho botón aparecerá una ventana emergente en la que presionaremos sobre añadir.Al añadir un nuevo miembro debemos de elegir el tipo de implementación como ElementFile y el nombre del proyecto será AplicacionSilverlight como podemos observar en la siguiente imagen:
Presionamos Ok para realizar la correspondiente acción.
Ahora nos situamos en el archivo Elements.xml, dejando su contenido del siguiente modo:
- <?xml version="1.0" encoding="utf-8"?>
- <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
- <Module Name="ModuloSilverlight" Url="StoreSilverlight">
- <File Path="ModuloSilverlight\AplicacionSilverlight.xap" Url="AplicacionSilverlight.xap" Type="GhostableInLibrary"/>
- </Module>
- </Elements>
Como podemos observar le decimos al módulo de carga que guarde el archivo .Xap en nuestra biblioteca de documentos StoreSilverlight.
Ahora solo queda construir la solución (F6 en Visual Studio 2010), después implementaremos la solución:
Finalmente comprobaremos que la solución a través del archivo AplicacionSilverlight.xap a sido añadida a la biblioteca de documentos StoreSilverlight.
Para que se cargue AplicacionSilverlight.xap en el Webpart deberemos situarnos en el WebPart y elegir la opción abre el panel de herramientas, al realizar dicha acción se desplegará el cuadro de opciones del WebPart como podemos observar a continuación:
Al presionar configurar nos pedirá una url donde está situado el archivo que va ser mostrado en la WebPart:
De esta forma podremos ver que efectivamente la solución de Silverlight se ha implementado en el WebPart:
Vamos a pasar a la segunda parte del artículo que es poder acceder a las listas de nuestro sitio SharePoint 2010 y trabajar con su contenido a través del WebPart de Silverlight creado con anterioridad.
Abrimos la solución ImplementarSolSP con Visual Studio 2010 y accedemos al proyecto AplicacionSilverlight. Presionando sobre referencias con el botón derecho, elegimos añadir nueva referencia.En la ventana emergente elegiremos la pestaña examinar, las librerías que queremos usar son Microsoft.SharePoint.Client.Silverlight y Microsoft.SharePoint.Client.Silverlight.Runtime, que están situadas en C:\Archivos de Programa\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin .
Ahora debemos de referenciar dichas librerías en el proyecto. Abrimos AplicacionSilverlight.xaml.cs y las referenciamos añadiendo el siguiente código:
- using Microsoft.SharePoint.Client;
Abriremos el archivo App.xaml.cs y referenciamos nuevamente las librerías añadiendo el siguiente código:
- using System.Windows.Shapes;
- using Microsoft.SharePoint.Client;
Nos situamos en el método Application_Startup incluyendo el siguiente código en el mismo:
- private void Application_Startup(object sender, StartupEventArgs e)
- {
- ApplicationContext.Init(e.InitParams, SynchronizationContext.Current);
- this.RootVisual = new MainPage();
- }
De esta forma sincronizaremos SharePoint con el proyecto Silverlight.
Ahora vamos a modificar la interfaz del proyecto Silverlight. Abrimos AplicacionSilverlight.xaml e incluimos el siguiente código:
- <Grid x:Name="LayoutRoot">
- <Grid.Background>
- <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
- <GradientStop Color="Black" Offset="0" />
- <GradientStop Color="White" Offset="1" />
- </LinearGradientBrush>
- </Grid.Background>
- <StackPanel Orientation="Horizontal" >
- <ListBox Name="lbLists" Width="300" Height="400" ScrollViewer.VerticalScrollBarVisibility="Auto" Margin="20,20,20,20" />
- <TextBox Name="txtDetails" Width="200" Height="400" TextWrapping="Wrap" />
- </StackPanel>
- </Grid>
Como podemos observar hemos introducido dentro de Grid principal un objeto ListBox que cargará las diferentes listas de SharePoint y un objeto TextBox que se encargará de cargar los detalles de cada una de las listas.
Ahora situándonos en AplicacionSilverlight.xaml.cs vamos a incluir dos variables, _sitio se encarga de cargar el sitio y _list se encarga de cargar las diferentes listas del sitio.
- private Microsoft.SharePoint.Client.Web _sitio;
- private Microsoft.SharePoint.Client.List _list;
El siguiente paso es la creación del contexto basado en el sitio que utilizamos para este artículo y cargarle las listas de este sitio. Para ello debemos introducir el siguiente código en el constructor:
- public MainPage()
- {
- InitializeComponent();
- ClientContext context = new ClientContext(ApplicationContext.Current.Url);
- // creamos un nuevo contexto sobre el sitio que vamos a trabajar
-
- _sitio = context.Web;//cargamos el contexto en la variable
- //cuando carga el contexto cargará las listas y el sitio
- context.Load(_sitio);
- context.Load(_sitio.Lists);
- //la llamada del contexto ha de hacerse de forma asincrona
- context.ExecuteQueryAsync(new ClientRequestSucceededEventHandler(OnRequestSucceeded), new ClientRequestFailedEventHandler(OnRequestFailed));
- }
A continuación vamos a agregar los dos métodos que hemos nombrado en la llamada asincrona utilizada con anterioridad:
- private void OnRequestSucceeded(Object sender, ClientRequestSucceededEventArgs args)
- { //si la petición se a realizada correctamente se llama al método FillList
- Dispatcher.BeginInvoke(FillList);
- }
-
- private void OnRequestFailed(Object sender, ClientRequestFailedEventArgs args)
- {
- }
- private void FillList()
- {
- //borra el listbox con los contenidos que tenia anteriormente
- lbLists.Items.Clear();
- lbLists.ItemsSource = _sitio.Lists;
- //se carga en el listBox las diferentes listas
- lbLists.DisplayMemberPath = "Title";
- //se muestra el campo de la lista que se va mostrar
- }
Situándonos en el área de diseño de AplicacionSilverlight.xaml, haremos doble clic sobre el ListBox, para generar el evento de cambio de selección de Item. Al realizar dicha acción accederemos directamente a AplicacionSilverlight.xaml.cs e incluiremos el siguiente código:
- private void lbLists_SelectionChanged(object sender, SelectionChangedEventArgs e)
- {
- using (ClientContext context = new ClientContext(ApplicationContext.Current.Url))
- {
- _list = context.Web.Lists.GetByTitle(((Microsoft.SharePoint.Client.List)lbLists.SelectedItem).Title);
- context.Load(_list);
- context.ExecuteQueryAsync(new ClientRequestSucceededEventHandler(OnListDetailsRequestSucceeded), null);
- }
- }
- private void OnListDetailsRequestSucceeded(Object sender, ClientRequestSucceededEventArgs args)
- { //Añadimos la rutina de devolución de llamada para la consulta asincrónica:
- Dispatcher.BeginInvoke(ShowListDetails);
- }
Por último añado el método que mostrará los detalles de la lista seleccionada en el ListBox en el TextBox:
- private void ShowListDetails()
- {
- string infoAboutList =
- string.Format("List Details:" + Environment.NewLine + "Title: {0}" + "Description: {1}" + "Item Count: {2}" + "Base Template: {3}" + "Base Type: {4}" + "Content Types Enabled?: {5}" + "Hidden?: {6}",
- _list.Title + Environment.NewLine,
- _list.Description + Environment.NewLine,
- _list.ItemCount + Environment.NewLine,
- _list.BaseTemplate + Environment.NewLine,
- _list.BaseType + Environment.NewLine,
- _list.ContentTypesEnabled + Environment.NewLine,
- _list.Hidden + Environment.NewLine);
-
- txtDetails.Text = infoAboutList;
- }
Para ver el efecto de todos los cambios que hemos realizado, construimos nuevamente la solución(F6 en Visual Studio 2010) e implementamos la solución. El paso definitivo es refrescar la página en la que hemos introducido la WebPart de Silverlight. El resultado es el de la siguiente imagen:
En conclusión, uniendo las dos plataformas de Microsoft podemos crear unas experiencias de usuario muy dinámicas, donde tenemos un nivel de productividad muy alto. Ahora solo queda que le deis una vuelta de tuerca a la idea inicial y conseguiréis proyectos realmente profesionales.
Con la puesta en marcha de la versión RC de la plataforma Silverlight 4, se han producido una serie de cambios en ciertas novedades de la versión Beta de Silverlight 4 ya presentaba. Voy a reseñar los cambios que presenta la API de impresión.
En la versión Beta cuando deseabas introducir el nombre del documento se realizaba del siguiente modo:
- PrintDocument docToPrint = new PrintDocument();
- docToPrint.DocumentName = "Nombre del documento";
En la versión RC es obligatorio introducir el nombre del documento y forma parte del método Print() como podemos observar:
- PrintDocument docToPrint = new PrintDocument();
- docToPrint.Print( "Demostración API de Impresión");
Otro de los cambios es que ha desaparecido el método StartPrint() por el método BeginPrint como podemos observar en los siguientes fragmentos de código:
En la versión Beta
- docToPrint.StartPrint += (s, args) =>
- {
- ActivityDisplay.IsActive = true;
- };
En la versión RC
- docToPrint.BeginPrint += (s, args) =>
- {
- ActivityDisplay.IsActive = true;
-
- };
En conclusión, si hemos realizado proyectos con la versión Beta de Silverlight 4, podemos encontrarnos que en las versión RC fallen los citados elemento.De este modo introduciendo los nuevos métodos, podemos disfrutar plenamente de la funcionalidad de impresión de la plataforma.
El próximo 19 de abril de 2010 en la Universidad Pública de Navarra se celebrará el evento Microsoft Break en el que gracias a la invitación de Microsoft impartiré una charla sobre Silverlight. Dicho evento contará de dos charlas, la primera tratará sobre Windows Azure será impartida por Elisa (integrante del equipo de desarrollo de Microsoft) se tratarán temas como la definición de la nube y los distintos tipos de servicios que se pueden ofrecer.
En adición, se presentará Windows Azure, un sistema operativo de servicios en la nube que trabaja como entorno de desarrollo, hospedando servicios y controlándolos, con soporte a todo tipo de lenguajes y entornos, además de los propios de Microsoft.
En cuanto a la charla de Silverlight se tratará las aplicaciones ricas en Internet consistentes en el aprovechamiento de la experiencia de usuario en herramientas y funciones de escritorios naturales. La integración del diseñador en el ciclo de desarrollo del Software, las distintas novedades que se han incluido en la versión 4 de la citada plataforma y por último como sacar un rendimiento productivo a las aplicaciones de Silverlight desarrolladas en entornos móviles.
Os animo a que asistáis a este evento registrándose aquí.
Hoy voy a proponer un proyecto que en si tiene gran utilidad, un lector de Rss en Silverlight 4, en vuestras manos queda darle un toque sofisticado y de ingenio a esta idea inicial.
Vamos a empezar creando un nuevo proyecto de Silverlight 4 en Visual Studio 2010. Una vez realizado nuestro proyecto por defecto, tenemos que extraer un Rss de la página que deseemos. Leer ese Rss, ya que es un archivo XML, transformar cada nodo de ese archivo XML en una cadena y presentarla en el interfaz de usuario.
El primer paso para conseguir nuestra meta, es crear una clase con las propiedades que obtendremos del Rss y que vamos a presentar en cada una de las entradas de la interfaz de usuario. Para ello añadiremos a nuestro proyecto del lado del cliente la siguiente clase(ElementosRSS):
- using System;
- using System.Net;
- using System.Windows;
- using System.Windows.Controls;
- using System.Windows.Documents;
- using System.Windows.Ink;
- using System.Windows.Input;
- using System.Windows.Media;
- using System.Windows.Media.Animation;
- using System.Windows.Shapes;
-
- namespace LeerRSS
- {
- public class ElementosRSS
- {
- #region Properties
- public string RSSTitulo { get; set; }
- public Uri RSSEnlace { get; set; }
- #endregion
- }
- }
Seguidamente tenemos que añadir una referencia a nuestro proyecto para que pueda leer el archivo XML de la RSS de la página que nosotros decidamos. Presionamos con el botón derecho sobre Referencias y elegimos Agregar Referencia. En la pestaña .NET seleccionamos la referencia System.ServicesModel.Syndication como podemos observar en la siguiente imagen:
No debemos de olvidarnos de añadir las referencia a la librería mencionada con anterioridad en MainPage.xaml.cs, que es el código Behind de la interfaz de usuario de Silverlight:
- using System.Xml;
- using System.ServiceModel.Syndication;
Dentro del mismo archivo donde hemos incluido las referencia vamos a incluir tres variables. RSSUrl tendrá el valor de la URL de la página de cada una de las entradas del RSS. LectorXML será el encargado de leer el archivo XML que nos ofrece el RSS de la página. Feed que es la encargada de obtener la fuente de sindicación de las diferentes entradas del RSS.
- private Uri RSSUrl;
- private XmlReader LectorXML;
- private SyndicationFeed Feed;
En el constructor(inmediatamente después de InitializaComponent) deberemos añadir el siguiente fragmento de código:
- RSSUrl = new Uri("http://geeks.ms/blogs/rmayo/rss.aspx");
- WebClient client = new WebClient();
- client.DownloadStringCompleted += new DownloadStringCompletedEventHandler(client_DownloadStringCompleted);
- client.DownloadStringAsync(RSSUrl);
Como podemos observar introducimos la url de la página de la que queremos absorber el RSS. La clase WebClient de Silverlight es la encargada de abrir el RSS(XML).Puesto que la operación se realiza de forma asincrónica se llama al método de devolución de llamada (DownloadStringCompleted) después de realiza dicha operación.
Ahora vamos a encargarnos de crear la interfaz de usuario, para ello nos situamos en MainPage.xaml, e introducimos el siguiente fragmento de código XAML:
- <UserControl x:Class="LectorRSS.MainPage"
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
- xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
- xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
- mc:Ignorable="d"
- d:DesignHeight="300" d:DesignWidth="400">
-
- <Grid x:Name="LayoutRoot">
- <Grid.Background>
- <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
- <GradientStop Color="Black" Offset="0"/>
- <GradientStop Color="#FFBBB9B9" Offset="0.943"/>
- </LinearGradientBrush>
- </Grid.Background>
- <ItemsControl x:Name="RSS" ItemsSource="{Binding}" Margin="163,62,150,113" >
- <ItemsControl.ItemTemplate>
- <DataTemplate>
- <HyperlinkButton x:Name="Title" NavigateUri="{Binding RSSLink}"
- Width="305" Margin="0,22,0,15" Foreground="#FFD5C214"
- FontSize="12" FontWeight="Bold">
- <!--cada una de las entradas de RSS son introducidas en un hyperlink-->
- <TextBlock Text="{Binding RSSTitle}" TextWrapping="Wrap" FontSize="18.667" FontFamily="Times New Roman" Foreground="#FF0CB8DC" />
- <!--cada uno de los hyperlinks mostrará el txto de cada una de las entradas-->
- </HyperlinkButton>
-
- </DataTemplate>
- </ItemsControl.ItemTemplate>
- </ItemsControl>
- </Grid>
- </UserControl>
Lo que hemos introducido en la interfaz de usuario es una plantilla de datos que nos mostrará cada una de las entradas del RSS,en forma de un Hyperlink.Cada Hyperlink tendrá el titulo de cada una de las entradas de la página de la que obtenemos el RSS.De forma que el usuario al ver cada una de las entradas pueda acceder inmediatamente a ellas.
Ahora, nos centraremos en la creación del método DownloadStringCompleted en MainPage.xaml.cs podemos recuperar el RSS en forma de una cadena. A continuación, podemos crear nuestra XmlReader y cargarlo a una variable de SyndicationFeed que trata el XML como un 'RSS' y nos permite utilizar sus propiedades:
- private void client_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
- {
- if (e.Error == null)
- {
- int itemsCount = 5;//número de entradas del RSS
- LectorXML = XmlReader.Create(new StringReader(e.Result));//lector de XML
- Feed = SyndicationFeed.Load(LectorXML); //se introduce el XML en una variable
- //de tipo SyndicationFeed
-
- List<ElementosRSS> itemsList = new List<ElementosRSS>();//creamos una colección
- //para introducir los 5 elementos del RSS
-
- if (Feed.Items.Count() < 5)
- {
- itemsCount = Feed.Items.Count();
- }
-
- for (int i = 0; i <= itemsCount; i++)
- {
- ElementosRSS rssitem = new ElementosRSS();
- rssitem.RSSTitulo = Feed.Items.ToList()[i].Title.Text;
- rssitem.RSSEnlace = Feed.Items.ToList()[i].Links[0].Uri;
- //introducimos cada una de las propiedades en cada uno de los items de la colección de objetos
- }
- RSS.ItemsSource = itemsList;
- }
- }
El último paso es introducir una referencia a nuestro proyecto, para que este consiga leer el archivo xml, podemos introducir la referencia de dos formas:
1-introduciendo de forma manual la referencia
2-Situandonos sobre el elemento que demanda dicha librería y eligiendo la opción de añadirla que nos ofrece el Itelligence de Visual Studio 2010 como podemos observar en la siguiente imagen:
Ahora ya tenemos creado un simple lector de RSS, que nos muestra las diferentes entradas de mi blog. Presionando sobre ellas accederéis al artículo en concreto como podéis observar en la siguiente imagen:
Aunque sea un proyecto simple podemos ampliar sus posibilidades, mostrando un resumen de cada uno de los artículos o utilizando dicho proyecto para formar parte de un Webpar en SharePoint, así que la elección la dejo en vuestras manos.