Mehrere Plattformen mit einem .NET MAUI-Einzelprojekt anvisieren

Das Einzelprojekt .NET Multi-Platform App UI (.NET MAUI) nutzt die plattformspezifischen Entwicklungserfahrungen, auf die Sie normalerweise beim Entwickeln von Apps treffen und diese in einem freigegebenen Einzelprojekt abstrahieren, das auf Android, iOS, macOS und Windows ausgerichtet werden kann.

Das .NET MAUI-Einzelprojekt bietet eine vereinfachte und konsistente plattformübergreifende Entwicklungserfahrung, unabhängig von den Zielplattformen. Das .NET MAUI-Einzelprojekt bietet die folgenden Features:

• Ein freigegebenes Einzelprojekt, das auf Android, iOS, macOS, Tizen und Windows ausgerichtet werden kann.
• Eine vereinfachte Debugzielauswahl zum Ausführen Ihrer .NET MAUI-Apps.
• Freigegebene Ressourcendateien innerhalb des Einzelprojekts.
• Ein einzelnes App-Manifest, das den App-Titel, die ID und die Version angibt.
• Zugriff auf plattformspezifische APIs und Tools bei Bedarf.
• Ein einzelner plattformübergreifender App-Einstiegspunkt.

Das .NET MAUI-Einzelprojekt wird durch Multi-Targeting und die Verwendung von SDK-ähnlichen Projekten ermöglicht.

Ressourcendateien

Die Ressourcenverwaltung für die plattformübergreifende App-Entwicklung ist traditionell problematisch, da jede Plattform einen eigenen Ansatz für die Verwaltung von Ressourcen hat. Beispielsweise weist jede Plattform unterschiedliche Bildanforderungen auf, die in der Regel das Erstellen mehrerer Versionen jedes Bilds mit unterschiedlichen Auflösungen beinhalten. Daher muss ein einzelnes Bild in der Regel mehrmals in unterschiedlichen Auflösungen dupliziert werden, wobei die resultierenden Bilder unterschiedliche Dateinamen- und Ordnerkonventionen auf jeder Plattform verwenden müssen.

Mit dem .NET MAUI-Einzelprojekt können Ressourcendateien an einem einzigen Speicherort gespeichert werden, während sie auf jeder Plattform genutzt werden. Dazu gehören Schriftarten, Bilder, das App-Symbol, der Begrüßungsbildschirm, unformatierte Ressourcen und CSS-Dateien zum Formatieren von .NET MAUI-Apps. Jede Bildressourcendatei wird als Quellbild verwendet, aus dem Bilder der erforderlichen Auflösungen für jede Plattform zur Buildzeit generiert werden.

Hinweis

iOS-Ressourcenkataloge werden derzeit in .NET MAUI-Einzelprojekten nicht unterstützt.

Ressourcendateien sollten in der Regel im Ordner Ressourcen des .NET MAUI-App-Projekts oder in untergeordneten Ordnern des Ordners Ressourcen platziert werden und deren Buildaktion sollte ordnungsgemäß festgelegt sein. In der folgenden Tabelle sind die Buildaktionen für jeden Ressourcendateityp aufgeführt:

Resource	Buildvorgang
App Symbol	MauiIcon
Schriftarten	MauiFont
Bilder	MauiImage
Begrüßungsbildschirm	MauiSplashScreen
Rohressourcen	MauiAsset
CSS Dateien	MauiCss

Hinweis

XAML-Dateien werden auch in Ihrem .NET MAUI-App-Projekt gespeichert und werden automatisch der MauiXaml-Buildaktion zugewiesen, wenn sie von Projekt- und Elementvorlagen erstellt werden. In der Regel werden jedoch nur XAML-Ressourcenwörterbücher im Order Ressourcen des App-Projekts platziert.

