Liberado Silverlight 5..
Esta tarde empecé a leer en blog esta gran noticia Silverlight 5 ya ha sido liberado y es hora de empezar a usar esta excelente herramienta que si es genial con la versión 4 se pueden imaginar la versión 5…

Luego de las grandes demostraciones que se dieron hace un tiempo sobre el soporte a 3d, existe una infinidad de mejoras que podemos muy bien aprovechar,, acá alguna imágenes de lo que es posible hacer con silverlight 5.



Estas son excelentes Noticias y excelentes oportunidad de desarrollar la gran capacidad de estas herramientas de desarrollo y diseño.
Acá les dejo un tour rápido para iniciar cuanto antes:
Silverlight Tour Rápido
Pete Brown introduce los conceptos y las herramientas necesarias para empezar con Silverlight desarrollo en sus dos formas principales: en el navegador y fuera del navegador. El vídeo en la web presenta los conceptos básicos, el vídeo fuera del navegador se expande a los de crear un cliente de Twitter simple.
- Silverlight 5 Release general
- Introducción a Silverlight (Web)
- Introducción a Silverlight de escritorio (fuera del navegador)
Esto es parte de lo que hay de nuevo en Silverlight 5
-
Silverlight 5 Release general
08 de diciembre 2011 | Nivel 200: Novice
En este vídeo, Pete ofrece un resumen de las características nuevas y actualizadas en el lanzamiento de Silverlight 5.
-
Introducción a Silverlight 5 3D
08 de diciembre 2011 | Nivel 200: Novice
En este vídeo, Pete proporciona los fundamentos de 3D en Silverlight, que muestra cómo crear un proyecto utilizando la plantilla en 3D incluido con el kit de herramientas de Silverlight 5. Con el fin de utilizar las plantillas, en additi …
-
OpenType de texto en Silverlight 5
08 de diciembre 2011 | Nivel 200: Novice
Silverlight 5 proporciona un excelente soporte para la representación de las fuentes OpenType. A partir de esta versión, puede utilizar las funciones avanzadas de tipo abierto como las ligaduras, conjuntos estilísticos y contextuales alternativos …
-
Silverlight 5 nativos de Windows
12 de abril 2011 | Nivel 200: Novice
Silverlight 5 de confianza fuera del navegador aplicaciones ahora pueden crear ventanas nativas del sistema operativo. En este vídeo, Pete Brown nos muestra cómo crear ventanas nativas, así como la forma de personalizar la Comisión de Derechos Humanos …
-
Silverlight 5 de baja latencia de efectos de sonido
12 de abril 2011 | Nivel 200: Novice
MediaElement es poderosa, pero no se adapta bien a la baja latencia o tiempo real, efectos de sonido. Pete Brown nos muestra cómo utilizar el nuevo SoundEffect y clases SoundEffectInstance de los bits de XNA inc …
-
Silverlight 5 de texto de varias columnas y Vinculados
12 de abril 2011 | Nivel 200: Novice
Pete Brown nos muestra cómo utilizar el RichTextBoxOverflow para permitir que el texto fluya en columnas o un diseño de forma libre. Post en tu blog relacionados: http://10rem.net/blog/2011/04/13/silverlight-5-advancements-in-text
-
Silverlight 5 Haga clic en los botones del ratón dobles y múltiples
12 de abril 2011 | Nivel 200: Novice
Silverlight 5 ahora nos permite la captura de doble clic, o incluso un número arbitrario de clics. Pete Brown nos muestra cómo utilizar la propiedad ClickCount nuevo para los eventos del ratón.
Fuente: http://www.silverlight.net/learn
- DESCARGA SILVERLIGHT 5 YA:
Personalizar pantalla de Carga de Silverlight
Hola amigos ahora les traigo un interesante articulo, donde podrán personalizar la pantalla de carga de Silverlight a una que les parezca mas agradable para ustedes.. Esta es la que vemos típicamente..

