WPF 多媒体MediaElement 的使用(一)

news/2024/10/30 11:31:23/

本章讲述MediaElement的简单使用:

WPF 中对于多媒体的支持非常完整,可以使用MediaElement 为应用程序添加媒体播放控件,以完成播放音频、视频功能。MediaElement 属于UIElement,同时也支持鼠标及键盘的操作。

想以交互方式停止、暂停和播放媒体,要将MediaElement 的 LoadedBehavior 属性设置为 Manual 。

界面布局设计

<Grid><Grid.RowDefinitions><RowDefinition Height="*"/><RowDefinition Height="auto"/></Grid.RowDefinitions><Border BorderThickness="1" BorderBrush="LightBlue" MouseEnter="Border_MouseEnter" MouseLeave="Border_MouseLeave" ><Grid><Image Source="/MediaElement_Demo;component/bgimage.png" Stretch="Fill" /><MediaElement x:Name="mediaElement" Margin="1" LoadedBehavior="Manual" MediaOpened="videoMedia_MediaOpened"></MediaElement><TextBlock x:Name="pathStr" Margin="5 10" FontSize="15" FontWeight="Black" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Bottom" Foreground="White" Visibility="Collapsed"/></Grid></Border><Grid Grid.Row="1" Margin="0 10 0 20"><Grid.RowDefinitions><RowDefinition Height="auto"/><RowDefinition Height="*"/></Grid.RowDefinitions><Slider x:Name="slid" Margin="0 0 0 0" Height="20" HorizontalAlignment="Stretch" VerticalAlignment="Center" IsSnapToTickEnabled="True"
IsMoveToPointEnabled="True" PreviewMouseLeftButtonUp="slid_PreviewMouseLeftButtonUp"></Slider><TextBlock x:Name="playTime" Grid.Row="1" Margin="0 0" HorizontalAlignment="Left" VerticalAlignment="Top"/><TextBlock x:Name="totalTime" Grid.Row="1" Margin="0 0" HorizontalAlignment="Right" TextAlignment="Right" VerticalAlignment="Top"/><StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center"><Button Margin="5 0" Height="30" Width="80" Content="打 开" Click="OpenFileClick"/><Button Margin="5 0" Height="30" Width="80" Content="停 止"  Click="StopPlayClick"/><Button Margin="5 0" Height="30" Width="80" Content="快 退"  Click="FastBackClick"/><Button x:Name="suspenBtn" Margin="10 0" Height="30" Width="80" Content="暂停"  Click="SuspendPlayClick"/><Button Margin="5 0" Height="30" Width="80" Content="快 进"  Click="FastBorwardClick"/><Button Margin="5 0" Height="30" Width="80" Content="速度+"  Click="SpeedAddClick"/><Button Margin="5 0" Height="30" Width="80" Content="音量+"  Click="VolumeAddClick"/></StackPanel></Grid>
</Grid>

布局运行图

打开视频文件,选取视频文件

    private void OpenFileClick(object sender, RoutedEventArgs e){OpenFileDialog fileDialog = new OpenFileDialog();fileDialog.Filter = "MP4 File|*.mp4|MP3 File|*.mp3|AVI Files|*.avi";fileDialog.ValidateNames = true;fileDialog.CheckPathExists = true;fileDialog.CheckFileExists = true;if (fileDialog.ShowDialog() == true){this.mediaElement.Stop();this.suspenBtn.Content = "播 放";this.slid.Value = 0;this.playTime.Text = "00:00:00";this.mediaElement.Source = null;this.mediaElement.Position = new TimeSpan(0, 0, 0);this.mediaElement.Close();this.pathStr.Text = "视频地址:" + fileDialog.FileName;this.mediaElement.Source = new Uri(fileDialog.FileName, UriKind.Relative);this.mediaElement.ScrubbingEnabled = true;SuspendPlayClick(null, null);}}

需要获取视频的参数,比如播放时长等,可以使用MediaOpened事件(当完成媒体加载时发生)

    private void videoMedia_MediaOpened(object sender, RoutedEventArgs e){this.slid.Maximum = (int)this.mediaElement.NaturalDuration.TimeSpan.TotalSeconds;TotalTime = this.mediaElement.NaturalDuration.TimeSpan;this.totalTime.Text = TotalTime.ToString(@"hh\:mm\:ss");}

播放/暂停

    private void SuspendPlayClick(object sender, RoutedEventArgs e){if (this.suspenBtn.Content.ToString() == "播 放"){this.suspenBtn.Content = "暂 停";this.mediaElement.Play();speedTimer.Start();}else{this.suspenBtn.Content = "播 放";this.mediaElement.Pause();speedTimer.Stop();}}

快进

    private void FastBorwardClick(object sender, RoutedEventArgs e){if (this.mediaElement != null){this.mediaElement.Position = this.mediaElement.Position + TimeSpan.FromSeconds(10);this.slid.Value = (int)this.mediaElement.Position.TotalSeconds;this.playTime.Text = this.mediaElement.Position.ToString(@"hh\:mm\:ss");}}

快退

    private void FastBackClick(object sender, RoutedEventArgs e){if (this.mediaElement != null){this.mediaElement.Position = this.mediaElement.Position - TimeSpan.FromSeconds(10);this.slid.Value = (int)this.mediaElement.Position.TotalSeconds;this.playTime.Text = this.mediaElement.Position.ToString(@"hh\:mm\:ss");}}

