Silverlight 3 - Libros

Bueno aqui les traigo unos libros de Silverlight 3, espero que sean de ayuda =D

Una guia practica que toma temas desde silverlight 2 y net framework 3.5, para iniciarnos en el tema
Shannon Horn, "Microsoft Silverlight 3: A Beginner's Guide"

Pro Silverlight 3 in C#

Foundation Silverlight 3 Animation

Ejemplo de uso de PlaneProjection

Silverlight 3 nos trae como una de sus novedades, la propiedad PlaneProjection, esta propiedad se puede aplicar a cualquier control o objeto de Silverlight, esta propiedad es muy interesante ya que con unos simples parámetros nos permite crear libertad de movimiento en nuestras aplicaciones dando un toque dinámico y futurista, bueno comencemos a probar esta propiedad.

Mostrare un ejemplo del uso de PlaneProjection en conjunto con animaciones, aplicado a una interface de Login.
En el codigo XAML agregamos la propiedad Projection al elemento que deseamos, para el ejemplo aplicaremos esta propiedad a los Borders, dentro del tag Projection podemos ver las propiedad Rotation tanto para el eje X,Y,Z es similar a la propiedad Rotation dentro de un Render Transform, la diferencia radica en la forma como se aplica, en el caso de Planeprojection como lo indica su nombre es una proyección del objeto sobre un plano, al aplicar la proyección el objeto se acomodara dando una rotación con perspectiva 3D, además el control nos permite manipula propiedades de los ejes respecto al cual se realizara la rotación.

En el ejemplo creo agregue dos bordes los cuales serán las caras de nuestro formulario, la primera donde los logeamos y la segunda que nos da el saludo después de pasar el logeo, el saludo se vera cuando el formulario de la vuelta , imaginen ese efecto en vez de un simple gif de loading.

<Canvas>
<Border x:Name="border2" Background="Blue" Height="150" Width="250" CornerRadius="10" Canvas.Top="100" Canvas.Left="120" Canvas.ZIndex="1">
<Border.Projection>
<PlaneProjection RotationX="0" RotationY="0" RotationZ="0" x:Name="plan_rotacion2"/> </Border.Projection>
<StackPanel VerticalAlignment="Center">
<StackPanel.Projection>
<PlaneProjection RotationY="180"/>
</StackPanel.Projection>
<TextBlock VerticalAlignment="Center" Margin="2" HorizontalAlignment="Center">Gracias por Ingresar!!!</TextBlock>
<TextBlock VerticalAlignment="Center" Margin="2" HorizontalAlignment="Center" x:Name="blockNombre"></TextBlock>
</StackPanel>
</Border>
<Border x:Name="border1" Background="Blue" Height="150" Width="250" CornerRadius="10" Canvas.Top="100" Canvas.Left="120" Canvas.ZIndex="2">
<Border.Projection>
<PlaneProjection RotationX="0" RotationY="0" RotationZ="0" x:Name="plan_rotacion"/> </Border.Projection>
<StackPanel Orientation="Vertical" Margin="0,20,0,0" VerticalAlignment="Top" HorizontalAlignment="Center" > <StackPanel Orientation="Horizontal" VerticalAlignment="Top">
<TextBlock VerticalAlignment="Center" Margin="2" Width="60">Usuario:</TextBlock>
<TextBox Width="120" Margin="2" x:Name="txtUsuario"></TextBox>
</StackPanel> <StackPanel Orientation="Horizontal" VerticalAlignment="Top">
<TextBlock VerticalAlignment="Center" Margin="2" Width="60">Password:</TextBlock>
<TextBox Width="120" Margin="2"></TextBox>
</StackPanel>
<Button Click="Button_Click" Content="Aceptar" Width="100" Margin="40,10,0,0"></Button> </StackPanel>
</Border>
</Canvas>

Definimos las animaciones, para el ejemplo estoy empalmando animaciones, es decir al terminar una se inicia la otra para poder dar continuidad al efecto ya que en si son dos borders los que darán la impresión de un formulario de doble cara.

<Grid.Resources>
<Storyboard x:Name="animacion" Completed="animacion_Completed" >
<DoubleAnimation Storyboard.TargetName="plan_rotacion" Storyboard.TargetProperty="RotationY" From="0" To="90" Duration="0:0:1" />
</Storyboard>
<Storyboard x:Name="animacion2">
<DoubleAnimation Storyboard.TargetName="plan_rotacion2" Storyboard.TargetProperty="RotationY" From="0" To="90" Duration="0:0:1" />
</Storyboard>
<Storyboard x:Name="animacion11" >
<DoubleAnimation Storyboard.TargetName="plan_rotacion" Storyboard.TargetProperty="RotationY" From="90" To="180" Duration="0:0:1" />
</Storyboard>
<Storyboard x:Name="animacion22">
<DoubleAnimation Storyboard.TargetName="plan_rotacion2" Storyboard.TargetProperty="RotationY" From="90" To="180" Duration="0:0:1" />
</Storyboard>
</Grid.Resources>


Bueno ahora probemos el proyecto,
Ingresa cualquier nombre y en password pon “”mokona”

Silverlight 3 Lanzado

Amigos el 10 de julio salio a la luz la version oficial de silverlight 3, con nuevas mejoras y cambios con relacion al codigo que estamos acostumbrados a utilizar en algunos controles ya usados desde la version 2, hasta ahora he probado que al cargar le silverlight 3, levanta contenido hecho con silverlight 2, sin ningun problema, a diferencia de las versiones beta que salieron de la 2, hasta la version final con la que contabamos semanas antes, bueno les dejo unos links de la misma pag de silverligth...

Tool kit de Silverlight 3

Microsoft® Silverlight™ 3 Tools for Visual Studio 2008 SP1

MSDN Silverlight 3

Microsoft® Silverlight™ 3 SDK

Como asegurarte que tu aplicacion de silverlight2 funcionara con silverlight3

Nota: todos los link pertenecen a http://silverlight.net

Bibliografia Silverlight 2

Estos son algunos libros de Silverlight 2.0, algunos son muy básicos y otros si contiene algo de complejidad, hay para cada nivel de aprendizaje, disfruten los.

Descargar

Descargar

Descargar

Descargar

Hola Mundo WPF

Hoy explicare paso a paso como crear una aplicación simple como los famosos Hola Mundo, desarrollada con WPF usando C#, la aplicación será desarrollada en Visual Studio 2008 Sp1, bueno comencemos:

Creando el proyecto:
Entramos al VS2oo8 damos click en File> New>Proyect ,en la lista Project Types seleccionamos Visual C# y en la sección Templates seleccionamos WPF Application.



Nombrare el proyecto de ejemplo: WPFejemplo1

Creando la interface grafica XAML
Una vez creado el proyecto procederemos a crear la interface grafica, vamos a hacerlo interesante, la interface que crearemos será similar al estilo de aplicaciones sin la ventana de Windows Form clásicas, le agregaremos el botón X de cierre y le daremos la facultad de poder mover con el mouse la ventana.
Primero agregamos el contenedor principal, por defecto se agrega un Grid como contenedor

Agregando la propiedad de transparencia
En la ventana de propiedades le damos la propiedad de aceptar transparencia a la ventana de Windows y le cambiamos el Windows style a none, además agregamos al tag de Windows la propiedad Background = “Transparent”.

Agregando contenedores principales
Agregaremos un Border para agregar estilo a nuestra ventana ya que eliminaremos el marco que genera por defecto por eso le daremos 20 de Margin para generar una especie de marco, luego agregamos un StackPanel para que los objetos se agrupen en orden uno junto al otro.


Agregando los controles a usar
Para variar el clásico hola mundo del botón y el texto agregaremos un InkCanvas activamos el modo de edición con la propiedad EditingMode= “Ink”, es un control que permite dibujar como en paint dentro de este, además agregaremos un segundo Stack Panel y dentro de este agergaremos dos botones uno para limpiar el InkCanvas es decir limpiar la imagen y un segundo botón para cerrar la aplicación ya que como le quitamos la ventana de Windows carece del X para cerrar.


