Kolumne XAML Expertise: WPF und Windows-Apps

XAML-Tipp: Universal-Windows-App – SVG-Bilder in deiner App
Kommentare

In der Kolumne „XAML Expertise“ präsentiert Gregor Biswanger nun schon seit fünf Jahren Top-How-tos zum Thema XAML. Einsteiger und fortgeschrittene XAML-Experten sollen hier durch geballtes Wissen gesättigt werden. Heute gibt es folgende Expertise: „Universal-Windows-App: SVG-Bilder in deiner App“.

Das neue Windows-10-Creators-Update bringt einige Neuerungen für die Universal-Windows-Apps mit sich. Eine darunter ist die Unterstützung zum Anzeigen von SVG-Bildern (Scalable Vector Graphics). Das SVG-Format basiert auf XML und ist eine vom W3C empfohlene Spezifikation, um zweidimensionale Vektorgrafiken im Web darzustellen. Vektorgrafiken sind, vereinfacht ausgedrückt, Beschreibungen von zweidimensionalen Objekten wie Kreisen, Rechtecken und Pfaden. Das bringt für einige Grafikabbildungen einen erheblichen Vorteil gegenüber klassischen Bildformaten wie JPEG oder PNG, z. B. beim Einsatz von Icons. Sind diese als JPEG oder PNG in einer fixen Größe erzeugt worden, können sie auf unterschiedlichen Gerätegrößen verpixelt und unscharf aussehen.

Universal-Windows-App: SVG-Bilder in deiner App

Zum Anzeigen von SVG-Dateien, kann das Standard-Image-Steuerelement wie gewohnt eingesetzt werden (Listing 1, Abb. 1). Dem Autor ist bei der aktuellen VS2017-(15.2-)Version aufgefallen, dass der XAML-Designer keine Vorschau anzeigt und im Eigenschaftenfenster unter Source keine SVG-Dateien in der Auswahlliste angeboten werden.

Die SVG-Unterstützung ist allerdings nur auf die Anzeige beschränkt und der dynamische Zugriff auf einzelne XML-Elemente nicht möglich. Dazu empfiehlt Microsoft die Entwicklung der App mit JavaScript oder beim Einsatz von XAML mit dem WebView-Steuerelement zu arbeiten. Über C++ kann mittels Direct2D direkt Einfluss genommen werden. Das dynamische Manipulieren von SVG während der Laufzeit ist auf jeden Fall eine der gefragtesten Anforderungen im Webumfeld. Bei Universal-Windows-Apps wird man hingegen wegen der Einschränkung eher auf den Vorteil der Skalierbarkeit setzen.

Die SVG-Unterstützung bezieht sich ebenfalls nur auf eine Teilmenge vom Standard. So werden zum Beispiel keine Animationen und Interaktionen unterstützt.

<Page
  x:Class="SvgSample.MainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  mc:Ignorable="d">

  <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Image Source="Assets\Smiley.svg" />

  </Grid>
</Page>

Abb. 1: SVG-Support in Universal-Windows-Apps

Windows Developer

Windows DeveloperDieser Artikel ist im Windows Developer erschienen. Windows Developer informiert umfassend und herstellerneutral über neue Trends und Möglichkeiten der Software- und Systementwicklung rund um Microsoft-Technologien.

Natürlich können Sie den Windows Developer über den entwickler.kiosk auch digital im Browser oder auf Ihren Android- und iOS-Devices lesen. In unserem Shop ist der Windows Developer ferner im Abonnement oder als Einzelheft erhältlich.


Schnell und überall: Datenzugriff mit Entity Framework Core 2.0

Dr. Holger Schwichtenberg (www.IT-Visions.de/5Minds IT-Solutions)

C# 7.0 – Neues im Detail

Christian Nagel (CN innovation)

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -