Médialejátszók

A médialejátszás magában foglalja a videó és a hang megtekintését és meghallgatását beágyazott (lapba vagy más vezérlők egy csoportjába ágyazott) vagy dedikált teljes képernyős felületen.

A felhasználók olyan alapszintű vezérlőkészletet várnak, mint például a lejátszás/szüneteltetés, a visszaugrás, az előreugrás, amelyet igény szerint módosíthat (beleértve a media player gombjait, a vezérlősáv hátterét, valamint a vezérlő elrendezését vagy elrendezését).

Képernyőkép egy médialejátszó elemről, amelyen az átviteli vezérlők egy katicabogarat bemutató videót játszanak le

Ez a megfelelő vezérlő?

Használjon media player, ha hangot vagy videót szeretne lejátszani az alkalmazásban. Képgyűjtemény megjelenítéséhez használjon tükrözési nézetet.

Recommendations

A media player a világos és a sötét témákat is támogatja, de a sötét téma jobb élményt nyújt a legtöbb szórakoztató forgatókönyvhöz. A sötét háttér jobb kontrasztot biztosít, különösen alacsony fényviszonyok esetén, és korlátozza a vezérlősávot abban, hogy zavarja a megtekintési élményt.

Videótartalmak lejátszása során ösztönözheti a dedikált megtekintési élményt azáltal, hogy előnyben részesíti a teljes képernyős módot az inline móddal szemben. A teljes képernyős megjelenítés optimális, a beállítások pedig beágyazott módban korlátozottak.

Ha rendelkezik megfelelő képernyőmérettel, válassza a kétsoros elrendezést. Több helyet biztosít a vezérlők számára, mint a kompakt egysoros elrendezés, és egyszerűbben navigálhat különböző bemenetek használatával.

Az alapértelmezett vezérlők médialejátszásra lettek optimalizálva, azonban egyéni beállításokat is hozzáadhat a media player, hogy a lehető legjobb élményt nyújthassa az alkalmazás számára. Az egyéni átviteli vezérlők hozzáadásáról további információt az Egyéni átviteli vezérlők létrehozása című témakörben olvashat.

Media player létrehozása

Fontos API-k: MediaPlayerElement osztály, MediaTransportControls osztály

Nyissa meg a WinUI 3 Gallery alkalmazást, és tekintse meg működés közben a MediaPlayerElement alkalmazást

A WinUI 3 Katalógus alkalmazás interaktív példákat tartalmaz a WinUI vezérlőire és funkcióira. Kérje le az alkalmazást a Microsoft Áruházból vagy keresse meg a forráskódot a GitHub webhelyen.

Hozzon létre egy MediaPlayerElement objektumot az XAML-ben, és állítsa a Forrás értékét olyan MediaSource-ra, amely hang- vagy videofájlra mutat.

Ez az XAML létrehoz egy MediaPlayerElement-et , és a Forrás tulajdonságát az alkalmazás helyi videofájljának URI-jára állítja. A MediaPlayerElement lejátszás az oldal betöltésekor kezdődik. Ha el szeretné tiltani, hogy a média azonnal elinduljon, beállíthatja az Automatikus lejátszás tulajdonságot a következőre false: .

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

Ez az XAML létrehoz egy MediaPlayerElement-et , amely engedélyezve van a beépített átviteli vezérlőkkel, az Automatikus lejátszás tulajdonság pedig a következőre van állítva: false.

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

Fontos

A MediaPlayerElement.Source relatív URI-ra (ms-appx/ms-resource) való beállítása csak egy Windows alkalmazáscsomagoló projekttel csomagolt alkalmazásban működik. Ha az alkalmazás nem használ egy Windows Application Packaging Projectet, az ajánlott megoldás a relatív ms-appx:/// URI átalakítása teljesen feloldott file:/// URI-vá. A cikk későbbi részében lásd a Médiaforrás beállítása és a Helyi médiafájlok megnyitása szakaszt is.

