Alex Jimenez

El éxito no se terminaría de lograr si no tienes la fe en tus cualidades y en DIOS para lograrlo
Tips & Trucos: Mostrar Alerta o Dialog desde el Servidor ASP.net (JavaScript y JQuery UI)

Existen muchas formas de emitir un mensaje al usuario luego de que se registra una acción, la mas común es mostrar el mensaje en un Label.

Aquí les mostrare dos formas con un mismo método, Sonrisa es decir, el primer método es mostrar el tipo alert de javascript y la segunda es usando el Dialog de JQuery UI.

Antes de empezar necesitamos una pagina vacía con un TextBox para escribir el mensaje y dos Buttons:

El primero en la propiedad Text le colocaremos “Mensaje con Javascript” y el Segundo “Mensaje con JQuery”, seria algo así:

<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtMensaje" runat="server" Width="380px"></asp:TextBox>
        <br />
        <asp:Button ID="btnMensajeJavascript" runat="server" 
            Text="Mensaje con Javascript" onclick="btnMensajeJavascript_Click" />
        <asp:Button ID="btnMensajeJQuery" runat="server" Text="Mensaje con JQuery" 
            onclick="btnMensajeJQuery_Click" />
    </div>
    </form>
</body>

La primera:

Le damos dobleclick al primer botón y escribiremos lo siguiente:

        protected void btnMensajeJavascript_Click(object sender, EventArgs e)
        {
            //Declaramos un StringBuilder para almacenar el alert que queremos mostrar
            StringBuilder sbMensaje = new StringBuilder();
            //Aperturamos la escritura de Javascript
            sbMensaje.Append("<script type='text/javascript'>");
            //Le indicamos al alert que mensaje va mostrar
            sbMensaje.AppendFormat("alert('{0}');",txtMensaje.Text);
            //Cerramos el Script
            sbMensaje.Append("</script>");
            //Registramos el Script escrito en el StringBuilder
            ClientScript.RegisterClientScriptBlock(this.GetType(), "mensaje", sbMensaje.ToString());
        }

La segunda:

Para esta ocasión registraremos en el Head de la pagina las referencias a JQuery y JQuery UI (Pueden descargar el que mas le agrade o usar CDN de Google)

<head runat="server">
    <title>Mostrar Mensajes</title>
     <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js" type="text/javascript"></script> 
     <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js" type="text/javascript"></script> 
     <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css" type="text/css" media="all" /> 
</head>

Le daremos dobleclick al segundo botón y escribiremos el siguiente código:

       protected void btnMensajeJQuery_Click(object sender, EventArgs e)
        {
            //En esta ocasión agregaremos un literal que a su vez agregaremos un div que nos servira de Dialog
            //O si prefieren pueden crear el div directamente en el HTML
            Literal li = new Literal();
            StringBuilder sbMensaje = new StringBuilder();
            //Creamos el Div
            sbMensaje.Append("<div id='dialog' title='Mensaje Prueba'>");
            //Le indicamos el mensaje a mostrar
            sbMensaje.Append(txtMensaje.Text);
            //cerramos el div
            sbMensaje.Append("</div>");
            //Aperturamos la escritura de Javascript
            sbMensaje.Append("<script type='text/javascript'>");
            sbMensaje.Append("$(document).ready(function () {");
            //Destrimos cualquier rastro de dialogo abierto
            sbMensaje.Append("$('#dialog').dialog('destroy');");
            //le indicamos que muestre el dialogo en modo Modal
            sbMensaje.Append(" $('#dialog').dialog({ modal: true });");
            //Si quieres que muestre un boton para cerrar el mensaje seria esta linea que dejare en comentario
            //sbMensaje.Append(" $('#dialog').dialog({ modal: true, buttons: { 'Ok': function() { $(this).dialog('close'); } } });");
            sbMensaje.Append("});");
            sbMensaje.Append("</script>");
            //Agremamos el texto del stringbuilder al literal
            li.Text = sbMensaje.ToString();
            //Agregamos el literal a la pagina
            Page.Controls.Add(li);
        }

Espero que lo mostrado aquí les sea de mucha utilidad.

Publicado 21/8/2010 20:13 por Alexander Jimenez | 3 comment(s)

Archivado en: ,,,,,,

ASP.net: Creación de una Aplicación con Membership y Roles – Parte III

Artículos anteriores:

ASP.net: Creación de una Aplicación con Membership y Roles – Parte I

ASP.net: Creación de una Aplicación con Membership y Roles – Parte II

En esta tercera parte vamos a empezar con crear una base de datos (ahora si ustedes ya tienen una base de datos a la que deseen agregar la membrecía pues la pueden seleccionar).

Paso 1.: Abriremos el “Server Explorer” o “Explorador de Servidores” eso lo podrán hacer con la combinación de teclas: Ctrl + W y luego presionan l o ir al menú Vista (View) y seleccionarlo desde allí.

Para leer el resto entra en: http://ajdev.net/Publicacion/Articulo/71

Hasta la próxima entrega.

Publicado 17/6/2010 12:15 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,

Tutorial: Creación de una Aplicación para Windows Mobile 7

hola a tod@s,

Como bien es sabido me gusta mostrarle mucha información con respecto al desarrollo de aplicaciones con ASP.net y SilverLight, pues en esta ocasión les dejare unos enlaces de un tutorial que esta muy nutritivo :) con full SilverLight y con Windows Mobile 7. El único inconveniente seria el hecho de que esta en Ingles.

Fuente: http://www.thewindowsclub.com/windows-phone-7-series-tutorial-building-deploying-applications

In the series of tutorials, we will be covering up the following areas :

Exercise 1: Creating Windows Phone Applications with Microsoft Visual Studio 2010 Express for Windows Phone

Task 1 – Creating a Windows Phone Application Project in Visual Studio.

Task 2 – Solution Explorer

Task 3 – Building and Testing the Application in the Windows Phone Emulator

Task 4 – Designing the Windows Phone User Interface

Task 5 – Handling Events from the User Interface

Task 6 – Managing Errors in the Application

Source: http://www.thewindowsclub.com/windows-phone-7-series-tutorial-building-deploying-applications#ixzz0piYhfUeM

Task 7 – Verification

Exercise 2: Using Expression Blend to Design the UX of your Windows Phone Application

Task 8 – Creating a Custom Button in Expression Blend – I

Task 9 – Creating a Custom Button in Expression Blend – II

Task 10 – Adding Visual States to the Custom Control

Task 11 – Creating an Animation for the Banner Text

Task 12 – Verification

Source: http://www.thewindowsclub.com/windows-phone-7-series-tutorial-building-deploying-applications#ixzz0piYoExq0

Windows Phone Developer Tools includes:

  • Visual Studio 2010 Express for Windows Phone
  • Windows Phone Emulator
  • Silverlight for Windows Phone
  • XNA Game Studio 4.0 CTP

Download Links:


Source: http://www.thewindowsclub.com/windows-phone-7-series-tutorial-building-deploying-applications#ixzz0piYsEeQQ

