媒體播放器Media player

媒體播放器可用來檢視及聆聽視訊和音訊。The media player is used to view and listen to video and audio. 媒體播放功能可以內嵌 (內嵌在頁面中或內嵌在一組其他的控制項中),或以專用的全螢幕檢視方式顯示。Media playback can be inline (embedded in a page or with a group of other controls) or in a dedicated full-screen view. 您可以修改播放器的按鈕集、變更控制列的背景,以及自行調整版面配置。You can modify the player's button set, change the background of the control bar, and arrange layouts as you see fit. 但請記住,使用者只想要一組基本的控制項 (播放/暫停、倒轉跳過、快轉跳過)。Just keep in mind that users expect a basic control set (play/pause, skip back, skip forward).

具有傳輸控制項的媒體播放器元素

重要 APIMediaPlayerElement 類別MediaTransportControls 類別Important APIs: MediaPlayerElement class, MediaTransportControls class

注意

MediaPlayerElement 只能在 Windows 10 版本 1607 及以上的版本中取得。MediaPlayerElement is only available in Windows 10, version 1607 and up. 如果您是針對舊版 Windows 10 開發 app,便必須改為使用 MediaElementIf you are developing an app for an earlier version of Windows 10 you will need to use MediaElement instead. 此頁面上的所有建議也適用於 MediaElement。All of the recommendations on this page apply to MediaElement as well.

這是正確的控制項嗎?Is this the right control?

當您想要在您的應用程式中播放音訊或視訊時,請使用媒體播放器。Use a media player when you want to play audio or video in your app. 若要顯示影像的集合,請使用翻轉檢視To display a collection of images, use a Flip view.

範例Examples

XAML 控制項庫XAML Controls Gallery
XAML controls gallery

如果您已安裝 XAML 控制項庫應用程式,請按一下這裡以開啟應用程式,並查看 MediaPlayerElement or MediaPlayer 運作情形。If you have the XAML Controls Gallery app installed, click here to open the app and see the MediaPlayerElement or MediaPlayer in action.

Windows 10 入門 app 中的媒體播放器。A media player in the Windows 10 Get Started app.

Windows 10 入門 app 中的媒體元素。

建立媒體播放器Create a media player

在 XAML 中建立 MediaPlayerElement 物件,並將 Source 設定成指向音訊或視訊檔案的 MediaSource,來將媒體到新增您的 app。Add media to your app by creating a MediaPlayerElement object in XAML and set the Source to a MediaSource that points to an audio or video file.

此 XAML 會建立 MediaPlayerElement 並將其 Source 屬性設定成指向 app 的本機視訊檔案 URI。This XAML creates a MediaPlayerElement and sets its Source property to the URI of a video file that's local to the app. MediaPlayerElement 會在頁面載入之後開始播放。The MediaPlayerElement begins playing when the page loads. 若要抑制媒體立即播放,您可以將 AutoPlay 屬性設為 falseTo suppress media from starting right away, you can set the AutoPlay property to false.

<MediaPlayerElement x:Name="mediaSimple"
                    Source="ms-appx:///Videos/video1.mp4"
                    Width="400" AutoPlay="True"/>

此 XAML 會建立已啟用內建傳輸控制項的 MediaPlayerElement,並將 AutoPlay 屬性設定為 falseThis XAML creates a MediaPlayerElement with the built in transport controls enabled and the AutoPlay property set to false.

<MediaPlayerElement x:Name="mediaPlayer"
                    Source="ms-appx:///Videos/video1.mp4"
                    Width="400"
                    AutoPlay="False"
                    AreTransportControlsEnabled="True"/>

媒體傳輸控制項Media transport controls