停止

    private void StopPlayClick(object sender, RoutedEventArgs e){if (this.mediaElement != null){this.mediaElement.Stop();this.suspenBtn.Content = "播 放";this.mediaElement.Position = TimeSpan.FromTicks(1);this.slid.Value = 0; }}

设置媒体的速率,默认值为1,大于1比正常播放快的速率

private void SpeedAddClick(object sender, RoutedEventArgs e)
{    this.mediaElement.SpeedRatio ++;
}

音量设置,在 0 与 1 之间的线性标尺上所表示的媒体音量。 默认值为 0.5

private void VolumeAddClick(object sender, RoutedEventArgs e)
{this.mediaElement.Volume += 0.1;
}

播放滑动条操作,点击滑块上任意区域,视频跳转到指定时间开始播放

    private void slid_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e){if (this.mediaElement != null && slid != null){int value = (int)this.slid.Value;TimeSpan span = new TimeSpan(0, 0, value);this.mediaElement.Position = span;this.playTime.Text = this.mediaElement.Position.ToString(@"hh\:mm\:ss");}}

播放滑动条进度值刷新,这里用定时器实现刷新;

DispatcherTimer speedTimer = null;
private void MainWindow_Loaded(object sender, RoutedEventArgs e)
{speedTimer = new DispatcherTimer();speedTimer.Interval = TimeSpan.FromSeconds(1);speedTimer.Tick += new EventHandler(speedTimer_tick);
}private void MainWindow_Unloaded(object sender, RoutedEventArgs e)
{speedTimer.Stop();
}

视频地址显示

private void Border_MouseLeave(object sender, MouseEventArgs e)
{this.pathStr.Visibility = Visibility.Collapsed;
}private void Border_MouseEnter(object sender, MouseEventArgs e)
{this.pathStr.Visibility = Visibility.Visible;
}

额外知识点,播放视频旋转

<MediaElement ><MediaElement.LayoutTransform><TransformGroup><RotateTransform Angle="90" /></TransformGroup></MediaElement.LayoutTransform>
</MediaElement>

好了,本章就讲述到这里吧,下一章讲述“使用media player MediaTimeline 来控制播放”


http://www.ppmy.cn/news/62607.html

相关文章

微信开发者工具实现代码加固

一&#xff1a;下载安装node.js node.js下载地址&#xff1a;下载 | Node.js 二&#xff1a;微信开发者工具安装代码加固拓展 1&#xff1a;开发者工具选择设置-》拓展设置 2:安装代码加固拓展 三&#xff1a;使用代码加固拓展实现核心密码加密 1&#xff1a;安装devtool-cod…

Docker consul的容器服务更新与发现

文章目录 一、Harbor概述1、什么是服务注册与发现2、什么是consul 二、consul 部署1、建立 Consul 服务2、查看集群信息3、通过 http api 获取集群信息 三、registrator服务器1、安装 Gliderlabs/Registrator2、测试服务发现功能是否正常3、验证 http 和 nginx 服务是否注册到 …

达成事务条件的实现原理

事务存在的意义&#xff1a;保证系统中的数据&#xff0c;都是符合预期的&#xff1b;相互关联的数据之间&#xff0c;不会产生矛盾 达成事务的条件 原子性&#xff1a;一个操作&#xff0c;要么同时成功、要么同时失败 隔离性&#xff1a;各业务&#xff0c;读写相互独立 持…

Qt Quick Image探秘:从底层原理到高级应用

目录标题 一、Qt Quick Image类简介 (Introduction to Qt Quick Image)1.1 Qt Quick概述 (Overview of Qt Quick)QML简介Qt Quick的优势 1.2 Image类的作用与特点 (Purpose and Features of Image)主要功能特点与优势 1.3 开发环境搭建 (Setting up the Development Environmen…

ChatGPT背后的打工人:你不干,有的是AI干

AI“出圈” 如今&#xff0c;数字技术发展速度惊人&#xff0c;AI提高了社会生产效率&#xff0c;更真切地冲击到原有的生产秩序。 年初AI技术的爆发&#xff0c;让国内看到了进一步降本增效的希望。 国内多家互联网企业相继推出类ChatGPT产品&#xff0c;复旦大学邱锡鹏教授…

今天面了一个来字节要求月薪23K,明显感觉他背了很多面试题...

最近有朋友去字节面试&#xff0c;面试前后进行了20天左右&#xff0c;包含4轮电话面试、1轮笔试、1轮主管视频面试、1轮hr视频面试。 据他所说&#xff0c;80%的人都会栽在第一轮面试&#xff0c;要不是他面试前做足准备&#xff0c;估计都坚持不完后面几轮面试。 其实&…

requestAnimationFrame 和 requestIdleCallback API

requestAnimationFrame window.requestAnimationFrame() 方法告诉浏览器您希望执行动画并请求浏览器在下一次重绘之前调用指定的函数来更新动画。该方法使用一个回调函数作为参数&#xff0c;这个回调函数会在浏览器重绘之前调用。 ⚠️ 注意&#xff1a;若您想要在下一次重绘…

C++ 类的继承与派生

目录 1、继承的概念 2、继承&#xff08;Inherit&#xff09; 3、继承方式 4、父子同名成员并存 5、虚函数&#xff08;virtual&#xff09; 6、纯虚函数 1、继承的概念 以李白为例 类1是类2的基类&#xff08;父类&#xff09;&#xff0c;类2是类3的基类&#xff08;父类…