Publicado 2/6/2010 13:36 por Alexander Jimenez | 3 comment(s)

Archivado en: ,,,,,,,

Evento: 1era Convención Internacional de Interoperabilidad Tecnologías Integradas

 

 

Evento

Microsoft Latinoamérica te invita a participar este miércoles 9 de junio, en la 1ª Convención Virtual Internacional de Interoperabilidad “Tecnologías Integradas”. Es un evento que tiene como objetivo mostrar escenarios de la vida real que te permitirán ver la manera más efectiva de integrar diversas tecnologías del mundo de hoy. Durante el mismo, tendrás la oportunidad de compartir las experiencias de cada uno de los expositores internacionales desarrolladores de soluciones en diferentes plataformas, dentro del marco de integración tecnológica. Contaremos con la participación de tecnólogos, desarrolladores y profesionales de interoperabilidad de Venezuela, Ecuador, México, Perú, Brasil y otros países de Latinoamérica.

Integrando Tecnologías 

Eduardo Nuñez

Cloud Computing - La Nueva Era 

Luis Daniel Soto

Interoperando con Productividad en ambientes de colaboración

Luis Du Solier Grinda

Virtualizar es la clave de la interoperabilidad 

Argenis Avendaño

Caso de éxito de interoperabilidad: Port.25 

Peter Galli

Desarrollando aplicaciones PHP con Eclipse para Windows Azure 

Eduardo Sojo

Cómo sacarle provecho a las aplicaciones PHP sobre Windows

Antonio Ognio

Servicios de Federación de Active Directory

Felix Gonzalez

Framework Interoperable?

Carlos Figueroa

Integrando aplicaciones de manera extensible

Interoperabilidad con COM en aplicaciones de Silverlight 4

Rodrigo Diaz Concha

Colaboración entre Samba y Sharepoint 

Yonathan Arrivillaga

Conectividad de portales con Web Services for remote portlets   

Virtualizar aplicaciones para ambientes heterogéneos

Julio Martus

Interoperando con SUSE Linux: Proyecto Moonlight 

Alessandro Binhara

Open Source y Software Propietario 

Cesar Brod

Integración y colaboración entre Sistemas Operativos

Everaldo Canuto

Registro

© 2010 Microsoft Corporation Todos los derechos reservados

Aviso Legal | Marcas registradas | Privacidad

Publicado 1/6/2010 8:39 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,

ASP.net: Creación de una Aplicación con Membership y Roles – Parte II

En el articulo anterior Mostramos como se define el tag del Membership Provider ahora es el turno del Role Provider:

<roleManager enabled="true">
    <providers>
        <clear/>
        <add name="AspNetSqlRoleProvider" 
     type="System.Web.Security.SqlRoleProvider" 
     connectionStringName="ApplicationServices" 
     applicationName="/"/>
    </providers>
</roleManager>

Aquí a diferencia del Membership Provider no hay tantos atributos a configurar como por ejemplo Type que ahora esta apuntando a SqlRoleProvider en ves de SqlMembershipProvider, el atributo de connectioStringName se mantiene igual ahora si quieres manejar en una Base de Datos los Roles y en otra la membrecía es totalmente valido solo debes especificar a que cadena de conexión se va conectar.

Bueno ya con esto pasamos a la siguiente parte que es Configurar nuestra aplicación para trabaje cómodamente con la membrecía y los roles, para ello nos ubicamos en el “Solution Explorer” o en Español el “Explorador de Soluciones” nuestro proyecto web (Si no lo tienes o no lo ves pues puedes presionar las teclas Crtl+W y Luego S o sencillamente te vas al menú Ver y allí aparecerá entre los primeros items) .

 

Si quieres leer mas pues te recomiendo que entres en: http://ajdev.net/Publicacion/Articulo/68.aspx

Publicado 31/5/2010 17:04 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,

ASP.net: Creación de una Aplicación con Membership y Roles – Parte I

Hola a tod@s

Antes de empezar quisiera que se respondieran estas preguntas?

Cuantas veces has creado una tabla usuario?

Cuantas veces dejas la clave del usuario totalmente visible en un campo de tu Tabla Usuario?

Cuantas veces defines roles para acceder a unas carpetas?

Cuantas veces defines roles en cada pagina?

Cuantas veces defines una tabla Roles?

Cuantas veces quieres validar tus usuarios con el Active Directory de la Empresa?

Si has respondido todas las preguntas pos… en verdad necesitas de la membrecía de ASP.net jejeje en muchas ocasiones hacemos tareas tan repetitivas y poco productivas como por ejemplo crear un control de tipo Login que se conecte a una tabla y validar si los datos introducidos pertenecen o no al usuario para darle acceso, y si el usuario es algo hábil y quiere entrar a otra pagina diferente al login pues allí se nos enredaba un poco las cosas cierto?

Ya basta de tanto bla bla bla.. :) lo que quiero mostrarte en este tutorial es enseñarte a utilizar La membrecía, los roles y por que no también los perfiles de los usuarios que accederán a tu aplicación web y lo mejor de todo es que no tendrás que hacer malabares a como lo hacías antes para poder tener el control de tus usuarios.

Si quieres leer mas pues te recomiendo que entres en: http://ajdev.net/Publicacion/Articulo/67.aspx

Publicado 19/5/2010 11:11 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,

La Eficiencia en tus Manos!!!

Hola a todos quiero invitarlos al mayor evento Virtual de este año y es nada mas y nada menos que el lanzamiento de varios productos de alto calibre en Microsoft como lo son:

image

image

Ahora dime, Te lo vas Perder??? :)

Publicado 8/4/2010 9:59 por Alexander Jimenez | 2 comment(s)

Archivado en: ,,,,,,,,,,

Tips & Trucos: Agregar MetaTags de Descripcion y Palabras Claves a nuestras Paginas ASP.net (KeyWords y Description)

En muchas ocasiones nos preocupamos por saber si los buscadores indexan correctamente nuestros sitios web y en su mayoría nos olvidamos de generar las palabras claves de la información que contiene nuestras paginas como también una breve descripción de la misma. es por ello que aquí les dejo este simple truquillo que se puede utilizar con cualquier versión de ASP.net (Ojo ya en VS2010 con Framework 4.0 contiene una solución mas amigable)

Para los que vienen de ASP.net con el .net Framework 2.0 y 3.5

  //Agregamos este evento en nuestra pagina o MasterPage para que se carge antes que nada 
   protected void Page_Init(object sender, EventArgs e)
    {
        // Adicionas el Tag de Descripcion de tu Página
        HtmlMeta metaDescripcion = new HtmlMeta();
        metaDescripcion.Name = "Description";
        metaDescripcion.Content = "Una breve descripción de lo que contiene tu página";
        Page.Header.Controls.Add(metaDescripcion);

        // Adicionas el Tag de palabras claves separadas por comas
        HtmlMeta metaPalabrasClaves = new HtmlMeta();
        metaPalabrasClaves.Name = "Keywords";
        metaPalabrasClaves.Content = "asp.net, silverlight, ajdev";
        Page.Header.Controls.Add(metaPalabrasClaves);
    }
