【サンプル満載】C#で動画再生しようよ!(MediaElement)

当ページのリンクには広告が含まれています。

訳あって、動画再生中の画像をキャプチャしたかったので、簡単な動画再生アプリをC#で作ってみました。

C#で動画再生(メディアプレーヤー)機能を搭載したプログラムを開発する場合、マイクロソフト標準の MediaElement というコントロールを使います。

今回紹介するサンプルプログラムは MediaElement の使い方を紹介することが目的なので、本来メディアプレーヤーが備えておくべき機能や制御は省略しており、かつ System.Windows.Form などの参照設定や、NuGetでインストールが必要なライブラリは使っていません。

それゆえ、ソースをコピーしてお使いのVisual Studio 2022 に張り付けて頂ければ、そのまま動作すると思います。

ちなみに、C#で動画再生を行う方法については多くの方が解説されていますが、本記事では基本的な操作である「再生」、「停止」、「再生位置の変更」だけでなく、他ではあまり触れられていない「再生スピード」、「ボリューム」、「画像キャプチャ」についても解説しています。

また、本記事で紹介するサンプルプログラムについては、Visual Studio 2022 のソリューションファイルとして一式をダウンロードできるようにしています。

是非参考にしてみてください。

目次

サンプルプログラムの画面

本記事では、下記のプログラムを前提に説明を行っています。

MediaElement の設定方法

C# で動画ファイルを再生する場合、マイクロソフト標準の MediaElement というコントロールを使用します。

このコントロールは、MP4、AVI、WMV、MKVなど多くのフォーマットに対応し、4K、8KのVR動画さえ再生することが可能です。

また、任意の位置からの再生、ボリュームや再生スピードの制御など、メディアプレーヤーとして必要な機能が揃っています。

利用するのは簡単で、Visual Studio のレイアウトエディタからコントロールをドラッグ&ドロップするか、XAMLに直接 <MediaElement ~> と記述するだけで使えるようになります。

この時、MediaElementの LoadedBehavior を “Manual” に設定しておかないとプログラムから制御が出来ませんので、XAMLに必ず記述して下さい。

MediaElement の使い方

詳しくは下記のマイクロソフトの公式ページに記載されている内容を元に分かりやすく説明しています。

あわせて読みたい
方法: MediaElement (再生、一時停止、停止、ボリューム、および速度) を制御する - WPF .NET Framework Windows Presentation Foundation (WPF) でメディアの再生を制御します。 開始、停止、一時停止、前後へのスキップ、ボリュームと速度の調整を行います。

基本機能

MediaElement でよく使うメソッドとプロパティは次の通りです。

機能種類名前説明
動画ファイルの指定プロパティSource再生したい動画を以下の様に指定します。
 Source = new Uri(動画ファイルのパス)
動画の再生メソッドStart() 動画を再生します。
動画の停止メソッドStop()動画を停止します。Stop()の後にStart()を呼ぶと、
動画の先頭から再生されます。
動画の一時停止メソッドPause()一時停止します。Pause()の後にStart()を呼ぶと、
動画の続きを再生します。
画面を閉じる
(画面をクリアする)
メソッドClose()画面を閉じる=画面の表示をクリアします。Stop()で再生は
停止しますが、画面表示が残ったままになるため
Close()で表示をクリアします。
再生位置の移動プロパティPosition再生位置をミリ秒で指定します。
 Position=new TimeSpan(0, 0, 0, 0, 再生位置)
動画の途中に移動したい場合
→ Position = new TimeSpan(0, 0, 0, 0, 0)
8分後に指定したい場合(8*60*1000=3600000)
→Position = new TimeSpan(0, 0, 0, 0, 3600000)
現在の再生位置を取得する場合、
→Position.ToString()
ちなみに、hh:mm:ss.xxxxxx の形式で返ってくるため
秒単位に丸めたい場合は Substring(0,8)を付けます。
→Position.ToString().Substring(0,8)
音量の設定プロパティVolume音量を0~1までの実数を設定します。(例 0.225412)
0~100 で指定したい場合、Volume から受け取る時は
100を掛け、Volumeに設定する場合は100で割ります。
再生速度の設定プロパティSpeedRatio再生速度を0~10までの実数で設定します。(例 1.228123)

