Afbeeldingen en multimedia

Artikel
12/20/2024

Windows Presentation Foundation (WPF) biedt ondersteuning voor multimedia, vectorafbeeldingen, animatie en inhoudssamenstelling, waardoor ontwikkelaars eenvoudig interessante gebruikersinterfaces en -inhoud kunnen bouwen. Met Visual Studio kunt u vectorafbeeldingen of complexe animaties maken en media integreren in uw toepassingen.

In dit onderwerp worden de grafische, animatie- en mediafuncties van WPF geïntroduceerd, waarmee u afbeeldingen, overgangseffecten, geluid en video kunt toevoegen aan uw toepassingen.

Notitie

Het gebruik van WPF-typen in een Windows-service wordt sterk afgeraden. Als u WPF-typen probeert te gebruiken in een Windows-service, werkt de service mogelijk niet zoals verwacht.

Wat is er nieuw met Graphics en Multimedia in WPF 4

Er zijn verschillende wijzigingen aangebracht met betrekking tot afbeeldingen en animaties.

Indelingsronding

Wanneer een objectrand midden in een pixelapparaat valt, kan het DPI-onafhankelijke grafische systeem renderingartefacten maken, zoals wazige of semitransparante randen. Eerdere versies van WPF bevatten pixelafstemming om dit probleem aan te pakken. Silverlight 2 heeft indelingsrondes geïntroduceerd. Dit is een andere manier om elementen te verplaatsen, zodat randen op hele pixelgrenzen vallen. WPF ondersteunt nu layoutronding met de UseLayoutRounding gekoppelde eigenschap op FrameworkElement.
Samenstelling in cache

Door de nieuwe BitmapCache- en BitmapCacheBrush klassen te gebruiken, kunt u een complex deel van de visualstructuur opslaan als bitmap en de weergavetijd aanzienlijk verbeteren. De bitmap blijft responsief op gebruikersinvoer, zoals muisklikken en u kunt deze op andere elementen schilderen, net zoals elke kwast.
Ondersteuning voor Pixel Shader 3

WPF 4 bouwt voort op de ShaderEffect ondersteuning geïntroduceerd in WPF 3.5 SP1 door toepassingen toe te staan effecten te schrijven met behulp van Pixel Shader (PS) versie 3.0. Het PS 3.0-shadermodel is geavanceerder dan PS 2.0, wat nog meer effecten op ondersteunde hardware mogelijk maakt.
Versoepelende Functies

U kunt animaties verbeteren met easing-functies, waardoor u extra controle hebt over het gedrag van animaties. U kunt bijvoorbeeld een ElasticEase toepassen op een animatie om de animatie een springachtig gedrag te geven. Zie de versoepelingstypen in de System.Windows.Media.Animation naamruimte voor meer informatie.

Afbeeldingen en rendering

WPF bevat ondersteuning voor 2D-afbeeldingen van hoge kwaliteit. De functionaliteit omvat borstels, geometrieën, afbeeldingen, vormen en transformaties. Zie Graphicsvoor meer informatie. De weergave van grafische elementen is gebaseerd op de Visual klasse. De structuur van visuele objecten op het scherm wordt beschreven door de visuele boom. Zie WPF Graphics Rendering Overviewvoor meer informatie.

2D-vormen

WPF biedt een bibliotheek met veelgebruikte vectortekeningen van 2D-vormen, zoals rechthoeken en ellipsen, die in de volgende illustratie worden getoond.

diagram met ellipsen en rechthoeken.

Deze intrinsieke WPF-shapes zijn niet alleen shapes: ze zijn programmeerbare elementen die veel van de functies implementeren die u verwacht van de meest voorkomende besturingselementen, waaronder toetsenbord- en muisinvoer. In het volgende voorbeeld ziet u hoe u de MouseUp gebeurtenis verwerkt die wordt gegenereerd door op een Ellipse element te klikken.

<Window
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="Window1" >
  <Ellipse Fill="LightBlue" MouseUp="ellipseButton_MouseUp" />
</Window>

public partial class Window1  : Window
{
    void ellipseButton_MouseUp(object sender, MouseButtonEventArgs e)
    {
        MessageBox.Show("You clicked the ellipse!");
    }
}