Médiaátviteli vezérlők

A MediaPlayerElement beépített átviteli vezérlőket, amelyek kezelik a lejátszást, a leállítást, a szüneteltetést, a hangerőt, a némítást, a keresés/haladást, a feliratokat és a hangsáv kiválasztását. A vezérlők engedélyezéséhez állítsa az AreTransportControlsEnabled értéket a következőre true: . A letiltásukhoz állítsa AreTransportControlsEnabled értékét false-re. Az átviteli vezérlőket a MediaTransportControls osztály jelöli. Használhatja az átviteli vezérlőket as-is, vagy testre szabhatja őket különböző módokon. További információ: MediaTransportControls osztályhivatkozás és Egyéni átviteli vezérlők létrehozása.

Az átviteli vezérlők támogatják az egy- és kétsoros elrendezéseket. Az első példa egy egysoros elrendezés, a lejátszás/szüneteltetés gomb a média idővonalától balra található. Ez az elrendezés a legjobban a beágyazott médialejátszáshoz és a kompakt képernyőkhöz van fenntartva.

Példa egy soros MTC-vezérlőre

A kétsoros vezérlők elrendezése (alább) a legtöbb használati forgatókönyv esetében ajánlott, különösen nagyobb képernyőkön. Ez az elrendezés több helyet biztosít a vezérlők számára, és megkönnyíti a felhasználó számára az ütemterv működését.

Példa MTC-vezérlőkre, dupla sorral

A rendszer adathordozó-átviteli vezérlői

A MediaPlayerElement automatikusan integrálva van a rendszer médiaátviteli vezérlőivel. A rendszer adathordozó-átviteli vezérlői azok a vezérlők, amelyek a hardveres médiakulcsok lenyomásakor jelennek meg, például a billentyűzeteken lévő médiagombok. További információ: SystemMediaTransportControls.

A médiaforrás beállítása

A hálózaton vagy az alkalmazásba beágyazott fájlok lejátszásához állítsa a Forrás tulajdonságot egy MediaSource-ra a fájl elérési útjával.

Jótanács

Ha az internetről szeretne fájlokat megnyitni, deklarálnia kell az internet (ügyfél) képességét az alkalmazás jegyzékében (Package.appxmanifest). A képességek deklarálásával kapcsolatos további információkért lásd az alkalmazásképesség-deklarációkat.

Ez a kód megkísérli beállítani az XAML-ben definiált MediaPlayerElement Source tulajdonságát a Szövegdobozba beírt fájl elérési útjára.

<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);
        mediaPlayerElement.Source = MediaSource.CreateFromUri(pathUri);
    }
    catch (Exception ex)
    {
        if (ex is FormatException)
        {
            // handle exception.
            // For example: Log error or notify user problem with file
        }
    }
}

Ha az alkalmazásba ágyazott médiafájlra szeretné beállítani a médiaforrást, inicializáljon egy Uri-t az előtaggal ellátott elérési úttal ms-appx:///, hozzon létre egy MediaSource-t az Uri-val, majd állítsa a Forrás Uri értékre. A Videók almappában található video1.mp4 nevű fájl esetében például az elérési út a következőképpen nézne ki:ms-appx:///Videos/video1.mp4

Fontos

A MediaPlayerElement.Source relatív URI-ra (ms-appx/ms-resource) való beállítása csak egy Windows alkalmazáscsomagoló projekttel csomagolt alkalmazásban működik.

Ez a kód az XAML-ben korábban definiált MediaPlayerElement forrástulajdonságát a következőre ms-appx:///Videos/video1.mp4állítja: .

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

Helyi médiafájlok megnyitása

Ha fájlokat szeretne megnyitni a helyi rendszeren vagy a OneDrive, a FileOpenPicker használatával lekérheti a fájlt, és Source beállíthatja a médiaforrást, vagy programozott módon hozzáférhet a felhasználói médiamappákhoz.

