Archive for the Blend Category

Tutorial Gráfico Silverlight: Consumiendo Servicios

Posted in Aplicaciones, ASP.NET, Blend, Microsoft, Silverlight, Tutorial, WPF on marzo 23, 2009 by César Intriago

 

En este tutorial veremos algunas cómo desarrollar un servicio sencillo y consumirlo desde una aplicación Silverlight 2, además usaremos el control DataGrid y el Popup control.

En el siguiente tutorial se mostrarán los pasos generales e importantes para crear un servicio WCF, crear una aplicación Silverlight 2 y consumir el servicio. Al final se provee un enlace al proyecto con el código fuente para que se lo descarguen y lo revisen a mayor detalle.

Requisitos:

  • Visual Studio 2008 SP1
  • Expression Blend 2
  • Silverlight Tools para Visual Studio 2008
  • Soliverlight Toolkit Marzo 2009

 

Paso 1: Crear un Servicio para Silverlight

Partiendo de una solución vacía, creamos un nuevo proyecto tipo ASP.NET Web Service, borramos el servicio que VS2008 crea de forma automática y agregamos un nuevo elemento tipo “Silverlight-enabled WCF Service” que llamaremos SimpleService.svc como se ve en la siguiente  figura:

Imagen 2

Esto creará la siguiente plantilla para escribir nuestro servicio:

Imagen 1

Nuestro leerá datos de un archivo XML y tendrá dos métodos, uno que retorne la lista completa de usuarios y otro que retorne un usuario en particular.

Al proyecto agregamos un nuevo archivo XML con los siguientes datos:

Imagen 3

Y luego creamos una nueva clase para representar cada usuario:

Imagen 4

Finalmente, escribimos el código complete del servicio:

Imagen 7

Ejecutamos el proyecto y se nos deberá presentar la siguiente pantalla indicando que nuestro servicio está levantado.

Imagen 5

 

Paso 2: Crear una nueva aplicación Silverlight

Agregamos un nuevo proyecto a la solución, de tipo “Silverlight Application” a la que llamaremos MySilverlightApp.

Imagen 8 

El asistente de VS2008 nos preguntará si deseamos crear una aplicación Web para hospedar y probar nuestra aplicación y presionamos OK:

Imagen 9

Hasta este punto nuestra solución se verá algo así:

Imagen 10

Usando Blend 2 o VS008 editamos el archivo Page.xaml para crear la interfaz gráfica de nuestra aplicación que estará formada por una caja de texto, dos botones y un Grid (Disponible en el Silverlight Toolkit Mazo 2009)

Imagen 12 

Desde VS2008 procedemos a enlazar los eventos Click de ambos botones al código en C#, esto se hace de forma sencilla desde VS2008:

Imagen 13

 

Paso 3: Consumir el Servicio

Lo siguiente será agregar una referencia al servicio y escribir el código para consultar los datos. Para agregar la referencia al servicio damos clic derecho sobre la solución y seleccionamos “Add Service Reference”, del cuadro de dialogo seleccionamos nuestro servicio y presionamos aceptar:

Imagen 6

Algo interesante es que en Silverlight todos los servicios son asincrónicos, de tal forma que en nuestro código tendremos que manejar los eventos de cuando se termine de ejecutar una operación, El código fuente de page.xaml.cs quedaría así:

Imagen 100 

Ejecutamos nuestra aplicación y se verá algo así:

Imagen 15

Pero al presionar el botón “Find All” recibiremos una EXCEPCION al tratar de conectar con el servicio Web:

Imagen 14

Esta se debe a un tema de seguridad de comunicación entre dominios, la forma de resolver esto es muy simple, se agrega un archivo XML en la raíz del servicio Web con las políticas de acceso para los clientes, el archivo se llama clientaccesspolicy.xml y tendrá el siguiente contenido:

Imagen 17

Volvemos a probar nuestra aplicación y listo:

Imagen 16