Para los que desean aprovechar la nueva funcionalidad en ASP.net con el .net Framework 4.0 
        protected void Page_Init(object sender, EventArgs e)
        {
            Page.MetaKeywords = "asp.net, silverlight, ajdev";
            Page.MetaDescription = "Una breve descripción de lo que contiene tu página";
        }

El Resultado:

<head>
    <title>Home Page </title>
    <meta name="description" content="Una breve descripcion de lo que contiene tu página" />
    <meta name="keywords" content="asp.net, silverlight, ajdev" />
</head>

Saquen ustedes sus propias conclusiones :) y se lo dejo a su creatividad :)

Nota: Recuerden que para que esto funcione perfectamente en el html de la pagina o de la MasterPage el Tag <head> debe correr bajo servidor:

<head runat="server">
</head>

Publicado 5/4/2010 15:42 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,

Tips & Truco: Forzar la Utilización de un Tema en ASP.net

Hola a todos,

Hace unos días alguien me hizo esta pregunta y pues quiero compartirlo con todos, se que para muchos programadores esto es básico pero para los que recién comienza o los que están pasando de VS2003 hacia VS2005, VS2008 o VS2010 no lo conocen (saber mas sobre Themes puedes ver este articulo que publique hace un tiempo: http://ajdev.net/Publicacion/Articulo/44.aspx).

La idea es que desde un momento que se desee en la aplicación se pueda utilizar un tema, digamos que se diseñaron mas de 2 temas o en un futuro se diseño uno nuevo pero para no hacer el cambio de la hoja de estilo en cada pagina usamos los App_Themes de ASP.net para cambiarlo mediante código es la siguiente Instrucción:

    protected void Page_PreInit(object sender, EventArgs e)
    {
        Theme = "TemaAzul";
    }

Con el evento anterior debemos disparamos la asignación del tema antes de que cargué la pagina, ahora si desean que un Tema en especifico se mantenga para todas las paginas puedes forzarlo en el Web.Config, por tanto debes ubicar el Tag <Pages> y agregarle un atributo que es el Theme, asi como se muestra a continuación:

<system.web>
    <pages theme="TemaAzul" >
         <controls>
         </controls>
     </pages>
</system.web>

 

Espero que esto le sea de ayuda.

Publicado 11/3/2010 15:40 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,

Actualizado: Cursos de Programación (Web, C#, VB, Azure, Windows 7, Dynamics, Mobile, SilverLight, etc)

clip_image001Curso de Desarrollo con Windows Azure

Windows Azure constituye la parte fundamental de la plataforma y actúa como el sistema operativo en la nube de Microsoft. De este modo se tratan los fundamentos de crear aplicaciones con .NET para este sistema así como todos los servicios que ofrece, como el Fabric, diagnóstico, trazas, configuración, despliegue, y los diferentes tipos de almacenamiento de datos.

clip_image001[1]Curso de Windows 7 para desarrolladores

Este curso va dirigido a desarrolladores de Windows que deseen modificar sus aplicaciones, o crear nuevas aplicaciones, de tal forma que sean plenamente compatibles con Windows 7 y, posiblemente, que hagan uso expreso de las nuevas características de dicho sistema operativo.

clip_image001[2]Curso de desarrollo sobre Dynamics CRM

Te presentamos una introducción al desarrollo sobre Dynamics CRM. Aprenderás a utilizar los recursos que proporciona la plataforma de CRM para extender las funcionalidades del producto, comprobarás cómo CRM puede ser un magnífico punto de arranque para construir todo tipo de aplicaciones de línea de negocio, repasaremos las funciones de datos y metadatos, herramientas para flujos de trabajo, lógica de negocio e integración en la interfaz de usuario. Usaremos C# para desarrollar aplicaciones de consola, ASP.NET y una introducción a los clientes Silverlight para CRM.

clip_image002Curso Desarrollo Web

En este curso se tratan todas las cuestiones fundamentales que le permitirán crear aplicaciones web con Visual Studio 2005 y con Visual Studio 2010. Al final del curso sabrá todo lo necesario para crear sus propias aplicaciones Web orientadas a datos y con multitud de características avanzadas

clip_image002[1]Curso de Introducción a .NET con Visual Basic 2005, 2008 y 2010

En este curso podrás aprender a desarrollar aplicaciones Windows con Visual Studio 2005, 2008 y Visual Studio 2010 Beta2, y terminaremos desarrollando una aplicación real con los conceptos aprendidos. Al final de cada lección tendrás disponible un video en el que podrás ver los conceptos explicados de forma práctica sobre el entorno de Visual Studio 2005, 2008 y Visual Studio 2010 Beta2.

clip_image002[2]Curso de Introducción a .NET con C#

En este curso podrás aprender a desarrollar aplicaciones Windows con Visual Studio 2005, 2008 y Visual Studio 2010 Beta2, y terminaremos desarrollando una aplicación real con los conceptos aprendidos. Al final de cada lección tendrás disponible un video en el que podrás ver los conceptos explicados de forma práctica sobre el entorno de Visual Studio 2005, 2008 y Visual Studio 2010 Beta2.

clip_image002[3]Curso de Visual Studio 2005, 2008 y Visual Studio 2010 Beta2 para desarrolladores VB6

En este curso podrás aprender a desarrollar aplicaciones con la última generación de herramientas de desarrollo Visual Studio 2005, 2008 y Visual Studio 2010 Beta2. Veremos las principales diferencias con Visual Basic 6, tanto a nivel del lenguaje como de la infraestructura de desarrollo utilizada, y acabaremos desarrollando una aplicación real con los conceptos aprendidos. Al final de cada lección tendrás disponible un video en el que podrás ver los conceptos explicados de forma práctica sobre el entorno deVisual Studio 2005, 2008 y Visual Studio 2010 Beta2.

clip_image002[4]Curso de desarrollo con dispositivos móviles

En este curso aprenderás a desarrollar aplicaciones para dispositivos móviles con Visual Studio 2005, 2008 y Visual Studio 2010 Beta2. Al final de cada lección tendrás disponible un video en el que podrás ver los conceptos explicados de forma práctica sobre el entorno de Visual Studio 2005, 2008 y Visual Studio 2010 Beta2.

clip_image002[5]Curso de desarrollo con Windows Presentation Foundation

En este curso usted verá cómo crear sus primeras aplicaciones usando Windows Presentation Foundation (WPF). Le enseñaremos a utilizar los nuevos recursos de presentación de esta nueva plataforma de Microsoft con los que podrá elevar a niveles excitantes la calidad y funcionalidad de las interfaces de usuario de sus aplicaciones. Lo introduciremos en la nueva filosofía de programación declarativa con el lenguaje XAML que ayuda a separar la interfaz de presentación del código .NET en el que programe la lógica del negocio de su aplicación. Con WPF verá facilitados y enriquecidos conocidos conceptos como controles, eventos, enlace a datos, así como podrá incorporar nuevos elementos como transformaciones, plantillas, estilos, animaciones, media, 3D, documentos.

clip_image002[6]Curso de Servicios Web

En este curso podrás aprender los conceptos fundamentales relacionados con los Servicios Web, y cómo éstos se implementan en la plataforma .NET, para luego ser consumidos desde esa misma plataforma u otras como Java y PHP. Al final de cada lección de naturaleza práctica, tendrás disponible un vídeo en el que podrás reflejados los conceptos.

clip_image003Curso de Windows Live APIs

En este curso aprenderá a integrar y enriquecer su páginas PHP y JSP con las APIs de Windows LIVE. En cada capítulo dispondrá de un video explicativo con una demo de lo visto relacionado con esa API.

clip_image003[1]Curso de Silverlight 2.0 (1º parte)

En el curso veremos una introducción al desarrollo con la versión 2.0 de Silverlight. Con él aprenderás a utilizar los recursos para la creación de sitios Web enriquecidos y aplicaciones Web completas con una innovadora interfaz de usuario y prestaciones multimedia mejoradas y adaptables a cada situación. Revisaremos la programación de interfaces de usuario mediante el lenguaje XAML adaptado para Silverlight 2.0 y utilizaremos el lenguaje C# para la programación del comportamiento de negocio.

clip_image003[2]Curso de Silverlight 2.0 (2º parte)

Esta es la segunda parte del curso de introducción al desarrollo con la versión 2.0 de Silverlight. Aquí nos centraremos en la utilización de Controles Predefinidos, Estilos, Animaciones, Creación de controles personalizados, Visual State Manager, Acceso a Datos y Buenas Prácticas, tanto en la arquitectura, como en la implantación final.

clip_image003[3]Curso de Silverlight 1.0

Silverlight representa el paso siguiente en el desarrollo del potencial de riqueza en utilización que los desarrolladores y diseñadores de aplicaciones pueden presentar a sus clientes. Este curso pretende acercarle al maravilloso mundo que está resultando ser el desarrollo para la próxima generación de aplicaciones web con Silverlight. Esta tecnología cuenta con multitud de funcionalidades que podrá comenzar a usar ahora para crear su próximo sitio web.

clip_image003[4]Curso de diseño y autoría con Microsoft Expression Web

Desde principios fundamentales que rigen el diseño Web, hasta el uso de archivos XML para crear diseños dinámicos enlazados a datos, pasando por la creación, edición y mantenimiento de sitios y aplicaciones Web con interfaces accesibles y usables, y garantizando siempre la compatibilidad con los estándares del W3C para la Web, como XHTML, CSS o XML, este curso le guiará paso a paso por los fundamentos prácticos del diseño y la autoría con la potente herramienta Microsoft Expression Web.

clip_image003[5]Curso de SQL Server 2005

En este tutorial, aprenderá los fundamentos para desarrollar aplicaciones con la versión Express de SQL Server 2005. El objetivo del tutorial no es cubrir en gran detalle todos los aspectos de SQL Server 2005 Express, pero si aportar una idea general del producto y su integración con el resto de herramientas Express (Visual Basic Express, Visual C# Express, y Visual J# Express). Como complemento adicional al tutorial, deberá seguir los Libros en Pantalla del producto (Books On Line).

clip_image003[6]Curso de desarrollo con Sharepoint 2007

SharePoint es no solamente la herramienta de colaboración de Microsoft, sino toda una plataforma de desarrollo, debido a su flexible arquitectura y poderoso Modelo de Objetos. Este curso demuestra las posibilidades de desarrollo de componentes para Windows SharePoint Services (WSS) 2007 y Microsoft Office SharePoint Server (MOSS), tales como WebParts, Tipos de Contenido y Características, así como la forma de interactuar programáticamente con servicios avanzados del sistema, como son sus Flujos de Trabajo y Catalogo de Datos Profesionales.

clip_image003[7]Desarrolla con MSDN: Dispensador de MSDN Video

Veremos como construir un dispensador de películas automático, basado en WinForms y con despliegue automático por Internet. Nos permitirá construir el interfaz rico y potente necesario en este tipo de aplicaciones. El tamaño de este Video es de 79'34 MB, el tiempo de descarga dependerá del tipo de conexión.

clip_image003[8]Aplicaciones Smart Client con .NET

Un smart client consiste en una aplicación que proporciona al usuario un interfaz Windows rico para acceder a un sistema basado en servicios web, pero que mantiene las ventajas de los clientes web tradicionales, como la ausencia de instalación en la máquina cliente, el funcionamiento a través de Internet y la actualización automática. El tamaño de este Video es de 80'33 MB, el tiempo de descarga dependerá del tipo de conexión.

clip_image003[9]Desarrollo de aplicaciones con .NET y Servicios Web

En este webcast veremos una introducción al desarrollo en .NET de la lógica de negocio de una aplicación. El tamaño de este Video es de 65,1MB, el tiempo de descarga dependerá del tipo de conexión.

clip_image003[10]Desarrolla con MSDN: Servidor central de MSDN Video

Primer webcast de la serie Desarrolla con MSDN. Estos webcasts mostrarán paso a paso cómo desarrollar con Visual Studio .NET la aplicación MSDN Video. En esta ocasión desarrollaremos el servidor central que servirá como núcleo del resto de clientes que consumirán la funcionalidad de la aplicación. El tamaño de este Video es de 75,8MB,

Publicado 11/3/2010 15:28 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,,,,,,,,,,,

SketchFlow: Creando Prototipos - Parte II La Creación

Ya luego de la primera entrega donde se explicaba un poco la teoría que encierra el SketchFlow pues le daremos inicio a la parte practica de este tutorial.

Como les comente anteriormente el SketchFlow viene dentro del Expression Blend 3 por si no tienes una suscripción MSDN puedes descargarlo de este sitio: http://cut.ms/JTL

1. Simularemos una solicitud de un cliente en donde requiere que se muestre una lista de productos con fotos y su respectiva descripción, además de ver una ventana de inicio, una de login, una que mencione a la empresa. Con esto podemos comenzar :)

2. Ya luego de tener Expression Blend 3 instalado vamos a crear nuestra primera demostración y para ello seleccionaremos la plantilla “Aplicación SketchFlow de SilverLight 3” al Cual llamaremos “Prototipo” y trabajaremos con el lenguaje C# como se muestra en la imagen:

 Para continuar leyendo este post visiten esta dirección: http://ajdev.net/Publicacion/Articulo/58.aspx

 Post cruzado con http://cut.ms/Jn9

Publicado 19/1/2010 16:28 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,,,,,,,,

WebCast de Tecnología 2010 (Audiencia de MSDN y Technet)

Los próximos WebCast planificado por la gente de Microsoft donde los expositores son de Venezuela (Incluyéndome ya que abriré la tanda :))

Webcast

fecha

Hra

Zona Horaria

Audiencia

Link de Registro

Speaker
Preparandonos para Visual Studio 2010 28-Jan-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSL Alexander Jimenez
Windows Worflow Foundation 21-Jan-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSM Yonathan Arrivillaga
Trabajando Windows 7 y Windows Server 2008 R2 20-Jan-10 11:00:00 a.m. -5 Technet http://cut.ms/JSN Felix Gonzalez
Nuevas Caracteristicas de SQL Server 2008 R2 26-Jan-10 03:00:00 p.m. -5 Technet http://cut.ms/JSO Carlos Cemborain
Extendiendo las capacidades de manejo de Bases de Datos 04-feb-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSP Manuel Mendez
Desarrollando aplicaciones interoperables 10-feb-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSQ Norberto Planchart
Desarrollando Aplicaciones en la nube con Windows Azure 11-feb-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSR Jose Francisco Herrera
Desarrollando aplicaciones para Windows Azure con Eclipse y Visual Studio 2010 25-feb-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSS Jose Herrera y Eduardo Sojo
Reporting services con SQL Server 2008 R2 23-feb-10 11:00:00 a.m. -5 Technet http://cut.ms/JST Rafael Linares
Administrando servidores con VMM 24-feb-10 10:00:00 a.m. -5 TechNet http://cut.ms/JSU Eduardo Lakatos
Nuevas Caracteristicas de Sharepoint 2010 09-feb-10 11:00:00 a.m. -5 Technet http://cut.ms/JSV Marcos Sanchez
Configurando Servidores web interoperables con Windows Server 2008 R2 Server Core 03-mar-10 03:00:00 p.m. -5 MSDN http://cut.ms/JSW Eduardo Sojo

Publicado 19/1/2010 13:41 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,,,,,,,,,,,,,,

SketchFlow: Creando Prototipos - Parte I La teoría

image

Antes de empezar con el tutorial quiero hacer unas preguntas que estoy seguro que muchos de ustedes han pasado por ello.

Cuantas veces han cambiado de color una pantalla?

han estado en reuniones tan absurdas como que son para definir el tipo de fuente.?

Que el logo debe estar arriba en grande o mas pequeña?

Que la combinación de colores no son las correctas?

Que luego de la pantalla login que debe venir?

Cuando hacen una ppt’s de como se vera la aplicación, tus usuarios creen que ya todo esta listo?

Pierdes tiempo en tratar de adivinar como el usuario quiere ver la aplicación?

Dibujas todas las pantallas en papel o en una ppt?

El usuario a ultima hora te pasa una lista de cambios que afectan la visibilidad de la aplicación?

En fin podemos durar horas y horas mencionando preguntas que nos hacemos al momento de hacer un buen levantamiento de información y sobre todo al momento de crear prototipos de la aplicación que desea ver el usuario final, Te imaginas que puedas resolver la gran mayoría de estas preguntas y que lo mejor de todo que puedes entregar algo funcional para que el usuario interactúes para después llevarlo al desarrollo sin afectar mas tu preciado tiempo? que bien sabemos que en todo desarrollo tienes mucho por hacer y todo es para ayer :)