Obviamente para poder crear una pagina personalizada de carga no se realiza dentro de la aplicación Silverlight que estamos construyendo ya que al aparecer esta pantalla el XAP que genera Silverlight apenas se esta descargando para mostrar la aplicación.
Pero si se puede hacer desde el proyecto Web que esta asociado a nuestro Sitio
PASO 1
lo primero que debemos haces es cambiar la aplicación a que deje de correr en la pagina ASPX sino en la HTML que están en el proyecto web… para ellos vamos a las propiedades de el proyecto web que esta asociado a Silverlight, puedes darle click derecho propiedades o en el menú proyecto de Visual Studio.
En las propiedades se va a la pestaña web y en la opción pagina especifica en el botón reflejado con el color azul puedes buscar la pagina HTML que tiene el nombre que tú el colocaste al proyecto al crear mas la palabra TESTPAGE.
PASO 2.
Siguiendo en el proyecto Web vas a agregar un nuevo elemento de Tipo Silverlight y Buscas una que se llama Pagina JScript de Silverloght, esta es la que agregaras con el nombre que desees en mi caso le coloque CargaJavierLeal y Este te agregara un Archivo XAML, Y un archivo js ambos debemos modificarlos, haremos una pagina de carga sencilla, te recomiendo que termines el DEMO y luego personalicen tu pagina de carga como desees.
Puedes ver en las imágenes para que te guíes con mas facilidad.
PASO 3.
Se van al HTML y agregaran las siguiente lineas
justo después del Head agrega la invocación al archivo js que acabas de agregar.
<script type="text/javascript" src="CargaJavierLeal.js"></script>
<param name="splashscreensource" value="CargaJavierLeal.xaml"/> <param name="onSourceDownloadProgressChanged" value="onSourceDownloadProgressChanged" />
PASO 4
luego de agregar estos parámetros te vas al archivo js y eliminaras todo lo que este en ese archivo, Se le agregara solo una función que controlara la carga del sitio, y es el siguiente código:
function onSourceDownloadProgressChanged(sender, eventArgs) { sender.findName("uxStatus").Text = "Loading: " + Math.round((eventArgs.progress * 1000)) / 10 + "%"; sender.findName("uxProgressBar").ScaleY = eventArgs.progress * 356; }
PASO 5
Vamos Al XAML y personaliza tu sitio puedes empezar con este que te estoy colocando aca y luego vas modificando poco a poco, puedes sustituir el código xaml de la pagina que creaste por esto.
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="parentCanvas" Width="1024" Height="768"> <Canvas.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="White" Offset="0" /> <GradientStop Color="#FFBE46BE" Offset="1" /> <GradientStop Color="White" Offset="0.238" /> </LinearGradientBrush> </Canvas.Background> <Canvas HorizontalAlignment="Center" VerticalAlignment="Center" Canvas.Top="365" Canvas.Left="332" Width="357" Height="31.379"> <Rectangle Width="27.545" Height="1" x:Name="uxProgress" Canvas.Top="29.545" Canvas.Left="1.4"> <Rectangle.RenderTransform> <TransformGroup> <ScaleTransform x:Name="uxProgressBar" ScaleX="1" ScaleY="0"/> <SkewTransform AngleX="0" AngleY="0"/> <RotateTransform Angle="270"/> <TranslateTransform X="0" Y="0"/> </TransformGroup> </Rectangle.RenderTransform> <Rectangle.Fill> <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5"> <GradientStop Color="#FFFFFFFF" Offset="1"/> <GradientStop Color="#FFFFFFFF" Offset="0"/> <GradientStop Color="#FF2975D0" Offset="0.28"/> <GradientStop Color="#FF2975D0" Offset="0.72"/> </LinearGradientBrush> </Rectangle.Fill> </Rectangle> <Path Width="356.85" Height="1" Fill="#FF80009A" Stretch="Fill" Stroke="#FFFFFFFF" Canvas.Top="0" Data="M0,170.5 L356.84209,170.5" Opacity="0.35"/> <Path Width="1.662" Height="29.03" Fill="#FF80009A" Stretch="Fill" Stroke="#FFFFFFFF" Canvas.Top="0.48" Canvas.Left="0.2" Data="M360,168 L360,0" Opacity="0.35" /> <Path Width="357.84" Height="1" Fill="#FF80009A" Stretch="Fill" Stroke="#FFFFFFFF" Canvas.Top="29" Data="M0,170.5 L356.84209,170.5" Opacity="0.35"/> <Path Width="358.85" Height="1" Fill="#FF80009A" Stretch="Fill" Stroke="#FF2975D0" Canvas.Top="30" Data="M0,170.5 L356.84209,170.5" Opacity="0.25"/> <Path Width="1.662" Height="30" Fill="#FF80009A" Stretch="Fill" Stroke="#FF2975D0" Canvas.Left="356.01" Data="M360,168 L360,0" Opacity="0.35" Canvas.Top="-0.498"/> <Path Width="1" Height="31" Fill="#FF80009A" Stretch="Fill" Stroke="#FF2975D0" Canvas.Left="357.333" Data="M360,168 L360,0" Opacity="0.245" Canvas.Top="-0.498" /> </Canvas> <TextBlock x:Name="uxStatus" Height="66" Canvas.Left="332" Text="Cargando..." TextWrapping="Wrap" Canvas.Top="402" Width="356" FontSize="48" TextAlignment="Center" Foreground="#FF80009A" FontWeight="Normal" FontStyle="Normal" FontFamily="Verdana" /> </Canvas>
PASO 6
No se si esto es obligatorio o fue por que yo borre unas referencias pero cuando compile me faltaban unas dll, por si les pasa los mismo solo agreguen las siguientes DLL.
Ahora solo queda ejecutarlo para probarlo espero que sea de provecho para tus proyectos ![]()
Uso de la Interfaz INotifyPropertyChanged y Compreder el uso de ViewModels – Silverlight