Hemos creado una aplicación en Silverlight que consume un servicio WCF y hemos configurado las políticas de acceso del cliente al servicio.

 

El proyecto completo lo pueden descargar desde aquí.

WPF: Catálogo de juegos para Xbox360

Posted in Aplicaciones, Blend, WPF on enero 5, 2009 by César Intriago

Investigando un poco sobre temas de WPF, en especial sobre el uso de Viewport encontré este enlace sobre un panel que permite hospedar elementos en 3D escrito por Josh Smith. Esta librería consiste de una clase personalizada derivada de "Panel" y de un Viewport; permite por ejemplo colocar los ítems de un Listbox en un ambiente 3D. Me puse a jugar con esta librería y terminé con esta pequeña aplicación que pueden descargar junto con el código, se trata de un catálogo de juegos para Xbox360 (los de PS3 pueden modificarlo a su gusto).

x360GameCatalogScreenshot 

Descarga + Código Fuente.

* La verdad no modifiqué el título de la ventana (Window1), el scrollbar y el botón, de todas formas son muy fáciles de personalizar 🙂 si desean hacerlo.

Esta librería me parece muy buena, y no es complicada de usar. Como podrán ver el poder de WPF es muy grande y las posibilidades de lo que se puede hacer con esta tecnología son muchas, así que manos a las obras y a empezar a usar WPF en el desarrollo de aplicaciones de negocio.

Chao.

Proyecto BlackPoint Liberado!

Posted in BlackPoint, Blend, WPF on noviembre 15, 2008 by César Intriago

Por fin luego de algún tiempo he publicado todo el proyecto BlackPoint (Código fuente), comento que no se trata de una aplicación lista para usuarios finales, está orientada a personas que deseen revisar un poco temas de patrones de diseño y Windows Presentation Foundation. Espero lo encuentren interesante, hay algunas cosas que faltaría de agregarle a la aplicación pero en el punto en el que se encuentra es bastante completa y ayuda a mostrar distintas técnicas con WPF.

Pueden descargar el proyecto completo desde aquí:

BlackPoint2008.zip

Usando Databinding y ValueConverter

Posted in BlackPoint, Blend, Tutorial, WPF on septiembre 14, 2008 by César Intriago

En una de las tareas en el desarrollo de BlackPoint relacionada con enlace de datos tuve que escribir un ValueConverter personalizado para analizar una cadena de texto y en función del contenido retornar si un control debería o no ser visible. En la práctica este es el escenario:

Tengo un textblock que va a mostrar el título de una diapositiva, este textblock está enlazado (databinding) a la propiedad Name de un objeto. El contexto de los datos es una lista de valores, de tal forma que cada vez que seleccione un ítem distinto, el texto se actualiza. Este es el código XAML normalmente usado para databinding (generado por Blend):

 

<TextBlock Text=”{Binding Path=Name, Mode=Default}”  DataContext=”{Binding Path=Parts, Mode=Default}” />

 

Revisando el atributo Text, podemos observar que está enlazado a la propiedad Name de un objeto llamada Parts, este objeto Parts es del tipo List<Parts>. En un ListBox tengo listados todos los Parts, de tal forma que al seleccionar uno, se actualiza automáticamente el texto del TextBlock. El problema con este código es que cuando un Part no tenga un nombre (es decir Name == “”) el comportamiento del binding hace que muestre el nombre último ítem seleccionado que sí tenía un nombre, la verdad no se por qué funciona de esta forma o cómo es el manejo de las cadena vacías en este caso. Este era un buen escenario para usar un ValueConverter.

Un ValueConverter permite transformar un valor a otro, antes de que se realice el binding con el control. Por ejemplo, puedo crear un ValueConverter y usarlo para analizar la propiedad Name, si es vacía que ponga otro texto y sea ese el que se muestre en el TextBlock.

Crear un ValueConverter es sencillo, simplemente creamos una clase que implemente la interfaz IValueConverter:

public class TextConverter : IValueConverter
    {
        const string DEFAULT_TEXT = “…”;
        #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value != null)
            {
                String text = value.ToString();

                if (!String.IsNullOrEmpty(text))
                    return text;
                return DEFAULT_TEXT;
            }

            return DEFAULT_TEXT;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            return value.ToString();
        }

        #endregion
    }

Como se ve en el código anterior, si la propiedad es nula o vacía,se devuelve la cadena “…”, caso contrario se devuelve la misma propiedad.

El binding para usar el TextConverter se puede realizar desde Blend, sin tener que escribir XAML, si desean hacerlo desde Blend sigan estos pasos:

  1. Seleccionen el TextBlock.
  2. Busquen la propiedad Text y seleccionen DataBinding
  3. En la parte inferior de la ventana de enlace de datos, seleccionen ValueConverter.
  4. De la ventana “Add Value Converter” seleccionen el TextConverter y presionen OK, Blend busca y presenta automáticamente las objetos del CLR que implementan la interfaz IValueConverter.

ValueConverter

De esa forma se realiza el databinding aplicando algún ValueConverter.

BONUS: Le dejo un captura de pantalla de BlackPoint:

BlackPoint08

Noticias BlackPoint

Posted in Aplicaciones, BlackPoint, Blend, WPF on agosto 27, 2008 by César Intriago

Luego de superar el problema de interoperabilidad con Microsoft PowerPoint 2007 logré avanzar con el proyecto, básicamente se debía a algún tipo de conflicto con Windows Vista, posiblemente el UAC o alguna otra “característica” de seguridad, luego de probar agregar un manifiesto para elevar los privilegios de la aplicación sin ningún resultado, finalmente regresé a XP y todo volvió a funcionar bien. Adjunto algunas capturas de pantallas del proceso de desarrollo de la aplicación, creo que va bastante interesante por el tema visual y por algunos patrones de diseño que se están siguiendo, en futuras entradas hablaré de ellas, por ahora les dejo las imágenes:

BlackPoint_Blend_MainWindow
Diseñando en Blend 2 la ventana principal.
BlackPoint_Blend_Layout01
Trabajando en la disposición de controles  de la ventana de propiedades.
BlackPoint_VS_ExtensionMethods
Código en VS2008, desarrollando los métodos de extensión.
BlackPoint_VS_Project
Organización de los proyectos en VS2008.

 

BlackPoint 2008 – Avanzado !!

Posted in Aplicaciones, BlackPoint, Blend, Errores, Patrones de Diseño, Tutorial, WPF on agosto 25, 2008 by César Intriago

Maldito Qumana!! acaba de borrar todo el contenido de esta entrada, textos, imágenes, enlaces, todo. DIABLOS, voy a tener que escribir todo el post nuevamente… y lo que ya no me acuerdo….. aarrggg…. PRRRT.

.Net Framework 3.5 SP1

Posted in Blend, WPF on agosto 16, 2008 by César Intriago

Microsoft liberó hace algunos días el primer Service Pack para .Net Framework 3.5, así como para Visual Sudio 2008. El “.Net Fx 3.5 SP1” incluye mejoras en el rendimiento de WPF lo cual es una buena noticia para todos, y también están trabajando en el primer DataGrid para el framework, este es un componente muy importante que estaba faltando en WPF, espero que pronto se incluyan mas controles “nativos” para que este excelente framework cada vez sea mas completo !!.

Otras características del .Net Framework 3.5 SP1 son según el sitio de Microsoft son:

  • Mejora de un 20% al 45% del desempeño de para aplicaciones en WPF, sin necesidad de modificar el código.
  • ADO.NET Entity Framework (Esto se ve interesante de probar)
  • Los efectos como Blur y Drop Shadow son ahora renderizados usando aceleración de hardware, y otros como soporte para texto, gráficos y medios.

Este es el enlace de donde pueden descargar el SP1:

http://msdn.microsoft.com/en-us/vstudio/products/cc533447.aspx