Pues con SketchFlow que viene en Expression Blend 3 puedes hacer todo esto y mucho mas como:

  • Crear prototipos de aplicaciones web (Con SilverLight 3) o para escritorio (Con WPF) sin necesidad de escribir código.
  • Crear interactividad, animaciones con componentes reales y totalmente funcionales.
  • A través de SketchFlow Player, puedes exponer tu aplicación en la web para que tus usuarios que se encuentre remoto o no tenga la posibilidad de hacer sus comentarios y checar el diseño.
  • Integrar esta retroalimentación dentro de la misma herramienta (Expression Blend 3) para hacer correcciones y centralizar los comentarios de todos los usuarios que revisaron el prototipo.
  • Producir automáticamente la documentación del proyecto como un archivo de Word.
  • Puedes importar tus presentaciones de PowerPoint.
  • Puedes importar tus archivos de Adobe Illustrator y PhotoShop.
  • Te permite incorporar datos de pruebas que vienen por defectos en Expression Blend 3, por lo que te evitas el tener que cargar datos para después ver como quedaría tu aplicación.

SketchFlow no es mas que prototipos rápidos, fáciles y baratos al momento de construirlos, lo que permite crear, explorar y comparar múltiples ideas antes de seguir adelante con una solución. Tradicionalmente los prototipos suelen ser redundante después de la fase de concepto y desechados. SketchFlow permite aprovechar cualquiera de los anteriores trabajos conceptuales, cada elemento creado son reutilizable en el proyecto al momento de pasarlo a la etapa de desarrollo.

