Zum Inhalt springen
Heim > Erstellen Sie Desktop- und mobile Benutzeroberflächen mit Blazor Hybrid Apps

Erstellen Sie Desktop- und mobile Benutzeroberflächen mit Blazor Hybrid Apps

    Das Engagement von Microsoft für eine Multiplattform-Welt ist wahrscheinlich eine der größten Veränderungen an seiner Wachstumsplattform in den letzten Jahren. Mit dem Kauf von auf mobilen Geräten.

    Ich habe kürzlich das Wachstum des Nachfolgers der plattformübergreifenden UI-Tools von Xamarin bemerkt: .NETs Multiplatform App UI oder MAUI. Damit verbunden ist ein weiteres neues Benutzeroberflächenerlebnis von Microsoft, das diese Internetfunktionen umfassend auf Ihre Geräte und Ihren Desktop übertragen soll. Aufbauend auf dem Höhepunkt des vielseitigen Blazor Internet UI Frameworks kombiniert Blazor Hybrid die beiden angewandten Wissenschaften, um Ihnen eine Möglichkeit zum Erstellen von Benutzeroberflächen zu bieten, die sich über Desktop und Mobilgeräte erstrecken, einschließlich der Unterstützung nativ gerenderter Steuerelemente. auf allen Plattformen.

    Modernes Internet und modernes Wachstum gehen Hand in Hand

    Es gibt viel Gutes an diesem Ansatz für Benutzeroberflächen. Einerseits baut es auf dem auf, was ich für die wichtigste Lektion des letzten Jahrzehnts im Internet halte: Zuerst müssen wir unsere APIs entwerfen. Dadurch wird die Benutzeroberfläche einfach zu einem weiteren API-Konsumenten, der REST und JSON verwendet, um mit Microservices zu kommunizieren. Wir können dann viele alternative Benutzeroberflächen haben, die auf dasselbe Ziel hinarbeiten, alle dieselben Aufrufe verwenden und die gleiche Auswirkung auf unseren Service haben. Es vereinfacht das Design und ermöglicht uns eine vorhersehbare Skalierung von Versorgungsarchitekturen. Gleichzeitig bedeutet ein fester und schneller Satz von APIs, dass Serviceeigentümer ihren Code ersetzen und verbessern können, ohne dass dies Auswirkungen auf die Käufer hat.

    Diese Methode hat zur Entstehung von Ideen wie Jamstack geführt, das JavaScript, APIs und Markup verwendet, um dynamische statische Websites bereitzustellen und so das Design und die Veröffentlichung von Internetdiensten zu vereinfachen. Blazor Hybrid übernimmt diese Ideen und bringt sie in Ihren Code ein, überspringt dabei den Browser und integriert eine Rendering-Ebene neben dem Rest Ihres Dienstprogramms. Sie können am wichtigen Standort offline arbeiten, ein Modell, das bei der Arbeit mit geschlossenen Umgebungen wie der Bildungsplattform Windows 11 SE noch viel faszinierender wird.

    Blazor Hybrid in MAUI

    h2>

    Die MAUI-Unterstützung für Blazor Hybrid ist ein faszinierendes Feature der neuen Plattform; Es erweitert Sie über die Grenzen herkömmlicher Desktop- und Mobilgeräte hinaus, sodass Sie persönliche Erlebniskomponenten für Internetzwecke teilen können. Auf der Online-Seite gibt es die Option von ASP.NET Core, um Code über verschiedene Aufgaben hinweg gemeinsam zu nutzen, die Arbeitsbelastung der Entwickler zu reduzieren und es Ihnen zu ermöglichen, einmal zu entwickeln und dann an alle Ihre Zielumgebungen zu versenden. Auch wenn es unwahrscheinlich ist, dass ASP.NET Core-Aufgaben Teil derselben Herausforderung wie MAUI-Code sind, können sie Teil derselben Lösung sein und der Code kann bei Bedarf zwischen Aufgaben kopiert werden.

    Blazor Hybrid befindet sich derzeit in der Vorschau, es lohnt sich jedoch, es zu erkunden, wenn Sie die Reichweite der aktuellen Internetzwecke von ASP.NET Core erweitern möchten. Der erste einfache Schritt besteht darin, eine MAUI-Anwendung zum Hosten Ihres Codes zu erstellen, obwohl Sie nicht auf eine .NET-UI-Methode beschränkt sind, insbesondere wenn Sie beabsichtigen, Windows-Käufern aktuelle Desktop-Versionen des Internets für den Unternehmenszweck bereitzustellen. p>

    Das Erstellen eines Blazor Hybrid MAUI-Dienstprogramms erfolgt wie das Erstellen aller anderen MAUI-Dienstprogramme. Das auf Chromium basierende WebView2-Management hostet seinen Code in Windows. Nicht-Home-Windows-Plattformen verwenden ihre eigenen Internet-Dienstprogramm-Hosts für Blazor-Inhalte. Nebenbei bemerkt sollte dies keinen Sinn haben, da Android einen Chromium-Browser verwendet und Safari, das auf iOS gehostet wird, zwar nicht über alle Funktionen von Chrome verfügt, aber die Teile von Blazor unterstützen sollte.

    Wenn Sie MAUI in Visible Studio 2022 Preview genau organisiert haben, müssen Sie die Option zum Erstellen einer .NET MAUI Blazor-Anwendung entdecken. Durch die Erstellung dieser Lösung entsteht eine neue C#-Herausforderung mit den erforderlichen Plattformabhängigkeiten für alle Ihre Zielumgebungen. Die Herausforderung erstellt eine Blazor-Kern-Benutzeroberfläche, die ausgeführt und tatsächlich für Variationen vorbereitet werden kann.

    Ein vorgefertigtes Gerüst ist sehr hilfreich, da es die beste Möglichkeit zum Hosten eines BlazorWebView< /a> im XAML Ihres Dienstprogramms und die beste Möglichkeit zur Verwendung von Razor-Inhalten im gehosteten HTML zeigt. Da sich der Großteil der UI-Logik des Dienstprogramms möglicherweise im ASP .NET Core Razor-Code befindet, der in WebView mit Teilen von Blazor gehostet wird, gibt es nicht viel anderes zu tun, bevor Sie mit dem Schreiben Ihrer Internet-UI beginnen.

    Der Wert hier wird in MAUI nicht groß sein, da es clientseitigen Blazor-Code ausführt. MAUI bietet einen nützlichen plattformübergreifenden Host für Ihren Razor-Code, und während Ihre C#-Erfahrung auf beiden Seiten der WebView-Kluft gut funktioniert, ist es am wichtigsten, eine responsive Blazor-Webseite zu erstellen, die für Telefone und PCs skalierbar ist.</p>

    Blazor Hybrid unter Windows Home .NET

    Für Blazor Hybrid sind Sie nicht auf MAUI beschränkt. Es muss sich außerdem um einen unterstützten Workload für normale Windows .NET-UI-Tools handeln, sodass Sie ihn in bekannten Frameworks wie Windows Presentation Base oder Windows-Varianten verwenden müssen. Da es sich um eine Vorschauversion handelt, müssen Sie eine Vorschauversion von Visible Studio 2022 mit installierten .NET-Desktop-Entwicklungstools ausführen.

    Nachdem Sie Ihre Tools organisiert haben, erstellen Sie ein reguläres WPF-Dienstprogramm mit .NET 6 oder höher. (Sie müssen die aktuelle Vorschauversion von .NET 7 verwenden, wenn Sie wirklich am Rande des .NET-Wachstums stehen möchten.) Konfigurieren Sie als Nächstes den WebView WPF NuGet-Paketmanager zum Hosten Ihres Blazor-Codes. Sobald dies eingegeben ist, können Sie mit dem Codieren beginnen und das Razor SDK verwenden, um die Blazor-UI-Komponenten Ihrer App zu erstellen.

    Dies hilft Ihnen nun, Teile von Blazor in Ihrem Dienstprogramm zu verwenden und dabei dieselben Methoden zu verwenden, die wir zum Hinzufügen von HTML und JavaScript zu WebView-Benutzeroberflächen verwenden. Sobald Sie das Framework eines Online-Dienstprogramms erhalten haben, können Sie mit der Razor-Syntax von Blazor beginnen, Teile und Inline-Code zu Ihrem HTML hinzuzufügen. Wenn Sie mit der veralteten ASP-Syntax aus der Zeit vor .NET vertraut sind, ist Razor möglicherweise sehr vertraut mit dem in Ihren HTML-Code integrierten C# zusammen mit Razor-Anweisungen, um die Leistung von Schaltflächen zu erhöhen und Anzeigeteile zu laden, die außerhalb des Codes C# verwaltet werden können .

    Vergessen Sie nicht, das XAML Ihrer Ansicht zu bearbeiten, um eine BlazorWebView zu konfigurieren, die die native URL Ihres Inhalts als Zielseite verwendet. Es ist dann besser, jeden Blazor-Code kompilieren und ausführen zu können, ihn für die Verbindung mit Backend-Unternehmen zu verwenden oder mit nativen Inhalten zu arbeiten, indem Sie Internetanwendungen in Ihren .NET-Code einbetten.

    Es ist faszinierend zu sehen, wie Microsoft auf diese Weise mit seinen UI-Plattformen experimentiert. Nachdem endlich ein einziges plattformübergreifendes .NET bereitgestellt wurde, ist diese Methode – die MAUI mit ASP.NET Core zusammenführt – jetzt etwas einfacher zu versenden. Auch wenn es noch am Anfang steht, gibt es hier durchaus vielversprechende Ergebnisse und ein Modell, das die Benutzeroberflächen noch über die vier beliebtesten Desktop- und mobilen Arbeitstechniken hinaus erweitern würde.

    0