MediaPlayerElement 具有內建傳輸控制項,可處理播放、停止、暫停、音量、靜音、搜尋/進度、隱藏式輔助字幕及曲目選取。MediaPlayerElement has built in transport controls that handle play, stop, pause, volume, mute, seeking/progress, closed captions, and audio track selection. 若要啟用這些控制項,請將 AreTransportControlsEnabled 設定為 trueTo enable these controls, set AreTransportControlsEnabled to true. 若要停用,請將 AreTransportControlsEnabled 設定為 falseTo disable them, set AreTransportControlsEnabled to false. 傳輸控制項是由 MediaTransportControls 類別來表示。The transport controls are represented by the MediaTransportControls class. 您可以依原樣使用傳輸控制項,或是以各種方式自訂它們。You can use the transport controls as-is, or customize them in various ways. 如需詳細資訊,請參閱 MediaTransportControls 類別參考和建立自訂傳輸控制項For more info, see the MediaTransportControls class reference and Create custom transport controls.

傳輸控制項支援單列與雙列配置。The transport controls support single- and double-row layouts. 這裡的第一個範例是單列配置,播放/暫停按鈕位於媒體時間軸左邊。The first example here is a single-row layout, with the play/pause button located to the left of the media timeline. 此配置最適合保留給內嵌媒體播放與小型螢幕使用。This layout is best reserved for inline media playback and compact screens.

單列 MTC 控制項範例

在大部分使用情況下 (特別是在較大的螢幕上 ),建議使用下面的雙列控制項配置。The double-row controls layout (below) is recommended for most usage scenarios, especially on larger screens. 此配置可提供更多空間供控制項使用,並且可讓使用者更容易操作時間軸。This layout provides more space for controls and makes the timeline easier for the user to operate.

手機上雙列 MTC 控制項範例

系統媒體傳輸控制項System media transport controls

MediaPlayerElement 會自動與系統媒體傳輸控制項整合。MediaPlayerElement is automatically integrated with the system media transport controls. 系統媒體傳輸控制項是指當使用者按下硬體媒體鍵 (例如鍵盤上的媒體按鈕) 時,會以快顯方式顯示的控制項。The system media transport controls are the controls that pop up when hardware media keys are pressed, such as the media buttons on keyboards. 如需詳細資訊,請參閱 SystemMediaTransportControlsFor more info, see SystemMediaTransportControls.

注意:    MediaElement 不會自動與系統媒體傳輸控制項整合,因此您必須自行加以連接。Note   MediaElement does not automatically integrate with the system media transport controls so you must connect them yourself. 如需詳細資訊,請參閱系統媒體傳輸控制項For more information, see System Media Transport Controls.

設定媒體來源Set the media source

若要播放位於網路上的檔案或內嵌於 app 的檔案,請將 MediaSourceSource 屬性設定為檔案的路徑。To play files on the network or files embedded with the app, set the Source property to a MediaSource with the path of the file.

提示:   若要從網際網路開啟檔案,您需要在應用程式資訊清單 (Package.appxmanifest) 中宣告網際網路 (用戶端) 功能。Tip  To open files from the internet, you need to declare the Internet (Client) capability in your app's manifest (Package.appxmanifest). 如需宣告功能的詳細資訊,請參閱 App 功能宣告For more info about declaring capabilities, see App capability declarations.

 

此程式碼會嘗試將 XAML 中定義之 MediaPlayerElementSource 屬性設定為在 TextBox 中輸入的檔案路徑。This code attempts to set the Source property of the MediaPlayerElement defined in XAML to the path of a file entered into a TextBox.

<TextBox x:Name="txtFilePath" Width="400"
         FontSize="20"
         KeyUp="TxtFilePath_KeyUp"
         Header="File path"
         PlaceholderText="Enter file path"/>
private void TxtFilePath_KeyUp(object sender, KeyRoutedEventArgs e)
{
    if (e.Key == Windows.System.VirtualKey.Enter)
    {
        TextBox tbPath = sender as TextBox;

        if (tbPath != null)
        {
            LoadMediaFromString(tbPath.Text);
        }
    }
}

private void LoadMediaFromString(string path)
{
    try
    {
        Uri pathUri = new Uri(path);
        mediaPlayer.Source = MediaSource.CreateFromUri(pathUri);
    }
    catch (Exception ex)
    {
        if (ex is FormatException)
        {
            // handle exception.
            // For example: Log error or notify user problem with file
        }
    }
}