Expression Blend 3 a través de SketchFlow te muestra una serie de controles con estilos muy parecidos a los que se dibujan a mano sobre un papel permitiendo centrar al Usuario en las necesidades y funcionalidades propias de la aplicación y no en el que color deben ir las cosas y demás y demás :) Así lo comento Somasegar:

SketchFlow también proporciona un conjunto de controles de “estilo boceto” que dan al prototipo un aspecto de boceto para mantener el enfoque en los conceptos de la experiencia de usuario sin distraerse con los detalles de los elementos visuales demasiado pronto. Los controles de estilo boceto son completamente funcionales y se puede volver a los controles de alta fidelidad en cualquier momento. A continuación puede ver un ejemplo de cómo aparecen los controles de estilo boceto. Fuente: Blog de Soma en español

Cross-Posting con: http://cut.ms/Jn9

Publicado 12/1/2010 15:22 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,,

Windows 7 APIs: Trabajando con el TaskBar (Csharp)

Como parte de una serie de Presentaciones en universidades mostrando como se le puede sacar provecho al TaskBar de Windows 7 pues en este post tratare de explicar lo mas sencillo posible… Mi enfoque sigue siendo el mismo que es el desarrollo web pero en esta ocasión hare la excepción (Soy desarrollador no me culpen por intentar aprender mas cosas) :) jejeje

Primero lo primero debemos ir a esta dirección y descargar las API’s de Windows 7 para poder trabajar con el TaskBar: http://code.msdn.microsoft.com/WindowsAPICodePack

Luego de esto pues manos a la obra, para ver el articulo completo con las imagenes y codigo puedes entrar aqui: Windows 7 APIs- Trabajando con el TaskBar (Csharp)

Publicado 3/12/2009 22:40 por Alexander Jimenez | con no comments

Archivado en: ,,,,,,,,,,

SilverLight 4: NotificationWindows

Continuando con la fiebre de SilverLight 4, esta ocasión les escribiré como mostrarle al usuario final una ventana de notificación ya sea para el común alerta o aviso. Esta funcionalidad funciona solo cuando la aplicación esta fuera del Navegador.

Sin mas ni mas aquí les dejo el tutorial espero que lo disfruten y le saquen muchísimo provecho:

1. Crearemos nuestro proyecto de SilverLight Application

image

2. Le daremos OK a la ventana que nos muestra Visual Studio 2010 para ver nuestro aplicativo SilverLight en un proyecto web.

image

3. Luego de agregaremos un nuevo Item a nuestro proyecto de SilverLight donde agregaremos un UserControl al que llamaremos “Notificador” quien será nuestro mensaje de notificación:

image