Ha az alkalmazásnak felhasználói beavatkozás nélkül hozzáférés szükséges a Music vagy Video mappákhoz, például ha számba szeretné venni a felhasználó gyűjteményében lévő összes zene- vagy videofájlt, és megjeleníti őket az alkalmazásban, akkor deklarálnia kell a Music Library és Video Library jogosultságokat. További információ: Fájlok és mappák a Zene, Képek és Videók tárakban.

A FileOpenPicker nem igényel speciális képességeket a helyi fájlrendszer fájljainak, például a felhasználó zene- vagy videomappáinak eléréséhez, mivel a felhasználó teljes mértékben szabályozhatja, hogy melyik fájlhoz fér hozzá. Biztonsági és adatvédelmi szempontból a legjobb, ha minimalizálja az alkalmazás által használt képességek számát.

Helyi média megnyitása a FileOpenPicker használatával

A FileOpenPicker hívásával a felhasználó kiválaszthat egy médiafájlt.

A FileOpenPicker osztály használatával jelöljön ki egy médiafájlt. A FileTypeFilter beállításával adja meg, hogy a FileOpenPicker melyik fájltípus jelenik meg. Hívja meg a PickSingleFileAsync parancsot a fájlválasztó elindításához és a fájl lekéréséhez.
MediaSource használatával állítsa be a kiválasztott médiafájlt MediaPlayerElement.Source néven.

A FileOpenPickerből visszaadott StorageFile használatához meg kell hívnia a CreateFromStorageFile metódust a MediaSource-on, és be kell állítania a MediaPlayerElement forrásaként. Ezután hívja meg a Play-t a MediaPlayerElement.MediaPlayerben a média elindításához.

Ez a példa bemutatja, hogyan választhat ki egy fájlt a FileOpenPicker használatával, és hogyan állíthatja be a fájlt a MediaPlayerElement forrásaként.

<MediaPlayerElement x:Name="mediaPlayerElement"/>
...
<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();
    WinRT.Interop.InitializeWithWindow.Initialize(openPicker, WinRT.Interop.WindowNative.GetWindowHandle(this));

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

    var file = await openPicker.PickSingleFileAsync();

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

        mediaPlayerElement.MediaPlayer.Play();
    }
}

A plakát forrásának beállítása

A PosterSource tulajdonsággal vizuális megjelenítést biztosíthat a MediaPlayerElement számára a média betöltése előtt. Az A PosterSource egy kép, például képernyőkép, filmplakát vagy albumkép, amely a média helyett jelenik meg. A PosterSource következő helyzetekben jelenik meg:

Ha nincs beállítva érvényes forrás. Például a Forrás nincs beállítva, a Source be lett állítva null, vagy a forrás érvénytelen (amint azt egy MediaFailed esemény bekövetkezésekor látjuk).
Amíg az adathordozó betöltődik. Egy érvényes forrás például be van állítva, de a MediaOpened esemény még nem történt meg.
Ha média kerül streamelésre egy másik eszközre.
Ha a média csak hanganyag.

Íme egy MediaPlayerElement, amelynek forrása egy album számára van beállítva, és a PosterSource az albumborító képére van beállítva.

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

Az eszköz képernyőjének aktív maradása

Az eszköz általában elhomályosítja a kijelzőt (és végül kikapcsolja) az akkumulátor üzemidejének megtakarításához, amikor a felhasználó távol van, de a videoalkalmazásoknak be kell tartaniuk a képernyőt, hogy a felhasználó láthassa a videót. Ha meg szeretné akadályozni, hogy a kijelző inaktiválódjon, amikor a felhasználói művelet már nem észlelhető, például amikor egy alkalmazás videót játszik le, meghívhatja a DisplayRequest.RequestActive-t. A DisplayRequest osztály lehetővé teszi, hogy a Windows bekapcsolva tartsa a kijelzőt, hogy a felhasználó láthassa a videót.