若要將媒體來源設定為內嵌於應用程式中的媒體檔案,請初始化其路徑開頭為 ms-appx:///Uri,以此 Uri 建立 MediaSource,然後將 Source 設定為該 Uri。To set the media source to a media file embedded in the app, initialize a Uri with the path prefixed with ms-appx:///, create a MediaSource with the Uri and then set the Source to the Uri. 例如,如果檔案名為 video1.mp4 並且位於 Videos 子資料夾中,則路徑應該看起來如下:ms-appx:///Videos/video1.mp4For example, for a file called video1.mp4 that is in a Videos subfolder, the path would look like: ms-appx:///Videos/video1.mp4

此程式碼會將先前在 XAML 中定義之 MediaPlayerElementSource 屬性設為 ms-appx:///Videos/video1.mp4This code sets the Source property of the MediaPlayerElement defined previously in XAML to ms-appx:///Videos/video1.mp4.

private void LoadEmbeddedAppFile()
{
    try
    {
        Uri pathUri = new Uri("ms-appx:///Videos/video1.mp4");
        mediaPlayer.Source = MediaSource.CreateFromUri(pathUri);
    }
    catch (Exception ex)
    {
        if (ex is FormatException)
        {
            // handle exception.
            // For example: Log error or notify user problem with file
        }
    }
}

開啟本機媒體檔案Open local media files

若要開啟本機系統或 OneDrive 上的檔案,您可以使用 FileOpenPicker 來取得檔案,並使用 Source 來設定媒體來源,或是以程式設計方式存取使用者媒體資料夾。To open files on the local system or from OneDrive, you can use the FileOpenPicker to get the file and Source to set the media source, or you can programmatically access the user media folders.

如果您的 app 需要不藉助使用者互動就能存取 [音樂] 或 [影片] 資料夾 (例如,如果您要列舉使用者收藏中的所有音樂或影片檔案並將它們顯示在 app 中),您就必須宣告「音樂媒體櫃」 和「影片媒體櫃」 功能。If your app needs access without user interaction to the Music or Video folders, for example, if you are enumerating all the music or video files in the user's collection and displaying them in your app, then you need to declare the Music Library and Video Library capabilities. 如需詳細資訊,請參閱音樂、圖片及影片媒體櫃中的檔案和資料夾For more info, see Files and folders in the Music, Pictures, and Videos libraries.

FileOpenPicker 不需要特殊功能來存取本機檔案系統 (例如,使用者的 [音樂] 或 [影片] 資料夾) 上的檔案,因為使用者可以完全控制存取的檔案。The FileOpenPicker does not require special capabilities to access files on the local file system, such as the user's Music or Video folders, since the user has complete control over which file is being accessed. 從安全性與隱私權的立場看,最佳做法是將 app 使用的「功能」數降到最小。From a security and privacy standpoint, it is best to minimize the number of capabilities your app uses.

使用 FileOpenPicker 開啟本機媒體To open local media using FileOpenPicker

  1. 呼叫 FileOpenPicker,讓使用者挑選媒體檔案。Call FileOpenPicker to let the user pick a media file.

    使用 FileOpenPicker 類別選取媒體檔案。Use the FileOpenPicker class to select a media file. 設定 FileTypeFilter,以指定 FileOpenPicker 顯示的檔案類型。Set the FileTypeFilter to specify which file types the FileOpenPicker displays. 呼叫 PickSingleFileAsync,以啟動檔案選擇器並取得檔案。Call PickSingleFileAsync to launch the file picker and get the file.

  2. 使用 MediaSource,將所選的媒體檔案設定為 MediaPlayerElement.SourceUse a MediaSource to set the chosen media file as the MediaPlayerElement.Source.

    若要使用從 FileOpenPicker 傳回的 StorageFile,您需要呼叫 MediaSource 上的 CreateFromStorageFile 方法,並將它設定為 MediaPlayerElementSourceTo use the StorageFile returned from the FileOpenPicker, you need to call the CreateFromStorageFile method on MediaSource and set it as the Source of MediaPlayerElement. 接著,請呼叫 MediaPlayerElement.MediaPlayer 上的 Play 來啟動媒體。Then call Play on the MediaPlayerElement.MediaPlayer to start the media.

這個範例示範如何使用 FileOpenPicker 來選擇檔案,並將該檔案設定為 MediaPlayerElementSourceThis example shows how to use the FileOpenPicker to choose a file and set the file as the Source of a MediaPlayerElement.

<MediaPlayerElement x:Name="mediaPlayer"/>
...
<Button Content="Choose file" Click="Button_Click"/>
private async void Button_Click(object sender, RoutedEventArgs e)
{
    await SetLocalMedia();
}

async private System.Threading.Tasks.Task SetLocalMedia()
{
    var openPicker = new Windows.Storage.Pickers.FileOpenPicker();

    openPicker.FileTypeFilter.Add(".wmv");
    openPicker.FileTypeFilter.Add(".mp4");
    openPicker.FileTypeFilter.Add(".wma");
    openPicker.FileTypeFilter.Add(".mp3");

    var file = await openPicker.PickSingleFileAsync();

    // mediaPlayer is a MediaPlayerElement defined in XAML
    if (file != null)
    {
        mediaPlayer.Source = MediaSource.CreateFromStorageFile(file);

        mediaPlayer.MediaPlayer.Play();
    }
}

設定海報來源Set the poster source

您可以使用 PosterSource 屬性,來在載入媒體之前以視覺化呈現方式提供 MediaPlayerElementYou can use the PosterSource property to provide your MediaPlayerElement with a visual representation before the media is loaded. PosterSource 是指螢幕擷取畫面或電影海報等,這類會取代媒體顯示的影像。A PosterSource is an image, such as a screen shot or movie poster, that is displayed in place of the media. PosterSource 會在下列情況顯示:The PosterSource is displayed in the following situations:

  • 未設定有效的來源。When a valid source is not set. 例如,未設定 Source、已將 Source 設定為 Null,或來源無效 (如同發生 MediaFailed 事件的情況)。For example, Source is not set, Source was set to Null, or the source is invalid (as is the case when a MediaFailed event occurs).
  • 媒體正在載入時。While media is loading. 例如,已設定有效來源,但尚未發生 MediaOpened 事件。For example, a valid source is set, but the MediaOpened event has not occurred yet.
  • 媒體正在串流處理到另一個裝置時。When media is streaming to another device.
  • 媒體只包含音訊時。When the media is audio only.

以下的 MediaPlayerElement 已將其 Source 設定為專輯曲目,並將其 PosterSource 設定為專輯封面的影像。Here's a MediaPlayerElement with its Source set to an album track, and it's PosterSource set to an image of the album cover.

<MediaPlayerElement Source="ms-appx:///Media/Track1.mp4" PosterSource="Media/AlbumCover.png"/>

讓裝置的螢幕保持使用中Keep the device's screen active

裝置通常會在使用者離開時讓顯示器變暗 (最後會將它關閉) 以延長電池壽命,但是視訊 app 需要讓螢幕一直開著,才能讓使用者觀賞視訊。Typically, a device dims the display (and eventually turns it off) to save battery life when the user is away, but video apps need to keep the screen on so the user can see the video. 若要防止顯示器在未偵測到使用者動作時停用 (例如,app 正在播放影片時),您可以呼叫 DisplayRequest.RequestActiveTo prevent the display from being deactivated when user action is no longer detected, such as when an app is playing video, you can call DisplayRequest.RequestActive. DisplayRequest 類別讓您告訴 Windows 保持開啟顯示器,讓使用者可以觀看影片。The DisplayRequest class lets you tell Windows to keep the display turned on so the user can see the video.

若要省電並延長電池壽命,您應該呼叫 DisplayRequest.RequestRelease,以便在不再需要時釋放顯示器要求。To conserve power and battery life, you should call DisplayRequest.RequestRelease to release the display request when it is no longer required. 當您的 App 未顯示於螢幕上時,Windows 會自動停用它的啟用顯示要求,並在 App 回到前景時重新啟用顯示要求。Windows automatically deactivates your app's active display requests when your app moves off screen, and re-activates them when your app comes back to the foreground.

以下是一些您應該釋放顯示器要求的情況:Here are some situations when you should release the display request:

  • 視訊播放暫停時,例如在因使用者動作、緩衝或因為頻寬有限而進行調整的情況下。Video playback is paused, for example, by user action, buffering, or adjustment due to limited bandwidth.
  • 播放停止時。Playback stops. 例如,視訊播放完畢或簡報結束。For example, the video is done playing or the presentation is over.
  • 發生播放錯誤時。A playback error has occurred. 例如,網路連線問題或檔案損毀。For example, network connectivity issues or a corrupted file.

注意   如果 MediaPlayerElement.IsFullWindow 設為 true,且媒體正在播放,系統將會自動防止顯示器停用。Note   If MediaPlayerElement.IsFullWindow is set to true and media is playing, the display will automatically be prevented from deactivating.

讓螢幕保持使用中To keep the screen active

  1. 建立全域 DisplayRequest 變數。Create a global DisplayRequest variable. 將變數初始化為 null。Initialize it to null.
// Create this variable at a global scope. Set it to null.
private DisplayRequest appDisplayRequest = null;
  1. 呼叫 RequestActive,通知 Windows,App 需要讓顯示器保持開啟。Call RequestActive to notify Windows that the app requires the display to remain on.

  2. 每當影片播放停止、暫停或因播放錯誤而中斷時,呼叫 RequestRelease 以釋放顯示要求。Call RequestRelease to release the display request whenever video playback is stopped, paused, or interrupted by a playback error. 當 App 不再有任何啟用的顯示要求時,Windows 會在沒有使用裝置時將顯示器畫面變暗 (最後將它關閉) 以延長電池壽命。When your app no longer has any active display requests, Windows saves battery life by dimming the display (and eventually turning it off) when the device is not being used.

    每個 MediaPlayerElement.MediaPlayer 都有一個 MediaPlaybackSession 類型 的 PlaybackSession,可控制媒體播放的各種方面,例如 PlaybackRatePlaybackStatePositionEach MediaPlayerElement.MediaPlayer has a PlaybackSession of type MediaPlaybackSession that controls various aspects of media playback such as PlaybackRate, PlaybackState and Position. 在這裡,您將使用 MediaPlayer.PlaybackSession 上的 PlaybackStateChanged 事件,來偵測何時應該釋放顯示器要求。Here, you use the PlaybackStateChanged event on MediaPlayer.PlaybackSession to detect situations when you should release the display request. 然後,使用 NaturalVideoHeight 屬性來判斷是否正在播放音訊或視訊檔案,並只在播放視訊時才讓螢幕保持使用中狀態。Then, use the NaturalVideoHeight property to determine whether an audio or video file is playing, and keep the screen active only if video is playing.

    <MediaPlayerElement x:Name="mpe" Source="ms-appx:///Media/video1.mp4"/>
    
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        mpe.MediaPlayer.PlaybackSession.PlaybackStateChanged += MediaPlayerElement_CurrentStateChanged;
        base.OnNavigatedTo(e);
    }
    
    private void MediaPlayerElement_CurrentStateChanged(object sender, RoutedEventArgs e)
    {
        MediaPlaybackSession playbackSession = sender as MediaPlaybackSession;
        if (playbackSession != null && playbackSession.NaturalVideoHeight != 0)
        {
            if(playbackSession.PlaybackState == MediaPlaybackState.Playing)
            {
                if(appDisplayRequest == null)
                {
                    // This call creates an instance of the DisplayRequest object
                    appDisplayRequest = new DisplayRequest();
                    appDisplayRequest.RequestActive();
                }
            }
            else // PlaybackState is Buffering, None, Opening or Paused
            {
                if(appDisplayRequest != null)
                {
                      // Deactivate the displayr request and set the var to null
                      appDisplayRequest.RequestRelease();
                      appDisplayRequest = null;
                }
            }
        }
    
    }
    