Wenn ein .NET MAUI-App-Projekt eine Ressourcendatei hinzugefügt wird, wird ein entsprechender Eintrag für die Ressource in der Projektdatei mit Ausnahme von CSS-Dateien erstellt. Der folgende Screenshot zeigt einen typischen Ressourcen-Ordner mit untergeordneten Ordnern für jeden Ressourcentyp:

Die Buildaktion für eine Ressourcendatei wird korrekt festgelegt, wenn die Ressource dem richtigen untergeordneten Ressourcen-Ordner hinzugefügt wurde.

Untergeordnete Ordner des Ressourcen-Ordners können für jeden Ressourcentyp festgelegt werden, indem Sie die Projektdatei für Ihre App bearbeiten:

<ItemGroup>
    <!-- Images -->
    <MauiImage Include="Resources\Images\*" />

    <!-- Fonts -->
    <MauiFont Include="Resources\Fonts\*" />

    <!-- Raw assets -->
    <MauiAsset Include="Resources\Raw\*" />
</ItemGroup>

Das Platzhalterzeichen (*) gibt an, dass alle Dateien innerhalb des Ordners als der angegebene Ressourcentyp behandelt werden. Darüber hinaus ist es möglich, alle Dateien aus untergeordneten Ordnern einzuschließen:

<ItemGroup>
    <!-- Images -->
    <MauiImage Include="Resources\Images\**\*" />
</ItemGroup>

In diesem Beispiel gibt das doppelte Platzhalterzeichen („**“) an, dass der Ordner Bilder untergeordnete Ordner enthalten kann. Daher gibt <MauiImage Include="Resources\Images\**\*" /> an, dass alle Dateien im Ordner Ressourcen\Bilder oder in den Unterordnern des Ordners Bilder als Quellbilder verwendet werden, aus denen Bilder mit der erforderlichen Auflösung für jede Plattform erzeugt werden.

Plattformspezifische Ressourcen überschreiben ihre gemeinsamen Ressourcenentsprechungen. Wenn Sie z. B. ein Android-spezifisches Bild unter Platforms\Android\Resources\drawable-xhdpi\logo.png haben und zusätzlich ein freigegebenes Resources\Images\logo.svg-Bild bereitstellen, wird die Skalierbare Vektorgrafik (SVG)-Datei verwendet, um die benötigten Android-Bilder zu generieren, mit Ausnahme des XHDPI-Bildes, das bereits als plattformspezifisches Bild existiert.

App-Symbole

Sie können Ihrem App-Projekt ein App-Symbol hinzufügen, indem Sie ein Bild in den Ordner Resources\AppIcon des Projekts ziehen, wo seine Buildaktion automatisch auf MauiIcon gesetzt wird. Dies erzeugt einen entsprechenden Eintrag in Ihrer Projektdatei:

<MauiIcon Include="Resources\AppIcon\appicon.svg" />

Zum Zeitpunkt der Erstellung wird die Größe des App-Symbols auf die richtige Größe für die Zielplattform und das Zielgerät angepasst. Die angepassten App-Symbole werden dann zu Ihrem App-Paket hinzugefügt. App-Symbole werden an mehrere Auflösungen angepasst, da sie mehrfach verwendet werden, u.a. für die Darstellung der App auf dem Gerät und im App Store.

Weitere Informationen finden Sie unter Hinzufügen eines App-Symbols zu einem .NET MAUI-App-Projekt.

Bilder

Ein Bild kann zu Ihrem App-Projekt hinzugefügt werden, indem Sie es in den Ordner Resources\Images des Projekts ziehen, wo seine Buildaktion automatisch auf MauiImage gesetzt wird. Dies erzeugt einen entsprechenden Eintrag in Ihrer Projektdatei:

<MauiImage Include="Resources\Images\logo.svg" />

Zum Zeitpunkt der Erstellung können die Bilder an die richtige Auflösung für die Zielplattform und das Zielgerät angepasst werden. Die resultierenden Bilder werden dann zu Ihrem App-Paket hinzugefügt.