Az energia- és akkumulátor-üzemidő megőrzése érdekében hívja fel a DisplayRequest.RequestRelease parancsot a megjelenítési kérelem kiadásához, ha már nincs rá szükség. Windows automatikusan inaktiválja az alkalmazás aktív megjelenítési kéréseit, amikor az alkalmazás kimozdul a képernyőről, és újra aktiválja őket, amikor az alkalmazás visszatér az előtérbe.

Íme néhány helyzet, amikor fel kell szabadítanod a megjelenítési kérést:

A videólejátszást például felhasználói művelet, pufferelés vagy korlátozott sávszélesség miatti beállítás szünetelteti.
A lejátszás leáll. A videó lejátszása befejeződött, vagy a bemutató véget ért.
Lejátszási hiba történt. Például hálózati csatlakozási problémák vagy sérült fájl.

A képernyő aktív maradása

Hozzon létre egy globális DisplayRequest változót . Inicializálja „null”.
```
private DisplayRequest appDisplayRequest = null;
```
A RequestActive hívásával értesítse Windows, hogy az alkalmazásnak be kell kapcsolnia a kijelzőt.
Hívja meg a RequestRelease-t , hogy engedje fel a megjelenítési kérést, ha a videolejátszás le van állítva, szüneteltetve vagy lejátszáshiba miatt megszakad. Ha az alkalmazás már nem rendelkezik aktív megjelenítési kérésekkel, Windows az akkumulátor üzemidejét úgy takaríthatja meg, hogy elhalványítja a kijelzőt (és végül kikapcsolja), amikor az eszköz nincs használatban.

Minden MediaPlayerElement.MediaPlayer rendelkezik Egy MediaPlaybackSession típusú PlaybackSession típussal, amely a médialejátszás különböző aspektusait szabályozza, például a PlaybackRate, a PlaybackState és a Position. Itt a MediaPlayer.PlaybackSession playbackStateChanged eseményével észlelheti azokat a helyzeteket, amikor fel kell szabadítanod a megjelenítési kérelmet. Ezután a NaturalVideoHeight tulajdonság használatával állapítsa meg, hogy hang- vagy videofájl van-e lejátszva, és csak akkor tartsa aktív a képernyőt, ha a videó lejátszása folyamatban van.

<MediaPlayerElement x:Name="mediaPlayerElement" Source="ms-appx:///Videos/video1.mp4"/>

public sealed partial class MainWindow : Window
{
    public DisplayRequest appDisplayRequest = null;
    // using Microsoft.UI.Dispatching;
    private DispatcherQueue dispatcherQueue = DispatcherQueue.GetForCurrentThread();

    public MainWindow()
    {
        this.InitializeComponent();
        mediaPlayerElement.MediaPlayer.PlaybackSession.PlaybackStateChanged += 
            PlaybackSession_PlaybackStateChanged;
    }

    private void PlaybackSession_PlaybackStateChanged(MediaPlaybackSession sender, object args)
    {
        MediaPlaybackSession playbackSession = sender as MediaPlaybackSession;
        if (playbackSession != null && playbackSession.NaturalVideoHeight != 0)
        {
            if (playbackSession.PlaybackState == MediaPlaybackState.Playing)
            {
                if (appDisplayRequest is null)
                {
                    dispatcherQueue.TryEnqueue(DispatcherQueuePriority.Normal, () =>
                    {
                        appDisplayRequest = new DisplayRequest();
                        appDisplayRequest.RequestActive();
                    });
                }
            }
            else // PlaybackState is Buffering, None, Opening, or Paused.
            {
                if (appDisplayRequest is not null)
                {
                    appDisplayRequest.RequestRelease();
                    appDisplayRequest = null;
                }
            }
        }
    }
}

A media player programozott vezérlése