以程式設計方式控制媒體播放器Control the media player programmatically

MediaPlayerElement 提供許多屬性、方法和事件,來透過 MediaPlayerElement.MediaPlayer 屬性控制音訊和視訊播放。MediaPlayerElement provides numerous properties, methods, and events for controlling audio and video playback through the MediaPlayerElement.MediaPlayer property. 如需完整的屬性、方法及事件清單,請參閱 MediaPlayer 參考頁面。For a full listing of properties, methods, and events, see the MediaPlayer reference page.

進階的媒體播放案例Advanced media playback scenarios

針對如播放播放清單、在音訊語言之間切換,或是建立自訂的中繼資料曲目等較為複雜的媒體播放案例,請將 MediaPlayerElement.Source 設定為 MediaPlaybackItemMediaPlaybackListFor more complex media playback scenarios like playing a playlist, switching between audio languages or creating custom metadata tracks set the MediaPlayerElement.Source to a MediaPlaybackItem or a MediaPlaybackList. 如需如何啟用各種進階媒體功能的詳細資訊,請參閱媒體播放頁面。See the Media playback page for more information on how to enable various advanced media functionality.

啟用完整視窗視訊呈現Enable full window video rendering

設定 IsFullWindow 屬性來啟用和停用完整視窗呈現。Set the IsFullWindow property to enable and disable full window rendering. 如果要在 app 中以程式設計方式設定完整視窗呈現,您應該一律使用 IsFullWindow 而不是手動進行。When you programmatically set full window rendering in your app, you should always use IsFullWindow instead of doing it manually. IsFullWindow 可保證執行系統層級最佳化,以增進效能及電池壽命。IsFullWindow insures that system level optimizations are performed that improve performance and battery life. 如果未正確設定完整視窗呈現,將不會啟用這些最佳化。If full window rendering is not set up correctly, these optimizations may not be enabled.

以下的部分程式碼會建立能切換完整視窗呈現的 AppBarButtonHere is some code that creates an AppBarButton that toggles full window rendering.

<AppBarButton Icon="FullScreen"
              Label="Full Window"
              Click="FullWindow_Click"/>>
private void FullWindow_Click(object sender, object e)
{
    mediaPlayer.IsFullWindow = !media.IsFullWindow;
}

調整視訊大小和延展視訊Resize and stretch video

使用 Stretch 屬性,來變更視訊內容,和/或 PosterSource 填入所在容器的方式。Use the Stretch property to change how the video content and/or the PosterSource fills the container it's in. Stretch 值而定,這樣做可能會延展視訊。This resizes and stretches the video depending on the Stretch value. Stretch 狀態和許多電視機上的影像大小設定類似。The Stretch states are similar to picture size settings on many TV sets. 您可以將勾點設定在按鈕上,並允許使用者依偏好選擇所要的設定。You can hook this up to a button and allow the user to choose which setting they prefer.

  • None 會以原始大小顯示內容的原生解析度。None displays the native resolution of the content in its original size.
  • Uniform 會盡可能地填滿空間,同時維持影像內容的外觀比例。Uniform fills up as much of the space as possible while preserving the aspect ratio and the image content. 這會導致視訊邊緣出現水平或垂直的黑色長條。This can result in horizontal or vertical black bars at the edges of the video. 這和寬螢幕模式類似。This is similar to wide-screen modes.
  • UniformToFill 會填滿個空間,同時維持外觀比例。UniformToFill fills up the entire space while preserving the aspect ratio. 這會導致部分影像被裁切。This can result in some of the image being cropped. 這和全螢幕模式類似。This is similar to full-screen modes.
  • Fill 會填滿整個空間,但不會維持外觀比例。Fill fills up the entire space, but does not preserve the aspect ratio. 影像不會被裁切,但可能發生延展現象。None of image is cropped, but stretching may occur. 這和延展模式類似。This is similar to stretch modes.