Weitere Informationen finden Sie unter Hinzufügen von Bildern zu einem .NET MAUI-App-Projekt.

Schriftarten

Sie können eine Schriftart im TrueType-Format (TTF) oder OpenType-Schriftart (OTF) zu Ihrem App-Projekt hinzufügen, indem Sie sie in den Ordner Resources\Fonts Ihres Projekts ziehen, wo ihre Buildaktion automatisch auf MauiFont gesetzt wird. Dadurch wird für jede Schriftart ein entsprechender Eintrag in der Projektdatei erzeugt:

<MauiFont Include="Resources\Fonts\OpenSans-Regular.ttf" />

Zum Zeitpunkt der Erstellung werden die Schriftarten in Ihr App-Paket kopiert.

Weitere Informationen finden Sie unter Schriftarten.

Begrüßungsbildschirm

Sie können einen Begrüßungsbildschirm zu Ihrem App-Projekt hinzufügen, indem Sie ein Bild in den Ordner Resources\Splash des Projekts ziehen, wo seine Buildaktion automatisch auf MauiSplashScreen gesetzt wird. Dies erzeugt einen entsprechenden Eintrag in Ihrer Projektdatei:

<ItemGroup>
  <MauiSplashScreen Include="Resources\Splash\splashscreen.svg" />
</ItemGroup>

Zum Zeitpunkt der Erstellung wird das Bild des Begrüßungsbildschirms an die richtige Größe für die Zielplattform und das Gerät angepasst. Der angepasste Begrüßungsbildschirm wird dann zu Ihrem App-Paket hinzugefügt.

Weitere Informationen finden Sie unter Hinzufügen eines Begrüßungsbildschirms zu einem .NET MAUI-App-Projekt.

Rohressourcen

Eine Roh-Asset-Datei, wie HTML, JSON und Video, kann zu Ihrem App-Projekt hinzugefügt werden, indem Sie sie in den Ordner Resources\Raw Ihres Projekts ziehen, wo ihre Buildaktion automatisch auf MauiAsset gesetzt wird. Dies erzeugt einen entsprechenden Eintrag pro Asset in Ihrer Projektdatei:

<MauiAsset Include="Resources\Raw\index.html" />

Rohressourcen können dann nach Bedarf von Steuerelementen genutzt werden:

<WebView Source="index.html" />

Zum Zeitpunkt der Erstellung werden die Rohressourcen in Ihr App-Paket kopiert. Informationen zum Deaktivieren der Paketierung von Ressourcen finden Sie unter Deaktivieren der Paketierung von Ressourcendateien.

CSS-Dateien

NET MAUI-Apps können teilweise mit Cascading Style Sheet (CSS)-Dateien formatiert werden. CSS-Dateien können zu Ihrem App-Projekt hinzugefügt werden, indem Sie sie in einen beliebigen Ordner Ihres Projekts ziehen und die Buildaktion im Fenster Eigenschaften auf MauiCss setzen.

CSS-Dateien müssen von der StyleSheet-Klasse geladen werden, bevor sie zu einem ResourceDictionary hinzugefügt werden:

<Application ...>
    <Application.Resources>
        <StyleSheet Source="/Resources/styles.css" />
    </Application.Resources>
</Application>

Weitere Informationen finden Sie unter Formatieren von Apps mit CSS.

App-Manifest

Jede Plattform verwendet ihre native App-Manifestdatei, um Informationen wie App-Titel, App-ID, App-Version und mehr anzugeben. Mit einem .NET MAUI-Einzelprojekt können Sie diese gemeinsamen Anwendungsdaten an einer einzigen Stelle in der Projektdatei angeben.

Um die gemeinsamen App-Manifestdaten für ein Projekt festzulegen, öffnen Sie im Projektmappen-Explorer das Kontextmenü für das Projekt und wählen Sie Eigenschaften. Der App-Titel, die App-ID und die App-Version können dann in MAUI Shared > Allgemein angegeben werden:

Zum Zeitpunkt der Erstellung werden die gemeinsamen App-Manifestdaten mit den plattformspezifischen Daten in der nativen App-Manifestdatei zusammengeführt, um die Manifestdatei für das App-Paket zu erstellen. Weitere Informationen finden Sie unter Projektkonfiguration in .NET MAUI – MAUI Shared.

Plattformspezifischer Code

Ein .NET MAUI-App-Projekt enthält einen Ordner Platforms, wobei jeder untergeordnete Ordner eine Plattform repräsentiert, die von .NET MAUI bedient werden kann:

Die Ordner für jede Plattform enthalten plattformspezifische Ressourcen und Code, der die App auf jeder Plattform startet:

Das Buildsystem bezieht zum Zeitpunkt der Erstellung nur den Code aus jedem Ordner ein, wenn es für die jeweilige Plattform erstellt wird. Wenn Sie zum Beispiel einen Build für Android erstellen, werden die Dateien im Ordner Platforms\Android in das App-Paket integriert, die Dateien in den anderen Platforms-Ordnern jedoch nicht. Dies nutzt die Multi-Targeting, um mit einem einzigen Projekt mehrere Plattformen zu bedienen. Multi-Targeting kann mit partiellen Klassen und Methoden kombiniert werden, um plattformspezifische Funktionen aus plattformübergreifendem Code aufzurufen. Weitere Informationen finden Sie unter Aufrufen von Plattformcode.

Zusätzlich zu diesem standardmäßigen Multi-Targeting können .NET MAUI-Apps auch auf der Grundlage Ihrer eigenen Dateinamen- und Ordnerkriterien das Multi-Targeting unterstützen. Damit können Sie Ihr .NET MAUI-App-Projekt so strukturieren, dass Sie Ihren Plattformcode nicht in Unterordnern des Ordners Platforms ablegen müssen. Weitere Informationen finden Sie unter Konfigurieren des Multi-Targeting.

Das Multi-targeting kann auch mit bedingter Kompilierung kombiniert werden, sodass Code auf bestimmte Plattformen ausgerichtet ist:

#if ANDROID
                  handler.NativeView.SetBackgroundColor(Colors.Red.ToNative());
#elif IOS
                  handler.NativeView.BackgroundColor = Colors.Red.ToNative();
                  handler.NativeView.BorderStyle = UIKit.UITextBorderStyle.Line;
#elif WINDOWS
                  handler.NativeView.Background = Colors.Red.ToNative();
#endif

Weitere Informationen über die bedingte Kompilierung finden Sie unter Bedingte Kompilierung.

Anwendungseinstiegspunkt

Während die Ordner Platforms plattformspezifischen Code enthalten, der die App auf jeder Plattform startet, verfügen .NET MAUI-Apps über einen einzigen plattformübergreifenden App-Einstiegspunkt. Jeder Plattformeinstiegspunkt ruft eine CreateMauiApp-Methode für die statische MauiProgram-Klasse in Ihrem App-Projekt auf und gibt eine MauiApp zurück, die den Einstiegspunkt für Ihre App darstellt.

Die MauiProgram-Klasse muss mindestens eine App bereitstellen, um ausgeführt werden zu können:

namespace MyMauiApp;

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>();

        return builder.Build();
    }
}  

Die App-Klasse leitet sich von der Application-Klasse ab:

namespace MyMauiApp;

public class App : Application
{
    public App()
    {
        InitializeComponent();

        MainPage = new AppShell();
    }
}

Im vorangegangenen Beispiel wird die Eigenschaft MainPage auf das Objekt AppShell gesetzt. AppShell ist eine untergeordnete Shell-Klasse, die die visuelle Hierarchie der App beschreibt. Weitere Informationen finden Sie unter Erstellen einer .NET MAUI Shell-App.