Eventos y Código C#
Ahora agregaremos los eventos de los botones y el respetivo código para cada botón, primero al borde que será el simulador de una ventana le agregamos la el evento MouseLeftButtonDown que por defecto nos genera la siguiente función al presionar enter "Window_MouseLeftButtonDown",
Entramos al codigo c# y agregamos a la función Window_MouseLeftButtonDown el siguiente código:
private void Window_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
this.DragMove();
}
Este código permite que al dejar presionado el mouse y arrastrar la ventana esta se mueva, ojo solo si presionas sobre los bordes del Border.
Luego agregamos los eventos Click="btnLimpiar_Click" y Click="btnCerrar_Click", cada botón según corresponda
Para el botón de Limpiar:
private void btnLimpiar_Click(object sender, RoutedEventArgs e)
{
inkCanvasBase.Strokes.Clear();
}

Para el botón de Cerrar:
private void btnCerrar_Click(object sender, RoutedEventArgs e)
{
this.Close();
}

Probando la aplicación
Lo probamos y listo tenemos una ventana tipo Windows vista que nos permite dibujar como en paint, con ese ejemplo simple podemos ver lo fácil que es crear aplicaciones de muy buen aspecto visual y utilizando los conocimientos que teníamos al usar Silverlight 2.0

Espero que este pequeño tutorial sea de utilidad para alguno que se aventure al mundo del WPF, saludos

Tutoriales Silverlight 2

Estos tutoriales son promocionados por www.silverlight.net, son muy buenos y están muy bien explicados, nos ayudan a realizar el objetivo de cada uno explicando cada punto paso a paso, con imagenes , se los recomiendo.

Tutorial 1: Controls
Tutorial 2: Data-binding
Tutorial 3: Accessing Data from a SQL Database
Tutorial 4: User Controls
Tutorial 5: Expression Blend for Developers
Tutorial 6: Styles, Templates and Visual State Manager
Tutorial 7: DataBinding & DataTemplates Using Expression Blend
Tutorial 8: Multi-page Applications
Tutorial 9: ADO.NET DataEntities and WCF Feeding a Silverlight DataGrid

Ejemplo de Banner con Silverlight

Un ejemplo de banner en silverlight 2 para el ranking de una pag amiga(visiten la ... encontraran buena musica)

Silverlight 3 beta 1

El 18 de Marzo de este año se dio a conocer en el MIX09 la primera versión de Silverlight 3, esta versión de prueba muestras un enfoque en el mundo 3D ya que nos permite agregar movimiento en 3D a contenedores conocidos como un Canvas o Borders, además esta versión nos llega con mas de 50 nuevos controles, que se pueden probar instalando el Silverlight 3 Beta Tools for Visual Studio para visual studio 2008 SP1, también se encuentra disponible la documentación online , una mejora muy importante en esta versión es la posibilidad de importar diseños de Adobe Photoshop y Adobe Illustrator, que actualmente son los editores graficos mas usados.

Video de las novedades que trae Silverlight 3

Interfaces Futuristas

Navegando por internet encontré la revista electronica http://www.smashingmagazine.com/ que nos muestra un top de 10 interfaces de usuarios futuristas, que pena que no figure una desarrollada en silverlight, pero me pareció interesante comentarla porque nos puede dar ideas geniales para desarrollar en silverlight, por ejemplo la interface Aurora una especie de navegador fusionado con el msn, que a la vez permite a dos usuarios manipular las paginas en tiempo real, al ver esta interface encontré varios efectos que son posibles en silverlight y wpf, por ejemplo el efecto donde los resultados de la búsqueda web se nos muestran repartidos en el espacio.

Bueno a crear que nada es imposible quien sabe que tipo de interfaces nos depara el futuro.