伸展列舉值

此處的 AppBarButton 可用來循環顯示 Stretch 選項。Here, an AppBarButton is used to cycle through the Stretch options. switch 陳述式會檢查 Stretch 屬性目前的狀態,並將它設定成 Stretch 列舉中的下一個值。A switch statement checks the current state of the Stretch property and sets it to the next value in the Stretch enumeration. 這樣做可允許使用者循環使用不同的延展狀態。This lets the user cycle through the different stretch states.

<AppBarButton Icon="Switch"
              Label="Resize Video"
              Click="PictureSize_Click" />
private void PictureSize_Click(object sender, RoutedEventArgs e)
{
    switch (mediaPlayer.Stretch)
    {
        case Stretch.Fill:
            mediaPlayer.Stretch = Stretch.None;
            break;
        case Stretch.None:
            mediaPlayer.Stretch = Stretch.Uniform;
            break;
        case Stretch.Uniform:
            mediaPlayer.Stretch = Stretch.UniformToFill;
            break;
        case Stretch.UniformToFill:
            mediaPlayer.Stretch = Stretch.Fill;
            break;
        default:
            break;
    }
}

啟用低延遲播放Enable low-latency playback

MediaPlayerElement.MediaPlayer 上將 RealTimePlayback 屬性設定為 true,以讓媒體播放器元素減少播放的初始延遲。Set the RealTimePlayback property to true on a MediaPlayerElement.MediaPlayer to enable the media player element to reduce the initial latency for playback. 這對於雙向通訊的 app 而言非常重要,也很適用於部分遊戲案例。This is critical for two-way communications apps, and can be applicable to some gaming scenarios. 請注意,這個模式需要更大量的資源,而且比較耗電。Be aware that this mode is more resource intensive and less power-efficient.

這個範例會建立 MediaPlayerElement,並將 RealTimePlayback 設定為 trueThis example creates a MediaPlayerElement and sets RealTimePlayback to true.

MediaPlayerElement mp = new MediaPlayerElement();
mp.MediaPlayer.RealTimePlayback = true;

建議Recommendations

媒體播放器支援淺色和深色佈景主題,但是對於大多數的娛樂案例,深色佈景主題可提供較佳的體驗。The media player supports both light and dark themes, but dark theme provides a better experience for most entertainment scenarios. 深色背景可提供較高對比,特別是在低光源的情況下,而且可以避免控制列干擾觀賞體驗。The dark background provides better contrast, in particular for low-light conditions, and limits the control bar from interfering in the viewing experience.

播放視訊內容時,建議以全螢幕模式取代內嵌模式,以獲得更好的觀賞體驗。When playing video content, encourage a dedicated viewing experience by promoting full-screen mode over inline mode. 全螢幕檢視是最佳體驗模式,況且內嵌模式的選項有限。The full-screen viewing experience is optimal, and options are restricted in the inline mode.

如果您有螢幕實際可用空間,或是正在設計 10 呎體驗,請使用雙列配置。If you have the screen real estate or are designing for the 10-foot experience, go with the double-row layout. 它能比精簡的單列配置提供更多的控制項空間,而且能夠針對 10 呎體驗提供更佳的控制器瀏覽支援。It provides more space for controls than the compact single-row layout and it is easier to navigate using gamepad for 10-foot.

注意   如需了解 10 英呎體驗最佳化應用程式的詳細資訊,請造訪專為 Xbox 和電視設計一文。Note   Visit the Designing for Xbox and TV article for more information on optimizing your application for the 10-foot experience.

預設控制項已針對媒體播放最佳化,不過,您可以將所需的自訂選項新增至媒體播放器,以為您的 app 提供最佳體驗。The default controls have been optimized for media playback, however you have the ability to add custom options you need to the media player in order to provide the best experience for you app. 若要深入了解新增自訂控制項,請造訪建立自訂傳輸控制項Visit Create custom transport controls to learn more about adding custom controls.

取得範例程式碼Get the sample code