Hola amigos Internautas amantes de las tecnologías, En Silverlight una de las interfaces mas usadas es la INotifyPropertyChanged la cual se encarga de validar si una propiedad de la clase ViewModel de una pagina de Silverlight ha cambiado de valor y por lo tanto cuando esta cambia de valor esta se mostrara de manera automática a la Propiedad que le pases en Binding con el nombre de esa propiedad que puede ser del tipo que quieras un Bool, string, una colección de datos entre otras.
- Para comenzar en visual Studio 2010 vamos a crear un nuevo proyecto de Silverlight (Creo que ya esto lo sabemos hacer desde hace tiempo)
-Creamos una nueva Carpeta llamada ViewModels y dentro crearemos una nueva clase llamada PrincipalVM la cual tendrá implementada la interfaz ante descrita y crearemos un método Publico llamado OnPropertyChanged con un parámetro de tipo string este método es el que disparara el evento de cambio según la propiedad que se le haya colocado como parámetro que será descrito en un simple dato de tipo String escrito tal cual. Ejemplo del código de la clase:
//HACER LA REFERENCIA A LA SIGUIENTE CLASE
using System.ComponentModel;
namespace DemoINotifyPropertyChanged.ViewModels
{
//IMPLEMENTAR LA INTERFAZ A LA CLASE
public class PrincipalVM : INotifyPropertyChanged
{
//CREAR VARIABLE DE TIPO EVENTO LA CUAL REPRESENTA EL EVENTO DE PROPIEDAD CAMBIANA
public event PropertyChangedEventHandler PropertyChanged;
//METODO QUE RECIBE UNA PARAMETRO DE TIPO STRING
public void OnPropertyChanged(string name)
{
//INICIALIZAR EL EVENTO DE PROPIEDAD CAMBIADA
PropertyChangedEventHandler handler = PropertyChanged;
//VERIFICAR SI EL EVENTO ES DIFERENTE DE NULO ES DECIR SI NO SE INICIALIZO EL EVENTO
if (handler != null)
{
//SI ES DIFERENTE DE NULO DISPARA EL EVENTO CON EL NOMBRE DE LA PROPIEDAD QUE SERA EL PARAMETRO STRING DEL METODO
handler(this, new PropertyChangedEventArgs(name));
}
}
}
}
namespace DemoINotifyPropertyChanged.ViewModels
{
public class HomeViewModel : PrincipalVM
{
private string _texto;
public string texto
{ get
{ return _texto;
} set
{ _texto = value;
OnPropertyChanged("texto");
}
}
private string _textoValor;
public string textoValor
{ get
{ return _textoValor;
} set
{ _textoValor = value;
OnPropertyChanged("textoValor");
}
}
private Boolean _esActivo;
public Boolean
esActivo
{ get
{ return _esActivo;
} set
{ _esActivo = value;
OnPropertyChanged("esActivo");
}
}
}
}
Mostrare el primer método por código C shard:
//REFERENCIA AL NAMESPACE DONDE ESTAN TODOS LOS VIENMODELS
using DemoINotifyPropertyChanged.ViewModels;
namespace DemoINotifyPropertyChanged
{
public partial class Home: Page
{ //VARIABLE DE TIPO CLASE DEL VIEMMODEL CORRESPONDIENTE A ESTA PAGINA
HomeViewModel Models;
public MainPage()
{ InitializeComponent();
//Inicializa la clase ViemModel de la vista
Models = new HomeViewModel();
//Asignar el DataConext a esta pagina
this.DataContext = Models;
}
}
}
Mostrare el Método desde Expression Blend y Mostrar como Quedaría el XAML
Código XAML Estableciendo el Conext de la pagina:
Como estoy usando una plantilla de Silverlight este XAML ya tiene unas cosas estructuradas de diseño
Esto permitirá ya hacer algunos Binding a mi pagina que apunten a las propiedades del ViewModel Asignado como contexto,
Como ejemplo en Pantalla se colocara 1 TextBox, 2 TextBlog y 1 CheckBox
La demostracion sera Asiganle el Bindin de la propiedad Texto a un textBlog y al Textbox con la diferencia que el Textbox tendra el Bindin en Mode Toway ASI el vamor cambiado sera tomado por la propiedad al momento de tabular o salir del TextBox estas trabajaran con la propiedad Text, para el CheckBox trabajaremos asignandole el Binding a la propiedad IsChecked que es un Booleano por lo tanto se le asignara la propiedad booleana esactivo y haremos cambiar el textovalor para que el textbock faltante nos indique si ha cambiado un ejemplo sencillo peor que muestra como usar la interfaz, las propiedades segun sus diferentes tipos de datos y los Binding:
- ASIGNACION MANUAL DE EL Binding al primer TextBox que recibe Texto y cambiara con twoway.
Ahora explicaremos como asociar la propiedad por Expression Blend para ellos requere que el Contexto de la pagina sea asociado antes directo desde Blend lo tienes asociado en codigo y por XAML no hay ningun problema.
Presionas sobre el pequeño punto al lado de la propiedad que deseas Bindiar.
Eliges la opción Enlace a datos:
Si tienes bien asignado el conexto veras todas las propiedades que estan en el viewModel que estas asociando elijes la que deseas y presionas Aceptar, puedes ver que resalte algo de azul en estas opciones puedes ver como asignarte el TwoWay y otras opciones aparecera siempre que se puede en el caso de un Texblock no esta permitido ya que no puede editar texto en un Texblock.
Como puedes ver en todos los controlas y en todas sus propiedades puedes hacer esto solo debes estar seguro que la propiedad es del tipo correspondiente al que exije la propiedad.. Si lo haces directo desde Blend este te indica cuales propiedades puedes casar a una propiedad de una control en este caso es un booleano y solo te dejara asociar un Booleano.
Al otro Texblock le asignaremos texto Valor y modificaremos el set y get del esactivo para determinar si ha cambiado o no.
el cambio seria el siguiente en la propiedad esActivo:
private Boolean _esActivo = true;
public Boolean esActivo
{
get
{ return _esActivo;
}
set
{ _esActivo = value;
if (value == true)
{
textoValor = "Es true";
} else
{
textoValor = "Es False";
} OnPropertyChanged("esActivo");
}
}
Hay que tomar en cuenta que a cualquier propiedad que tu deseas tu le puedes aplicar un Binding lo que debes cuidar es que siempre la propiedad que se le este pasando concuerden los datos puede ser una colección de datos que llene un GrigView o Un combo y si usas una entidad de datos puedes personalizar el template para decidir que datos de la colección mostrar.
Resultado sencillo:
Pronto les coloco el código espero que les guste
Programar Cámara de Windows Phone 7.1
Hola amigos hoy les traigo un poco de programación en Windows Phone 7.1 donde se vera lo facil que es trabajar con estas tecnologías de ultima generación, Comenzamos creando un nuevo proyecto de Windows Phone 7.1 lo pual puedes crearlo desde Blend o desde Visual Studio, es indiferente donde lo hagas igual el mismo proyecto puede ser pasado de un lado a otro.
Una vez creado el nuevo proyecto le colocaremos su titulo y haremos un diseño segun tu lo desees. la aplicacion solo iniciara la cámara y capturara una imagen en la pantalla del teléfono y a pesar que emula la cámara en el dispositivo funcionara perfectamente.
Lo que hice acá fue colocarle un titulo y Subtitulo, Le coloque un degradado de fondo para que se viera mas agradable, Un objeto Imagen al que se le establece la propiedad x:Name=”Imagen” para que a nivel de programación llamarlo con ese nombre, un botón que permitirá iniciar la cámara Web del teléfono, al tomar una fotografía se mostrara en el objeto imagen agregado.
Ya todo lo que haremos será Código por lo tanto pasaremos el proyecto s Visual Studio 2010, como puedes observar yo utilizo las herramientas para lo que son Expression Blend para diseño y Visual Studio para el código de lógica, pero podrías hacerlo sin problema hacer código desde Blend pero no tendría la ayuda que te da visual Studio para mantener un buen código, así como puedes hacer un diseño desde Visual Studio pero no tendrías la versatilidad que existe en Blend para hacer animaciones y Excelente diseños.
Código XAML del diseño:
<phone:PhoneApplicationPage xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800" x:Class="DemoCamaraWP.MainPage" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="PortraitOrLandscape" Orientation="Portrait" shell:SystemTray.IsVisible="True" UseLayoutRounding="True"> <!--LayoutRoot es la cuadrícula raíz donde se coloca todo el contenido de la página--> <Grid x:Name="LayoutRoot" Background="Transparent"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!--TitlePanel contiene el nombre de la aplicación y el título de la página--> <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> <TextBlock x:Name="ApplicationTitle" Text="Demo Ing. Javier Leal" Style="{StaticResource PhoneTextNormalStyle}"/> <TextBlock x:Name="PageTitle" Text="Cámara WP" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> </StackPanel> <!--ContentPanel: coloque aquí el contenido adicional--> <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <Grid.RowDefinitions> <RowDefinition Height="0.799*"/> <RowDefinition Height="0.201*"/> </Grid.RowDefinitions> <Grid.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FF1000FF" Offset="1"/> <GradientStop Color="Black"/> <GradientStop Color="Black" Offset="0.22"/> <GradientStop Color="#FF1D195E" Offset="0.704"/> </LinearGradientBrush> </Grid.Background> <Image x:Name="Imagen" Margin="5,5,5,5"/> <Button Click="cmdCamara_Click" x:Name="cmdCamara" Content="Iniciar Camara" Margin="50,20,50,20" Grid.Row="1"/> </Grid> </Grid> </phone:PhoneApplicationPage>
Una vez ya tengas el diseño, Presionas Click derecho sobre el proyecto y seleccionas editar en Visual Studio.
Lo primero que haremos es declarar una variable de tipo CameraCaptureTask inicializando la instancia de la clase esto lo haremos de manera global para poder usar esta variable de clase en todo la clase de la pantalla actual.
Con este código inicializamos la clase CameraCaptureTask y para inicialízalo programaremos el botón Iniciar Cámara con el Método Show de la clase de la siguiente manera:
Microsoft.Phone.Tasks.CameraCaptureTask CamaraWP = new Microsoft.Phone.Tasks.CameraCaptureTask();
private void cmdCamara_Click(object sender, RoutedEventArgs e) { CamaraWP.Show(); }
Para capturar la imagen se debe llamar al método Complete de la clase CameraCaptureTask que este es el método que se ejecuta al tomar una fotografía y donde se capturara la imagen para ello llamamos al método Complete colocando += de esta manera tendremos el método que se ejecuta ese evento .
El el nuevo método ejecutamos en siguiente código.
void CamaraWP_Completed(object sender, Microsoft.Phone.Tasks.PhotoResult e) { BitmapImage bmp = new BitmapImage(); bmp.SetSource(e.ChosenPhoto); Imagen.Source = bmp; }
para Usar la clase BitmapImage debes hacer una importación a using System.Windows.Media.Imaging; esta clase la declaramos en una variable llamada bmp y la inicializamos con el constructor new, luego le asignamos el Sourse de esa BitmapImagen a la foto que viene como resultado en el evento en la propiedad ChosePhoto, luego al Sourse de el objeto imagen se le asigna ese BitmapImage.
Código completo:
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.Windows.Media.Imaging;
namespace DemoCamaraWP
{
public partial class MainPage : PhoneApplicationPage
{
Microsoft.Phone.Tasks.CameraCaptureTask CamaraWP = new Microsoft.Phone.Tasks.CameraCaptureTask();
public MainPage()
{
InitializeComponent();
CamaraWP.Completed += new EventHandler<Microsoft.Phone.Tasks.PhotoResult>(CamaraWP_Completed);
}
void CamaraWP_Completed(object sender, Microsoft.Phone.Tasks.PhotoResult e)
{
BitmapImage bmp = new BitmapImage();
bmp.SetSource(e.ChosenPhoto);
Imagen.Source = bmp;
}
private void cmdCamara_Click(object sender, RoutedEventArgs e)
{
CamaraWP.Show();
}
}
}
Una vez que esta listo el código podemos compilar y probar nuestra aplicación.
Al presionar sobre Iniciar Cámara iniciara valga la redundancia la cámara del dispositivo, como se trata de un emulador no se vera una imagen sino un recuadro en blanco y negro moviéndose.