4. En ese nuevo UserControl agregaremos el Siguiente Codigo XAML reemplazando el grid que ya se encuentra agregado, sencillamente le estamos agregando dos filas donde la cabecera tiene un alto de 20 y agregamos dos border (uno en cada fila del grid) y 2 textblock (uno en cada border)  además de darle un poquito de color a ambos borders:

     <Grid x:Name="LayoutRoot" Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="20" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Border Grid.Row="0" Padding="8 2 8 2">
            <Border.Background>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Color="#FF87BCDB" Offset="0.0" />
                    <GradientStop Color="#FF6EB3C7" Offset="1.0" />
                </LinearGradientBrush>
            </Border.Background>
            <TextBlock x:Name="titulo" FontWeight="Bold" TextWrapping="Wrap" />
        </Border>
        <Border Grid.Row="1" Padding="8">
            <Border.Background>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Color="#ECECF4" Offset="0.0" />
                    <GradientStop Color="#C3C2D6" Offset="1.0" />
                </LinearGradientBrush>
            </Border.Background>
            <TextBlock x:Name="mensaje" TextWrapping="Wrap"  />
        </Border>
    </Grid>

5. Ahora en el la hoja de código del UserControl agregaremos lo siguiente:

        public void MostrarMensaje(string _titulo, string _mensaje)
        {
            titulo.Text = _titulo;
            mensaje.Text = _mensaje;
        }

6. Regresemos a nuestro UserControl Principal (MainPage.xaml) y agregaremos un botón:

        <Button Content="Notificar" Height="23" Name="btnNotificacion" VerticalAlignment="Center" Width="75" />

7. Ahora nos dirigimos al código y en el constructor de la pagina escribiremos lo siguiente:

   btnNotificacion.Click += new RoutedEventHandler(btnNotificacion_Click);

8. Luego de crear el evento click del boton escribiremos lo siguiente:

        void btnNotificacion_Click(object sender, RoutedEventArgs e)
        {
            if (App.Current.InstallState == InstallState.Installed)
            {
                if (App.Current.IsRunningOutOfBrowser)
                {
                    NotificationWindow nwAlerta = new NotificationWindow();
                    nwAlerta.Height = 80;
                    nwAlerta.Width = 320;
                    //Invocamos al UserControl Notificador.xaml
                    Notificador nota = new Notificador();
                    //Le pasamos los parametros al metodo creado
                    nota.MostrarMensaje("Mi titulo es de Prueba", "Este es una demostracion de como funciona el NoticationWindows en SilverLight 4");
                    nota.Width = nwAlerta.Width;
                    nota.Height = nwAlerta.Height;
                    nwAlerta.Content = nota;
                    nwAlerta.Show(4000);
                }
                else
                {
                    MessageBox.Show("Debe estar instalada la aplicacion para ver la Notificacion");
                }
            }
            else
            {
                MessageBox.Show("Debe estar instalada la aplicacion para ver la Notificacion");
            }
        }

9. Para que esto pueda correr sin problemas debemos decirle a nuestra aplicación SilverLight que puede correr fuera del navegador de lo contrario nos arrojaría error, aunque si ven el código anterior estamos validando de que la aplicación se encuentre instalada para poder mostrar la notificación. Para habilitar que corra fuera del Navegador haremos lo siguiente:

Boton derecho del mouse sobre el proyecto y luego Propiedades y habilitan el check que se muestra en la imagen

image

Si desean agregar alguna configuración adicional como iconos, cambiar el titulo o la descripción pueden hacerlo en el botón que se les aparece al lado “Out-Of-Browser Settings”

Luego de esto pueden ejecutar su aplicación y darle botón derecho en el navegador para instalar su aplicación y hacer las pruebas :)

Publicado 2/12/2009 9:11 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,,,

SilverLight 4: Captura del WebCam y Microfono

SilverLight 4 ha ido tomando mucho revuelo en los últimos días y no es para menos con la inclusión de muchas funcionalidades excelentes que harán de SilverLight un punto de entrada al desarrollo de aplicaciones potentes y lo interesante de todo es que en muchas empresas sin la necesidad de tener una infraestructura fuerte puedes montar estas aplicaciones.

Sin mas rodeo en esta oportunidad les comentare como crear un proyecto sencillo que acepte las características de captura de video y de audio. La demo en caso de no verse aquí podrán verlo en esta dirección: http://ajdev.net/Publicacion/Articulo/52.aspx

1. Crearemos un Nuevo Proyecto en Visual Studio 2010 de tipo “SilverLight Aplicación”

image

2.Visual Studio 2010 nos indicara si deseamos crear un Proyecto Web para testear nuestra aplicación SilverLight le daremos OK.

image

3. Agregaremos 3 Controles el cual seran Dos Botones y Grid:

        <Button Content="Iniciar Captura" Height="26" HorizontalAlignment="Left" Margin="64,47,0,0" Name="btnCapturar" VerticalAlignment="Top" Width="120" />
        <Button Content="Paralizar Captura" Height="26" HorizontalAlignment="Left" Margin="209,47,0,0" Name="btnStop" VerticalAlignment="Top" Width="122" />
        <Grid Height="166" HorizontalAlignment="Left" Margin="12,122,0,0" Name="grid1" VerticalAlignment="Top" Width="376" />

4. Declararemos una variable privada del tipo CaptureSource quien almacenara las entrada de audio y video:

        private CaptureSource _cs = new CaptureSource();

5. Nos ubicaremos en el constructor del formulario (UserControl) y escribiremos los siguientes eventos:

        public MainPage()
        {
            InitializeComponent();
            btnCapturar.Click += new RoutedEventHandler(btnCapturar_Click);
            btnStop.Click+=new RoutedEventHandler(btnStop_Click);
        }

6. Escribiremos en los eventos del Boton Capturar y el Stop las siguientes lineas:

        void btnCapturar_Click(object sender, RoutedEventArgs e)
        {
            //Validamos si permite captura de video y audio
            if (!CaptureDeviceConfiguration.AllowedDeviceAccess )
            {
                CaptureDeviceConfiguration.RequestDeviceAccess();
            }

            //Si la validacion fue efectiva podemos asignarle a la variable
            //antes declara (_cs) el video y el audio
            if (CaptureDeviceConfiguration.RequestDeviceAccess())
            {
                System.Windows.Media.VideoCaptureDevice videodev;
                System.Windows.Media.AudioCaptureDevice audiodev;
                videodev = CaptureDeviceConfiguration.GetDefaultVideoCaptureDevice();
                audiodev = CaptureDeviceConfiguration.GetDefaultAudioCaptureDevice();
                if (videodev != null && audiodev!=null)
                {
                    _cs.AudioCaptureDevice = audiodev;
                    _cs.VideoCaptureDevice = videodev;
                    VideoBrush vb = new VideoBrush();
                    vb.SetSource(_cs);
                    _cs.Start();
                    grid1.Background = vb;
               }
            }
        }

        private void btnStop_Click(object sender, RoutedEventArgs e)
        {
            //se paraliza la visualizacion del video y el audio
            _cs.Stop();
        }

Con esto podemos porbar nuestra aplicacion… espero que le sea de ayuda… aqui les dejo el codigo XAML completo y el Codigo en C# del ejemplo mostrado:

XAML:

<UserControl x:Class="DemoWebCam.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" Background="White">
        <Button Content="Iniciar Captura" Height="26" HorizontalAlignment="Left" Margin="64,47,0,0" Name="btnCapturar" VerticalAlignment="Top" Width="120" />
        <Button Content="Paralizar Captura" Height="26" HorizontalAlignment="Left" Margin="209,47,0,0" Name="btnStop" VerticalAlignment="Top" Width="122" Click="btnStop_Click" />
        <Grid Height="166" HorizontalAlignment="Left" Margin="12,122,0,0" Name="grid1" VerticalAlignment="Top" Width="376" />
        
    </Grid>
</UserControl>

C#:

using System;
using System.Collections.Generic;
using System.Linq;
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 System.Collections.ObjectModel;
using System.Windows.Media.Imaging;

namespace DemoWebCam
{
    public partial class MainPage : UserControl
    {
        ObservableCollection<WriteableBitmap> _images = new ObservableCollection<WriteableBitmap>();
        private CaptureSource _cs = new CaptureSource();      

        public MainPage()
        {
            InitializeComponent();
            btnCapturar.Click += new RoutedEventHandler(btnCapturar_Click);
            btnStop.Click+=new RoutedEventHandler(btnStop_Click);
        }

        void btnCapturar_Click(object sender, RoutedEventArgs e)
        {
            //Validamos si permite captura de video y audio
            if (!CaptureDeviceConfiguration.AllowedDeviceAccess )
            {
                CaptureDeviceConfiguration.RequestDeviceAccess();
            }

            //Si la validacion fue efectiva podemos asignarle a la variable
            //antes declara (_cs) el video y el audio
            if (CaptureDeviceConfiguration.RequestDeviceAccess())
            {
                System.Windows.Media.VideoCaptureDevice videodev;
                System.Windows.Media.AudioCaptureDevice audiodev;
                videodev = CaptureDeviceConfiguration.GetDefaultVideoCaptureDevice();
                audiodev = CaptureDeviceConfiguration.GetDefaultAudioCaptureDevice();
                if (videodev != null && audiodev!=null)
                {
                    _cs.AudioCaptureDevice = audiodev;
                    _cs.VideoCaptureDevice = videodev;
                    VideoBrush vb = new VideoBrush();
                    vb.SetSource(_cs);
                    _cs.Start();
                    grid1.Background = vb;
               }
            }
        }

        private void btnStop_Click(object sender, RoutedEventArgs e)
        {
            //se paraliza la visualizacion del video y el audio
            _cs.Stop();
        }
    }
}

Publicado 1/12/2009 15:00 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,

Tips Arrastrar y Soltar (Drap and Drop) con SilverLight 4

Hola a todos..

Como ya sabrán hace poco anunciaron la beta de SilverLight 4, y con eso han surgido muchos demos yo no dejare de ser uno de los que muestre un demo :) así que les explicare que como hacer el Drap and Drop (Arrastrar y Soltar) en nuestras aplicaciones de SilverLight.

1. La definición explicada por Rodrigo Díaz Concha en su pagina esta mas que genial así que hago referencia a su post: http://rdiazconcha.com/?p=487

Silverlight 4 cuenta con soporte de arrastrar uno o varios archivos desde afuera de la aplicación hacia adentro de ella y soltarlo(s) para poder leer su información y contenido.  Esta característica nos permite como desarrolladores crear mejores Experiencias para los Usuarios ya que evitan el número de cajas de diálogo y clics para abrir o leer un archivo o conjunto de archivos.

2. Abrimos nuestro Visual Studio 2010 Beta2 (el que estoy usando para esta explicación) y creamos una Aplicación SilverLight y le llamaremos Drap_and_Drop

 

Entra en Tips Arrastrar y Soltar (Drap and Drop) con SilverLight 4 para ver el resto de la publicacion con imagenes y codigo..!!

Publicado 27/11/2009 16:18 por Alexander Jimenez | con no comments

Archivado en: ,,,,,

Tips, Tutorial y Truco: Boton con Efecto de Vidrio (Button Glass) en SilverLight

Hola a todos,

Me gustaría compartir este pequeño tutorial de como obtener un botón con efecto de vidrio dándole una vistosidad bastante interesante a la interfaz de usuario.

Para ello me base en un articulo publicado en: http://www.sixin.nl/antoni-dol-blog/09-11-15/Silverlight_Style_GlassBorderStyle.aspx

Y el Código de Ejemplo de este Tutorial esta Aquí y la pagina origina esta Aqui:

Así que ni mas ni mas el truco:

1. Creamos nuestro proyecto en Visual Studio o en Expression Blend (Donde mas guste yo estoy usando Blend a la final el código estará en XAML)

2. Agregamos un botón a nuestro UserControl.

Captura1

3. Le daremos Botón derecho del mouse sobre el control Button, para seleccionar la opción Editar una Copia. Este paso es si utilizan Expression Blend, para los que usan Visual Studio 2008 todavía no se desesperen ya les pasare el XAML a pegar en su UserControl recuerden que VS2008 no soporta el Diseño de SilverLight en VS 2010 es la misma secuencia que Blend :)

Captura2

4. Saldra una Ventana como esta donde le daremos el nombre a la plantilla y ubicacion a guardar, en nuestro caso sera dentro del mismo UserControl.

Captura3

5. Este será el Código que veremos al darle aceptar y ubicarnos en el XAML:

Captura4

6. De ese código a mostrar cambiaremos el seteo de Propiedad del BackGround, Padding, Borderthickness, BorderBrush y agregaremos un Effects:

BackGround:

        <Style x:Key="ButtonGlass" TargetType="Button">
            <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.75,1" StartPoint="0.25,0"> 
                    <GradientStop Color="#33FFFFFF" Offset="0"/> 
                    <GradientStop Color="#C0FFFFFF" Offset="0.287"/> 
                    <GradientStop Color="#4011322D" Offset="0.683"/> 
                    <GradientStop Color="#33FFFFFF" Offset="1"/> 
                </LinearGradientBrush> 
            </Setter.Value>
        </Setter>

Padding y Borderthickness :

            <Setter Property="Padding" Value="5"/>
            <Setter Property="BorderThickness" Value="5"/>

BorderBrush:

           <Setter Property="BorderBrush">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
                        <GradientStop Color="#5811322D" Offset="0"/> 
                        <GradientStop Color="#3EFFFFFF" Offset="0.25"/> 
                        <GradientStop Color="#FFFFFFFF" Offset="0.5"/> 
                        <GradientStop Color="#3EFFFFFF" Offset="0.75"/> 
                        <GradientStop Color="#BFFFFFFF" Offset="1"/> 
                    </LinearGradientBrush> 
                </Setter.Value>
            </Setter>

Effects:

            <Setter Property="Effect"> 
                <Setter.Value> 
                    <DropShadowEffect BlurRadius="3" ShadowDepth="3" Opacity="0.5"/> 
                </Setter.Value> 
               </Setter>