今回は MediaElement に uxVideoPlayer という名前を付けています。

下記のサンプルは、 uxVideoPlayerに対してプロパティの設定とメソッドの呼び出しを行う具体例です。本格的なメディアプレーヤーアプリを作るには、考慮すべき点が多々ありますが、非常に簡単な操作で動画再生を制御できることが、お分かりいただけたかと思います。

動画のキャプチャについて

再生中の画面をファイルに保存するのは少々煩雑なので、下記の通り関数化しました。このままコピペしてお使いください。

応用例(簡易メディアプレーヤー)

今回作成したサンプルプログラムの画面を説明しておきます。

再生位置、ボリューム、再生速度はスライダーでの指定が可能で、再生に合わせた時刻表示やスライダーバーの位置更新についもて、タイマー割込みを使って実現しました。

また、画面キャプチャの出力先も、MyPicture フォルダ固定になっています。フォルダ選択ダイアログを使う場合、System.Window.Forms の参照設定が必要になるため、これも省略しています。

この辺は、必要に応じて修正して頂ければと思います。

プロジェクト一式のダウンロード

Visual Studio 2022でビルドできるソリューションファイル一式は以下からダウンロードできます。

ソースコード

まず、XAMLのソースコードです。

次に、C#側のソースコードです。

補足説明

全体的にそれほど難しくはないと思いますが、スライダーによる再生位置の指定と、再生中の再生時刻表示について簡単に細くしておきます。

スライダーによる再生位置の指定

再生位置のスライダーを動かすとValueChangedイベントが発生するので、そこで Position プロパティにスライダーの Value を設定してあげれば、スライダーの位置に合わせた動画の再生が可能になります。

しかし、実際にはスライダーを少し動かすだけで数十回のイベントが発生してしまうため、MediaElement の再生が後追いになってしまいます。その結果、スライダーの操作を止めてから秒間コマ送り状態が続き、ようやく指定位置からの再生が開始されます。

本来は、スライダーを動かしている間は再生時刻だけが変化し、スライダーの操作を止めた時点でその再生時刻から再生するという挙動が望ましいので、その実現方法として以下の処理を行いました。

  • スライダーのMouseDown と MouseUpイベントを使って、スライダー操作中(ドラッグ中)か否かを判断できるようにする(_isSliderDraggingによるフラグ制御)
  • ValueChanged発生時、スライダー操作中の時は、スライダーの位置に合わせて再生時刻を更新する。
  • スライダーの MouseUpイベントでスライダー操作が完了したと判断し、そこでスライダーのValueを Position プロパティにセット(スライダーに合わせて再生位置を変更)する。

再生中の再生時刻表示

再生中の時刻表示はタイマー割込みを使いました。1秒ごとにタイマー割込みを発生させ、その中で MediaElementの Position メソッドから再生時刻を取得、タイムラインスライダーのValue に値をセットしています。

この時、スライダー操作中はタイマーによる再生時刻の表示が行なわれないよう、_isSliderDragging を使って制御しています。

まとめ

今回はC#とWPFによるWindowsアプリにおいて、MediaElement コントロールを使った動画再生の方法と、再生中の画像のキャプチャについて解説しました。

MediaElement はマイクロソフト標準のコントロールであり、様々な動画フォーマットに対応しており、8K動画やVR動画もちゃんと再生してくれる優れものです。

動画の再生、停止、一時停止の他、音量、再生スピード、再生位置の指定など、メディアプレーヤーのアプリを自作するために必要な機能が揃っています。

本格的なメディアプレーヤーを作成するには、ドラッグ&ドロップによるファイル指定やプレイリストの編集機能など、様々な機能が必要になりますが、簡易的に動画をちょこっと再生させたい場合などは重宝します。

今回紹介したサンプルプログラムは中途半端になってはいますが、必要な機能を盛り込みやすくなっていると思いますので、是非自分用のオリジナルメディアプレーヤー向けに改造して、役立てていただければと思います。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

目次