A MediaPlayerElement számos tulajdonságot, módszert és eseményt biztosít a hang- és videolejátszás szabályozásához a MediaPlayerElement.MediaPlayer tulajdonságon keresztül. A tulajdonságok, metódusok és események teljes listájáért tekintse meg a MediaPlayer referenciaoldalát.

Speciális médialejátszási forgatókönyvek

Összetettebb médialejátszási forgatókönyvek, például lejátszási listák lejátszása, hangnyelvek közötti váltás vagy egyéni metaadat-zeneszámok létrehozása esetén állítsa a MediaPlayerElement.Source értéket MediaPlaybackItemre vagy MediaPlaybackListre. A különböző speciális médiafunkciók engedélyezéséről további információt a Médialejátszás lapon talál.

Videó átméretezése és kinyújtása

A Stretch tulajdonság használatával módosíthatja, hogy a videótartalom és/vagy a PosterSource hogyan tölti ki a tárolót. Ez átméretezi és kinyújtja a videót a Stretch értéktől függően. Az Stretch állapotok sok tv-készülék képméret-beállításaihoz hasonlóak. Ezt csatlakoztathatja egy gombra, és engedélyezheti a felhasználónak, hogy kiválassza a kívánt beállítást.

Egyik sem jeleníti meg a tartalom natív felbontását az eredeti méretében. Ez azt eredményezheti, hogy a videó egy része körül van vágva, vagy fekete sávok vannak a videó szélén.
Az egyenruha a lehető legtöbb helyet kitölti, miközben megőrzi az oldalarányt és a videó tartalmát. Ez vízszintes vagy függőleges fekete sávokat eredményezhet a videó szélein. Ez hasonló a széles képernyős üzemmódokhoz.
A UniformToFill kitölti a teljes területet, miközben megőrzi az oldalarányt. Ez azt eredményezheti, hogy a videó egy része le van vágva. Ez hasonló a teljes képernyős üzemmódokhoz.
A kitöltés kitölti a teljes területet, de nem őrzi meg az oldalarányt. A videó egyik része sem lesz levágva, de előfordulhat, hogy megnyúlik. Ez hasonló a nyújtási módokhoz.

Enumerálási értékek kiterjesztése

Itt egy AppBarButton használatával lépegethet a Stretch beállításai között. Az switch utasítás ellenőrzi a Stretch tulajdonság aktuális állapotát, és az enumerálás következő értékére Stretch állítja. Ez lehetővé teszi, hogy a felhasználó végigjárja a különböző szakaszállapotokat.

<AppBarButton Icon="Trim"
              Label="Resize Video"
              Click="PictureSize_Click" />

private void PictureSize_Click(object sender, RoutedEventArgs e)
{
    switch (mediaPlayerElement.Stretch)
    {
        case Stretch.Fill:
            mediaPlayerElement.Stretch = Stretch.None;
            break;
        case Stretch.None:
            mediaPlayerElement.Stretch = Stretch.Uniform;
            break;
        case Stretch.Uniform:
            mediaPlayerElement.Stretch = Stretch.UniformToFill;
            break;
        case Stretch.UniformToFill:
            mediaPlayerElement.Stretch = Stretch.Fill;
            break;
        default:
            break;
    }
}

Kis késleltetésű lejátszás engedélyezése

Állítsa a RealTimePlayback tulajdonságot trueegy MediaPlayerElement.MediaPlayerre , hogy a médialejátszó elem csökkentse a lejátszás kezdeti késését. Ez kritikus fontosságú a kétirányú kommunikációs alkalmazások esetében, és alkalmazható néhány játékforgatókönyvre. Vegye figyelembe, hogy ez a mód erőforrás-igényesebb és kevésbé energiatakarékos.

Ez a példa létrehoz egy MediaPlayerElement-et , és a RealTimePlaybacket a értékre trueállítja.

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

Visszajelzés

Hasznosnak találta ezt az oldalt?

Last updated on 2026-03-11