Ahora al boton sencillamente le aplicaremos este template en la propiedad Style le daremos el nombre del Template (ejemplo Style='{StaticResource ButtonGlass}'):

                   <Button Height="54" HorizontalAlignment="Left" Margin="119,0,0,137" 
                             VerticalAlignment="Bottom" Width="169" Content="Button" 
                             Style='{StaticResource ButtonGlass}'/>

Con esto tenemos lo siguiente:

image

Aquí les dejo el Código Completo del XAML (UserControl y Template del Boton):

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="DemoGlassButton.MainPage"
    Width="640" Height="480">
    <UserControl.Resources>
        <Style x:Key="ButtonGlass" TargetType="Button">
            <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.75,1" StartPoint="0.25,0"> 
                    <GradientStop Color="#33FFFFFF" Offset="0"/> 
                    <GradientStop Color="#C0FFFFFF" Offset="0.287"/> 
                    <GradientStop Color="#4011322D" Offset="0.683"/> 
                    <GradientStop Color="#33FFFFFF" Offset="1"/> 
                </LinearGradientBrush> 
            </Setter.Value>
        </Setter>
            <Setter Property="Foreground" Value="#FF000000"/>
            <Setter Property="Padding" Value="5"/>
            <Setter Property="BorderThickness" Value="5"/>
            <Setter Property="BorderBrush">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
                        <GradientStop Color="#5811322D" Offset="0"/> 
                        <GradientStop Color="#3EFFFFFF" Offset="0.25"/> 
                        <GradientStop Color="#FFFFFFFF" Offset="0.5"/> 
                        <GradientStop Color="#3EFFFFFF" Offset="0.75"/> 
                        <GradientStop Color="#BFFFFFFF" Offset="1"/> 
                    </LinearGradientBrush> 
                </Setter.Value>
            </Setter>
            <Setter Property="Effect"> 
                <Setter.Value> 
                    <DropShadowEffect BlurRadius="3" ShadowDepth="3" Opacity="0.5"/> 
                </Setter.Value> 
               </Setter> 

            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="BackgroundAnimation" Storyboard.TargetProperty="Opacity">
                                                <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#F2FFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#CCFFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#7FFFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#FF6DBDD1"/>
                                            </ColorAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="BackgroundAnimation" Storyboard.TargetProperty="Opacity">
                                                <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#D8FFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#C6FFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#8CFFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
                                                <SplineColorKeyFrame KeyTime="0" Value="#3FFFFFFF"/>
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
                                                <SplineDoubleKeyFrame KeyTime="0" Value=".55"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity">
                                                <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unfocused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="Background" Background="White" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3">
                                <Grid Margin="1" Background="{TemplateBinding Background}">
                                    <Border x:Name="BackgroundAnimation" Opacity="0" Background="#FF448DCA"/>
                                    <Rectangle x:Name="BackgroundGradient">
                                        <Rectangle.Fill>
                                            <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0">
                                                <GradientStop Color="#FFFFFFFF" Offset="0"/>
                                                <GradientStop Color="#F9FFFFFF" Offset="0.375"/>
                                                <GradientStop Color="#E5FFFFFF" Offset="0.625"/>
                                                <GradientStop Color="#C6FFFFFF" Offset="1"/>
                                            </LinearGradientBrush>
                                        </Rectangle.Fill>
                                    </Rectangle>
                                </Grid>
                            </Border>
                            <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                            <Rectangle x:Name="DisabledVisualElement" Fill="#FFFFFFFF" RadiusX="3" RadiusY="3" IsHitTestVisible="false" Opacity="0"/>
                            <Rectangle x:Name="FocusVisualElement" Stroke="#FF6DBDD1" StrokeThickness="1" RadiusX="2" RadiusY="2" Margin="1" IsHitTestVisible="false" Opacity="0"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="#FFFCFAFA">
        <Button Height="47" Margin="230,158,287,0" VerticalAlignment="Top" Content="Button" Style='{StaticResource ButtonGlass}'/>
    </Grid>
</UserControl>

Publicado 25/11/2009 11:24 por Alexander Jimenez | 1 comment(s)

Archivado en: ,,,,,,,

SilverLight 4 Beta: Nuevas Caracteristicas

Hola,

Gracias al Twitter logre enterarme de la salida de la beta de SilverLight 4 (lo hicieron publico en la Conferencia de desarrolladores de Professional de Microsoft (PDC), donde Scott Guthrie dio la gran noticia) cosa que me llama full la atención ya que incorpora una serie de funcionalidades súper excelentes que empezare a nombrar a continuación:

General

  1. Soporte de impresión
  2. Diseño implícita
  3. Soporte WebCam/micrófono
  4. Control de RichTextArea
  5. Eventos de botón derecho del ratón
  6. Acceso al Portapapeles
  7. Soporte UDP/multicast en red
  8. Hospedaje de HTML dentro de Silverlight 4
  9. Brocha HTML
  10. Acceso a Archivos Locales
  11. ViewBox
  12. Soporte para Google Chrome

Fuera de las mejoras de explorador

  1. Elevación de confianza  del control WebBrowser la ventana de notificación de Windows (por ejemplo, Outlook popup)
  2. Integración de COM

Mejoras de enlace de datos

  1. Enlace a DependencyObjects (utilizado para ser FrameworkElement)
  2. Extensión de marcado de StringFormat
  3. Extensión de marcado de TargetNullValue
  4. Extensión de marcado de FallbackValue
  5. Soporte para IDataErrorInfo y INotifyDataErrorInfo nueva para la generación de informes de errores de validación.
  6. Enlace a la cadena indizadores
  7. Soporte de GroupDescription en CollectionViewSource para la agrupación simplificada.

Quieres saber un poquito mas entra en: http://bit.ly/3UdQzS

Publicado 18/11/2009 14:49 por Alexander Jimenez | con no comments

Archivado en: ,,,,,,,

Expression Design: Efecto de humo girando

Bueno este post es motivado a un articulo encontrado en la siguiente dirección: http://bit.ly/1JXgpX y como se encuentra en ingles me tome el atrevimiento de crear un articulo nuevo basándome  en la explicación de Timmy Kokke, en cortas palabras colocar un poco mas a nuestro lenguaje :)

Hacer el efecto de humo girando en lo personal debía utilizar un software que generara 3D por lo que aprender a usarlo me tomo un poquito de tiempo y el cual no le di importancia después, por ello al ver el articulo me di cuenta que en una herramienta al cual muchas personas me han dicho que le falta para llegar hacer como las herramientas de Diseño profesionales ya conocidas pues aun trato de rescatar esa imagen al menos en mi país :) debido a que cada ves encuentro mas artículos y mas documentación que demuestran la potencia de Expression Design.

Sin mas bla bla bla y puedes entrar en esta dirección http://bit.ly/1X3iJB y ver como se logro hacer las siguientes imágenes:

 

 

image     Efectos

Espero que les guste.

Publicado 22/10/2009 13:58 por Alexander Jimenez | con no comments

Archivado en: ,,,,

Más artículos < Página anterior - Página siguiente >