Partial Public Class Window1
    Inherits Window
    Private Sub ellipseButton_MouseUp(ByVal sender As Object, ByVal e As MouseButtonEventArgs)
        MessageBox.Show("You clicked the ellipse!")
    End Sub
End Class

In de volgende afbeelding ziet u de uitvoer voor de voorgaande XAML-markeringen en code-behind.

Een berichtvak dat zegt 'U hebt op de ellips geklikt!'

Zie Shapes en Eenvoudige tekening in WPF Overviewvoor meer informatie. Zie Voorbeeld van shape-elementenvoor een inleidende voorbeeld.

2D Geometrieën

Wanneer de 2D-shapes die WPF biedt niet voldoende zijn, kunt u WPF-ondersteuning gebruiken voor geometrieën en paden om uw eigen shapes te maken. In de volgende afbeelding ziet u hoe u geometrieën kunt gebruiken om vormen te maken, als tekenborstel en om andere WPF-elementen te knippen.

Schermopname die laat zien hoe u geometrieën kunt gebruiken om vormen te maken.

Zie Geometrieoverzichtvoor meer informatie. Zie Geometrievoorbeeldvoor een inleidende steekproef.

2D-effecten

WPF biedt een bibliotheek met 2D-klassen die u kunt gebruiken om verschillende effecten te maken. De 2D-renderingfunctie van WPF biedt de mogelijkheid om UI-elementen met kleurovergangen, bitmaps, tekeningen en video's te schilderen; en om ze te manipuleren met behulp van draaiing, schalen en scheven. In de volgende afbeelding ziet u een voorbeeld van de vele effecten die u kunt bereiken met behulp van WPF-borstels.

Illustratie met de verschillende WPF-borstels en verfelementen.

Zie WPF Brushes Overviewvoor meer informatie. Voor een inleidend voorbeeld, zie Brushes Sample.

3D-rendering

WPF biedt een set 3D-renderingmogelijkheden die kunnen worden geïntegreerd met ondersteuning voor 2D-afbeeldingen in WPF, zodat u een spannendere indeling, gebruikersinterface en gegevensvisualisatie kunt maken. Aan het ene uiteinde van het spectrum kunt u met WPF 2D-afbeeldingen weergeven op de oppervlakken van 3D-vormen, die in de volgende afbeelding worden gedemonstreerd.

Schermopname van een voorbeeld met 3D-shapes met verschillende patronen.

Zie 3D Graphics Overviewvoor meer informatie. Zie 3D Solids Samplevoor een inleidende steekproef.

Animatie

Gebruik animatie om besturingselementen en elementen te laten groeien, schudden, draaien en vervagen; en om interessante paginaovergangen te maken, en meer. Omdat u met WPF de meeste eigenschappen kunt animeren, kunt u niet alleen de meeste WPF-objecten animeren, maar u kunt ook WPF gebruiken om aangepaste objecten die u maakt, te animeren.

Schermopname van een kubus met animatie.

Zie Animatieoverzichtvoor meer informatie. Zie Animatievoorbeeldgalerievoor een inleidende voorbeeld.

Media

Afbeeldingen, video en audio zijn media-rijke manieren om informatie en gebruikerservaringen over te brengen.

Afbeeldingen

Afbeeldingen, waaronder pictogrammen, achtergronden en zelfs delen van animaties, vormen een belangrijk onderdeel van de meeste toepassingen. Omdat u vaak afbeeldingen moet gebruiken, biedt WPF de mogelijkheid om er op verschillende manieren mee te werken. In de volgende afbeelding ziet u slechts een van deze manieren.

Schermopname van styling-voorbeeld

Zie Imaging Overviewvoor meer informatie.

Video en audio

Een kernfunctie van de grafische mogelijkheden van WPF is het bieden van systeemeigen ondersteuning voor het werken met multimedia, waaronder video en audio. In het volgende voorbeeld ziet u hoe u een mediaspeler invoegt in een toepassing.

<MediaElement Source="media\numbers.wmv" Width="450" Height="250" />

MediaElement kan zowel video als audio afspelen en is uitbreidbaar genoeg om het eenvoudig maken van aangepaste UIS's mogelijk te maken.

Zie het Multimediaoverzichtvoor meer informatie.

Delen via