Como puedes observar la cámara del emulador va titilando y mostrando un recuadro en blanco y negro en un dispositivo real se vería la imagen si funciona en el emulador en el dispositivo funcionara perfectamente. Podemos tomar una foto con el botón de arriba. y la aplicación te captura esa foto pero antes te muestra un recuadro indicando si quieres aceptar esa foto o repetir para tomar otra foto al darle aceptar muestra la foto.
Existe una propiedad en Expression Blend que pueden utilizar para mantener la aplicacion asi se voltee el teléfono en otra posición de esta forma mantienen la aplicación en cualquier posición que es esta:
la puedes visualizar seleccionando la pantalla o por código lo puedes ver subrayado y de color azul este código lo debes colocar en la propiedades de la phoneApplicationPage esto permitirá dar una gran flexibilidad a las aplicaciones desarrolladas ya que se adaptaran a la posición en que el usuario tenga el teléfono detallen el siguiente código y como se coloca la propiedad SopportedOrientatiions:
<phone:PhoneApplicationPage xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800" x:Class="DemoCamaraWP.MainPage" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="PortraitOrLandscape"
Orientation="Portrait" shell:SystemTray.IsVisible="True" UseLayoutRounding="True">
ahora esta se adapta a la forma el que tengas el teléfono:
Esto es todo espero que le guste ![]()
Acceso a la Cámara Web desde Aplicación en Silverlight 4
Hola amigos ahora les traigo un tema técnico bien interesante, en las aplicaciones de Silverlight puedes fácilmente tener acceso a dispositivos de audio y video del equipo mediante un permiso que el mismo emite al usuario al momento de acceder..
Para Iniciar creamos un nuevo proyecto de Silverlight en mi caso lo hago desde Blend, además de tomar en cuenta que lo haremos usando C Shard como lenguaje de programación.
Luego de Crear el proyecto crea tu interfaz personalizada a tu gusto en mi caso le coloque un titulo y un TextBox por los momentos, este combo llevara por nombre: Cbox_Dispositivos.![]()
Ya que se trata de una entidad a la cual vamos a acceder puedes colocar el nombre exacto del dispositivo editando el Template del ComboBox este seria el código XAML:
<ComboBox x:Name="Cbox_Dispositivos">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding FriendlyName}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
Luego de esto nos vamos a visual Studio para llenar esa lista de los dispositivos. y como estamos trabajando con la cámara web debemos llenar el ItemSourse de el combo Box con el método GetAvailableVideoCaptureDevices de la clase CaptureDeviceConfiguration ;
using System;
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 DemoMedia
{
public partial class MainPage : UserControl
{
public MainPage()
{
// Necesario para inicializar variables
InitializeComponent();
//Llenar el Combo de los dispositivos necesarios
Cbox_Dispositivos.ItemsSource = CaptureDeviceConfiguration.GetAvailableVideoCaptureDevices();
}
}
}
De nuevo en Expression Blend y para terminar la parte de diseño agregaras a la pantalla dos Objetos Rectangule uno para mostrar el video y otro para captura de una foto desde la cámara el primero se llamara camVideo y el segundo camCaptura, además de ello agregaras tres botones Iniciar Captura, Parar Captura y Capturar Foto.
Código XAML del diseño:
<UserControl
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"
x:Class="DemoMedia.MainPage">
<Grid x:Name="LayoutRoot" Height="768" Width="1024">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="350"/>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="90"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="450"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
<GradientStop Color="#FF1527BC" Offset="0.48"/>
<GradientStop Color="#FF0B1241" Offset="0.83"/>
</LinearGradientBrush>
</Grid.Background>
<TextBlock Foreground="White" FontSize="22" FontWeight="Bold" TextAlignment="Center" FontFamily="Jing Jing" Grid.ColumnSpan="3"><Run Text="CAMARA WEB EN SILVERLIGHT"/><LineBreak/><Run Text="Por. Ing. Javier Leal"/></TextBlock>
<ComboBox x:Name="Cbox_Dispositivos" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2">
<ComboBox.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding FriendlyName}" /> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox>
<TextBlock Grid.Row="2" Text="Lista de Dispositivos:" Foreground="White" FontSize="21.333" /> <Rectangle x:Name="camVideo" Grid.Row="3" Grid.ColumnSpan="2" Height="408" Stroke="Black" Width="480" Fill="Black" RadiusY="25" RadiusX="25" /> <Rectangle x:Name="camCaptura" Stroke="Black" Width="487" Height="400" Grid.Column="2" Grid.Row="3" Fill="Blue" RadiusY="25" RadiusX="25" /> <Button Click="cmdIniCaptura_Click" Height="50" Content="Iniciar Captura" x:Name="cmdIniCaptura" Grid.Row="4" FontWeight="Bold" FontSize="20" Margin="18,59,90,59" /> <Button Click="cmdStopCaptura_Click" Height="50" Content="Parar Captura" x:Name="cmdStopCaptura" Grid.Row="4" Grid.Column="1" FontWeight="Bold" FontSize="20" Margin="-62,59,18,59" /> <Button Click="cmdFotoCaptura_Click" Height="50" Content="Captura Foto" x:Name="cmdFotoCaptura" Grid.Row="4" Grid.Column="2" FontWeight="Bold" FontSize="20" Margin="20,59,19,59" /> </Grid>
</UserControl>
Ahora A agregarle funcionalidad a los botones desde visual Studio antes de darle funcionalidad a cada botón de debe indicar que el objeto rectangule es quien recibirá la captura de la cámara web y cabe destacar que puede ser otro objeto como un botón que tenga su método Fill.
Y se crea una variable global del objeto CaptureSourse para ser usado en toda la clase y la clase Image Brush que usaremos mas adelante:
CaptureSource capture = new CaptureSource();
//clase captura Sourse a nivel global para ser usada en toda la clase
ImageBrush capturedFoto = new ImageBrush();
// Se crea una ImageBrush para capturar la imagen.
Justo debajo del código que llega el Combo de dispositivos se agrega el código que que captura el dispositivo por defecto del equipo con la clase VideoCaptureDevice, y se le asigna al CaptureSourse, luego se instancia la clase VideoBrush que se le agrega como sourse el CaptureSourse que ya tiene asignado el dispositivo, con este el pintara el video que para mostrarlo en pantalla se le agrega ese VideoBrush al metodo Fill del rectángulo, para capturar la foto se instancia la clase ImageBrush que ya se hizo arriba de manera Globaly luego se le agrega el método fill del rectángulo que va a mostrar la foto capturada.
public MainPage()
{
InitializeComponent();
Cbox_Dispositivos.ItemsSource = CaptureDeviceConfiguration.GetAvailableVideoCaptureDevices();
//Llenar el Combo de los dispositivos necesarios
VideoCaptureDevice VideoDevice = CaptureDeviceConfiguration.GetDefaultVideoCaptureDevice();
//Se captura el dispositivo de video por defecto del equipo
capture.VideoCaptureDevice = VideoDevice; // Se indica a la clase capture Souse el dispositivo que usara
VideoBrush BrochaVideo = new VideoBrush(); // Clase Brocha que pintara el video en un objeto
BrochaVideo.SetSource(capture); // VideoBrush tiene como sourse la clase Capture Sourse que ya tiene asignado un dispositivo
camVideo.Fill = BrochaVideo; // la brocha pinta en el video en el metodo Fill del rectangulo camVideo
camCaptura.Fill = capturedFoto; // Pinta en el rectangulo la imagen capturada.
}
El código se vería de la siguiente manera en visual Studio
Si compilan la aplicación verán que no aun no funciona nada solo el combo de dispositivos esta lleno. por lo que esto significa que se debe agregar la funciones a los botones para poder iniciar una captura.
BOTON INICIAR CAPTURA
El botón de captura usara la variable global CaptureSourse para llamar al metodo Star no sin antes verificar que el dispositivo elegido es valido y se inicia sin ningún problema el código del método click es el siguiente
private void cmdIniCaptura_Click(object sender, RoutedEventArgs e)
{
// verificar si se puede acceder al dispositivo y el VideoCaptureDevice es nulo.
if (CaptureDeviceConfiguration.RequestDeviceAccess() && capture.VideoCaptureDevice != null)
{
try
{
//Comenzar Captura
capture.Start();
}
catch (InvalidOperationException ex)
{
// Notificar que hay un arror.
MessageBox.Show("No se ha Iniciado la Captura");
}
}
}
Como pueden observar se utiliza un Try Catch para verificar si la operación es correcta.
BOTON PARAR CAPTURA
private void cmdStopCaptura_Click(object sender, RoutedEventArgs e)
{
// Verificar si el VideoCaptureDevice es nulo.
if (capture.VideoCaptureDevice != null)
{
capture.Stop();
}
}
Ambos códigos de los primeros dos botones como pueden ver son sencillos ya lo pueden Compilar y funcionara perfecto pero aun falta la captura de la imagen.
BOTON CAPTURAR FOTO
private void cmdFotoCaptura_Click(object sender, RoutedEventArgs e)
{
// Verifica si VideoCaptureDevice es nullo y si el dispositivo se ha iniciado.
if (capture.VideoCaptureDevice != null && capture.State == CaptureState.Started)
{
capture.CaptureImageAsync();
}
}
Como pueden observar este también verifica si el VIdeoCaptureDevice es diferente de nulo y el estado actual de la cámara que debería ser Iniciado,, otra cosa es que pueden ver que se utiliza el método CaptureImagenAync(), se trata se una método asíncrono que requiere de un Complete para recibir los resultados de la captura de manera asíncrona así la aplicación no tendrá ningún retardo.
Se llamara al evento CaptureImageCompleted de la clase CaptureSourse pero como podemos capturar un evento de este modo estamos acostumbrados a que visual Studio cree los eventos al darle doble click pero podemos usar expresiones lambda muy utilizado hoy en día para capturar eventos y delegados de las clases,
Para hacerlo Utilizamos la clase CaptureSouse en mi caso declare una variable llamada Capture y le instancie el CaptureSourse de tal manera que seria Capture.CaptureImageComplete += Se coloca luego del evento el símbolo + y luego el = y el Itellisense te ayudara a crear el evento correspondiente presionado tabulador varias veces como ven acá este código se colocara al final del método MainPage:
Esto luego de presiona tabulador agrega un nuevo evento en la clase actual:
Igualmente se hará con el evento CaptureFailed para detectar cualquier error en la captura de la foto quedando el código del siguiente modo.
A cada método se agrego lo siguiente:
throw new NotImplementedException();
Donde en el caso de el Complete aquí es donde utilizaremos el ImageBruch para que se muestre como foto en el otro rectángulo así quedaron los códigos que los dos nuevo eventos llamados por expression Labda:
void capture_CaptureFailed(object sender, ExceptionRoutedEventArgs e)
{
// Mensaje de error por si falla la captura
MessageBox.Show("Falla en la Captura");
}
void capture_CaptureImageCompleted(object sender, CaptureImageCompletedEventArgs e)
{
// asina el resultado al ImageBrush declarado Globalmente
capturedFoto.ImageSource = e.Result;
}
Ahora si pueden compitar y funcionara todo Perfecto:
Al compilar te darás cuenta que al presionar Capturar Silverlight le pide permiso al usuario para acceder al equipo y trabajar con el dispositivo de Video.
Una vez que presionar si Silverlight muestra el video en vivo en pantalla:
Pueden Parar la captura y dejara de visualizar el video en vivo de la cámara Web o Tomar una fotografía.
Espero les guste el Articulo y es todo por hoy y Puedes descargar el código acá se llama DemoMedia:
Muchas gracias y espero sea de su agrado
Silverlight 5 Interesante Demostración en 3D (El Futuro)
Hola de nuevo amigos Internautas, este video pude verlo hace tiempo pero en el pdc siempre estoy pendiente de todos los cambios que hay en la tecnología, esto lo posteo para que tengan una idea de lo que nos viene en futuro a todos los desarrolladores que se han enfocado al área de Silverlight espero lo disfruten y comiencen a desarrollar.
Si te gusta esto te invito a que entres en este sitio web te registres y comiences una carrera llamada Silverlight, un excelente programa de aprendizaje.
HoloDesk: Experimento de Microsoft Utilizando Kinect Genial..
Hola amigos.. hoy les trigo al muy interesante sobre unos experimentos que esta haciendo actualmente Microsoft con Kinech, esto es realmente el futuro y apenas un pequeño bosquejo de los que nos espera en el futuro las aplicaciones de ultima generación, esto es HoloDesk disfruten de lo ultimo en tecnología y espero amen esta tecnología tanto como yo, además de que se atrevan a desarrollar aplicaciones a los que estén como yo en esta interesante carrera.
HoloDesk es un nuevo sistema interactivo que combina un proyector óptico y una cámara Kinect para crear la ilusión de que los usuarios están interactuando directamente con gráficos en 3D. Se renderiza una imagen virtual de una escena 3D a través de un espejo y se alinea espacialmente con el mundo real para el usuario.
Los usuarios pueden entrar en contacto fácilmente con la imagen virtual. Esto permite que el usuario, literalmente, pueda poner sus manos en el objeto virtual. Se usa un nuevo algoritmo en tiempo real para representar las manos y otros objetos físicos, que son captados por Kinect dentro del espacio establecido, permitiendo una interacción física realista entre los objetos reales y los virtuales.
Manejo de teclados en Windows Phone 7.1
Hola amigos internautas aquí les traigo mas sobre Windows Phone 7.1 en este caso los diferentes tipos de teclados que podemos disponer al momento de agregar un control de escritura. Entonces vamos a crear un proyecto y agregar un TEXTBOX.
En el siguiente ejemplo podemos ver tres Controles textbox, aunque necesitamos mas para dar todas la demostraciones de teclados en el teléfono que tiene como propiedad InputScope.
Esto permite que nuestros campos al momento de ingresar datos, el teclado que se muestra en pantalla sea adaptable a la información que el programador del sistema quiere que se escriba en dicho campo, una funcionalidad realmente interesante para el nuevo sistema operativo de microsoft para teléfonos Windows Phone 7.1 la cual ya esta en su versión final para los desarrolladores con un interesante emulador para desarrollar sin necesidad de tener el teléfono.
Documentación MSDN:
Hay tres formas de cambiar esta Propiedad y cualquier función de Silverlight en general y las tres son por las propiedades de Blend al seleccionar el Textbox, directo por código XAML, O por código C shard o Visual Basic que con la nueva versión están disponibles.
POR LAS PROPIEDADES DE BLEND
Como pueden ver hay una lista amplia de los diferentes tipos de teclados y aca le colocamos los diferentes teclados que puedes tener:
Por defecto, y otros valores estándar de entrada alcance
Estándar QWERTY
Este es el teclado que vienen por defecto..
Valor en la Propiedad: Chat
Entrada de texto que utiliza funciones inteligentes tales como abreviaturas
Valor de Propiedad: Url
Diseño estándar. Com y personalizado tecla Intro para escribir las direcciones URL.
Valor de Propiedad: EmailSmtpAddress
Diseño estándar. Com y @ key.
E-mail el nombre o la dirección
Valor de Propiedad: EmailNameOrAddress
Diseño estándar. Com y @ key, y el fácil acceso a la disposición el número telefónico.
Valor de Propiedad: Maps
Diseño estándar con una medida tecla Intro. Se utiliza para escribir una ubicación para buscar en un mapa
Valor de Propiedad: TelephoneNumber
12-clave de diseño
Búsqueda
Semi-transparente con un diseño de Búsqueda y. Com clave.
NameOrPhoneNumber
Diseño estándar con acceso a la disposición el número telefónico. Se utiliza para escribir en el SMS para el campo
Lo mostrado en la siguiente lista son los que aparecen formalmente en la pagina de MSDN mas sin embargo la lista en Blend es larga y puedes probar otros tipos de teclados. por ejemplo el siguiente.
Valor de Propiedad: PostalCode
Para escribir códigos postales de ciudades.
Para finaliza les indico la forma de hacerlo mediante código.
Hacerlo mediante código XAML.
1: <TextBox Text="HelloWorld">
2: <TextBox.InputScope>
3: <InputScope>
4: <InputScopeName NameValue="Url" />
5: </InputScope>
6: </TextBox.InputScope>
7: </TextBox>
8:
9: <TextBox Text="HelloWorld 2" InputScope="Url"/>
Hacerlo mediante código C shard.
1: InputScope inputScope = new InputScope();
2: InputScopeName inputScopeName = new InputScopeName();
3: inputScopeName.NameValue= InputScopeNameValue.Url;
4: inputScope.Names.Add(inputScopeName);
5: textbox.InputScope = inputScope;
Que hay de nuevo en Windows Phone 7.1 ???

