PDA

Ver la versión completa : Como ver un video con MediaElement




Shell Root
11-03-2009, 07:34 PM
Como ver un video con MediaElement

En este ejemplo veremos de forma sencilla como visualizar un video en una aplicación WPF.
Creamos un WPF Aplication.
http://www.onglasses.net/wwwroot/UpFiles/Usuariosjaviryma/w1.jpg

Una vez creada agregamos el siguiente código.

<MediaElement Height="120" Name="mediaElement1" Width="160" Source="Lake.wmv" LoadedBehavior="Manual" FlowDirection="RightToLeft" Opacity="0.6">
</MediaElement>

Notese que en source se escribe el path del video, también se puede asignar un opacity y la dirección del video.

También se le puede asignar ángulos de inclinación.

<MediaElement.RenderTransform>
<TransformGroup>
<RotateTransform Angle="20">
</RotateTransform>
</TransformGroup>
</MediaElement.RenderTransform>

Y podemos accionarlos con algunos eventos.

void play(object sender, MouseButtonEventArgs args)
{
this.MediaElement1.Play();
this.LoadControls();
}
void pause(object sender, MouseButtonEventArgs args)
{
this.MediaElement1.Pause();
}
void stop(object sender, MouseButtonEventArgs args)
{
this.MediaElement1.Stop();
}
private void CambioVolumen(object sender, RoutedPropertyChangedEventArgs<double> args)
{
this.MediaElement1.Volume = (double)this.sldVolumen.Value;
}
private void CambioVelocidad(object sender, RoutedPropertyChangedEventArgs<double> args)
{
this.MediaElement1.SpeedRatio = (double)this.sldVelocidad.Value;
}
private void Element_MediaEnded(object sender, EventArgs e)
{
this.MediaElement1.Stop();
}
void LoadControls()
{
this.MediaElement1.Volume = (double)this.sldVolumen.Value;
this.MediaElement1.SpeedRatio = (double)this.sldVelocidad.Value;
}

Y en el xaml agregamos un panel para controlar algunas propiedades y acciones del video.

<StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
<Image MouseDown="play" Source="play.jpg" />
<Image MouseDown="pause" Source="pause.jpg"/>
<Image MouseDown="stop" Source="stop.jpg" />
<TextBlock Foreground="Black" VerticalAlignment="Center" >Volumen</TextBlock>
<Slider Name="sldVolumen" VerticalAlignment="Center" ValueChanged="CambioVolumen" Value="0.5" Width="50"/>

<TextBlock Foreground="Black" VerticalAlignment="Center">Velocidad</TextBlock>
<Slider Name="sldVelocidad" VerticalAlignment="Center" ValueChanged="CambioVelocidad" Value="1" Width="50" />

</StackPanel>

http://www.onglasses.net/wwwroot/UpFiles/Usuariosjaviryma/w3.jpg

Codigo Completo:

//El código XAML completo
<Window x:Class="Wpf3.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="308" Width="563">
<StackPanel>
<MediaElement Height="209" Name="MediaElement1" LoadedBehavior="Manual" Width="193" Source="Lake.wmv" FlowDirection="RightToLeft" Opacity="0.6">
<MediaElement.RenderTransform>
<TransformGroup>
<RotateTransform Angle="20">
</RotateTransform>
</TransformGroup>
</MediaElement.RenderTransform>
</MediaElement>
<StackPanel HorizontalAlignment="Center" Orientation="Horizontal">

<Image MouseDown="play" Source="play.jpg" />
<Image MouseDown="pause" Source="pause.jpg"/>
<Image MouseDown="stop" Source="stop.jpg" />
<TextBlock Foreground="Black" VerticalAlignment="Center">Volumen</TextBlock>
<Slider Name="sldVolumen" VerticalAlignment="Center" ValueChanged="CambioVolumen" Value="0.5" Width="50"/>

<TextBlock Foreground="Black" VerticalAlignment="Center">Velocidad</TextBlock>
<Slider Name="sldVelocidad" VerticalAlignment="Center" ValueChanged="CambioVelocidad" Value="1" Width="50" />

</StackPanel>

</StackPanel>

</Window>

Javier Vera