Reproductor Zune en WPF (Just for fun)

Hola, les coloco un ejemplo solo de distracción de como hacer un reproductor Zune, aún no esta terminado, ojalá ustedes puedan hacerle más cosas.

1.- Creamos un nuevo proyecto en Windows Presentation Foundation, y abranlo con Expression Blend 2.

Vayamos al lado de Código XAML y coloquen este código, que permitirá hacer invisible el formulario y así poder trabajar en nuestro proyecto.

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="ZunePost.Window1"
    x:Name="Window"
    Title="miZune"
    Width="454"
    Height="402"
    AllowDrop="True"
    Background="{x:Null}"
    AllowsTransparency="True"
    WindowStyle="None"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Focusable="False"
    MouseDown="Window_MouseDown" xmlns:d="http://schemas.microsoft.com/expression/blend/2008">

    <Grid x:Name="LayoutRoot"/>
</Window>

2.- Descarga la siguiente imagen zune.png

Colocalo en el formulario y crea un rectangulo encima de el.

3.- Coloque una figura con un gradiente y un alfa de 30%.

4.-Coloque el control MediaElement y eliga un video desde un origen.

 

5.- Ahora vamos a rediseñar los botones, colocamos una elipse y la convertimos en botón, le colocamos un nombre y le damos en new Resource Dictionary colocamos otro nombre y damos aceptar.

6.- Apliquen su propio estilo al botón, en los anteriores post he explicado como hacerlo

 

7.- Ya que tengamos mas o menos este diseño, nos vamos a Visual Studio 2008.

Ahora bien, en visual studio seleccionamos el MediaElement y colocamos un nombre y la propiedad LoadedBehavior = Manual.

        <MediaElement x:Name="miVideoPlayer" LoadedBehavior="Manual" Margin="24,26.815,18.5,115.042" Source="Moviegears.wmv"/>

Ahora colocamos un nombre y un evento clic a cada botón.

        <Button x:Name="btn01" Click="btn01_Click"  HorizontalAlignment="Left" Margin="24,0,0,57.195" Style="{DynamicResource btn01}" VerticalAlignment="Bottom" Width="35.978" Height="32.691" Content="Button" Opacity="0.5"/>

8.- Nos vamos al código de este formulario.

En donde declaro una variable de tipo boolean para el play y pause, además hago posible que el formulario pueda ser arrastrado con el mouse, además de configurar los botones.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace ZunePost
{

    public partial class Window1 : Window
    {
             Boolean isPlaying = false;
        public Window1()
        {
            this.InitializeComponent();
            miVideoPlayer.Play();
        }

        private void btn01_Click(object sender, RoutedEventArgs e)
        {
                 this.miVideoPlayer.Stop();
        }

        private void btn02_Click(object sender, RoutedEventArgs e)
        {
            if (isPlaying)
            {
                this.miVideoPlayer.Pause();
                isPlaying = false;
            }
            else
            {
                this.miVideoPlayer.Play();
                isPlaying = true;
            }
        }

        private void Window_MouseDown(object sender, MouseButtonEventArgs e)
        {
         try {
            this.DragMove();
                }catch(Exception ex){}
        }
    }
}

9.- Visualizamos el formulario en tiempo de ejecución, y Listo =)

Ustedes pueden agregarle para cambiar y escoger dentro de una lista de videos, y propiedades para cerrar minimizar, etc…

 

Descarga el código de ejemplo aquí ZunePost.zip

Edison Daniel García Chiñas
Microsoft Student Partner | México