Hola amigos internautas ahora les traigo un poco de lo nuevo de Windows Phone 7.1 la cual hace poco ha salido su versión Final, por tanto ya si debemos estar bien dispuestos y seguros de que esto será un éxito en muchos lugares del mundo.
Descarga el SDK (Ya en Español , Incluye VIsual Studio,Expression Blend y Emulador Windows Phone):
http://www.microsoft.com/download/en/details.aspx?id=27570
Entre las características nuevas podemos encontrar
- Multi-focalización y la compatibilidad de la aplicación
- Multitarea
- El modelo de ejecución y aplicación de cambio rápido
- Alarmas y Recordatorios
- Agentes de fondo
- Las transferencias de fondo del archivo
- Audio de fondo
- Medios de comunicación
- Silverlight 4
- Sensores
- Sockets de apoyo
- Red de Información
- Notificaciones Push
- Azulejos en vivo
- Silverlight y XNA Integración
- Análisis de rendimiento de aplicaciones
- Soporte de Visual Basic
- Publicidad
- WebBrowser control
- Estado del dispositivo
- Base de datos local
- Explorador de almacenamiento aislado
- Lanzadores y Selectores
- Contactos y Calendario
- Almacén de datos cifrados
- Pautas de Diseño de Experiencia
- Requisitos de certificación
- Mercado Test Kit
- Cámara
- Fotos extensibilidad
- Buscar extensibilidad
- Aplicación de Abogados
- Teclado en pantalla
- La bandeja del sistema y el indicador de progreso
- OData cliente
- Globalización y localización
- Creación de aplicaciones de prueba
- Windows Marketplace Teléfono
Que esperas no pierdas tiempo y descarga tu SDK y pon manos a la obra pronto estaré trabajando mas a fondo con estas nuevas características así que muy pendiente de mi Blog, Para una mayor experiencia y mas detalle de información de los que contiene el SDK lee las siguientes lineas.
El teléfono de Windows SDK incluye los siguientes
- Microsoft Visual Studio 2010 Express para Windows Phone
- Ventanas de emulador de teléfono
- Windows Phone SDK 7.1 Asambleas
- Silverlight 4 SDK y DRT
- Windows Phone SDK 7.1 Extensiones de XNA Game Studio 4.0
- Microsoft Expression Blend SDK para Windows Phone 7
- Microsoft Expression Blend SDK para Windows Phone OS 7.1
- De datos de WCF Servicios de cliente para teléfonos Windows
- Microsoft Advertising SDK para Windows Phone
Requisitos del sistema
Sistemas operativos compatibles: Windows 7, Windows Vista
- Windows ® Vista ® (x86 y x64) con Service Pack 2 – todas las ediciones salvo Starter Edition
- Windows 7 (x86 y x64) – todas las ediciones salvo Starter Edition
- La instalación requiere 4 GB de espacio libre en disco en la unidad del sistema.
- 3 GB de RAM
- Emulador de Windows Phone requiere DirectX 10 o superior Tarjeta gráfica compatible con un controlador WDDM 1.1
El SDK de Windows Phone 7.1 es compatible con la versión final de Visual Studio 2010 SP1.
Bienvenida Nuevos MPS Venezuela…
Hola amigos internautas quiero hacer felicitaciones ya por medio de mi blog una grata Bienvenida a los nuevos MSP de Venezuela. Recordándole un poco lo que es ser un Microsoft Student Partners:
¿Que es MSP?
El Programa Microsoft Student Partner (MSP) es un reconocimiento anual para los estudiantes que efectuan contribuciones sobresalientes en la comunidad técnica de estudiantes. Reconocemos y premiamos a los más talentosos estudiantes de universidades alrededor del país por su dedicación, pasión y entrega con Microsoft cada año.
Esperamos que todos y cada uno pueda sacar el mayor provecho ya que por experiencia propia les digo que es parte de un muy interesante crecimiento profesional es año como pueden ver tenemos nuevo logo, nuevo sitio web, nueva plataforma y nuevo ADE, JHUESS VILLANUEVA Y SARA LINARES que también manejan las comunidades profesionales así que ps muchachos se requiere que los apoyemos al máximo.
Sitio Web Oficial: https://www.microsoftstudentpartners.com/
Síguenos en Twitter: @MSEstudiantesVE
Ahora imagen de la presentación formal de los Nuevos MSP de nuestro país.






