From 103b84739f56281aac789af43a6b4725116fd18d Mon Sep 17 00:00:00 2001 From: Vijay Anand E G <81947404+egvijayanand@users.noreply.github.com> Date: Thu, 12 Sep 2024 11:37:33 +0530 Subject: [PATCH] HybridWebView sample updated to .NET MAUI 9 RC1 --- src/NET_9/HybridWebViewApp/App.xaml.cs | 2 +- src/NET_9/HybridWebViewApp/MainWindow.xaml | 14 +++ src/NET_9/HybridWebViewApp/MainWindow.xaml.cs | 15 +++ .../Resources/Raw/wwwroot/index.html | 41 ++++---- .../Resources/Raw/wwwroot/scripts/hwv.js | 95 ++++++++++++------- .../HybridWebViewApp/Views/MainPage.xaml | 2 +- .../HybridWebViewApp/Views/MainPage.xaml.cs | 17 ++-- 7 files changed, 126 insertions(+), 60 deletions(-) create mode 100644 src/NET_9/HybridWebViewApp/MainWindow.xaml create mode 100644 src/NET_9/HybridWebViewApp/MainWindow.xaml.cs diff --git a/src/NET_9/HybridWebViewApp/App.xaml.cs b/src/NET_9/HybridWebViewApp/App.xaml.cs index eee3858..457f14d 100644 --- a/src/NET_9/HybridWebViewApp/App.xaml.cs +++ b/src/NET_9/HybridWebViewApp/App.xaml.cs @@ -9,6 +9,6 @@ public App() } protected override Window CreateWindow(IActivationState? activationState) - => new Window(new MainPage()) { Title = "HybridWebViewApp" }; + => new MainWindow(); } } diff --git a/src/NET_9/HybridWebViewApp/MainWindow.xaml b/src/NET_9/HybridWebViewApp/MainWindow.xaml new file mode 100644 index 0000000..7a9f639 --- /dev/null +++ b/src/NET_9/HybridWebViewApp/MainWindow.xaml @@ -0,0 +1,14 @@ + + + + + + diff --git a/src/NET_9/HybridWebViewApp/MainWindow.xaml.cs b/src/NET_9/HybridWebViewApp/MainWindow.xaml.cs new file mode 100644 index 0000000..8f61f39 --- /dev/null +++ b/src/NET_9/HybridWebViewApp/MainWindow.xaml.cs @@ -0,0 +1,15 @@ +namespace HybridWebViewApp +{ + public partial class MainWindow : Window + { + public MainWindow() + { + InitializeComponent(); + } + + public MainWindow(Page page) : base(page) + { + InitializeComponent(); + } + } +} diff --git a/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/index.html b/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/index.html index b52d0d5..9d03423 100644 --- a/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/index.html +++ b/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/index.html @@ -10,6 +10,16 @@ + + +

HybridWebView App!

+
+ + +
+
+ Messages from .NET: +
- - -

HybridWebView App!

-
- - -
-
- Messages from .NET: -
diff --git a/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/scripts/hwv.js b/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/scripts/hwv.js index 767ad14..337c388 100644 --- a/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/scripts/hwv.js +++ b/src/NET_9/HybridWebViewApp/Resources/Raw/wwwroot/scripts/hwv.js @@ -1,49 +1,78 @@ -function HybridWebViewInit() -{ - function DispatchHybridWebViewMessage(message) { - const event = new CustomEvent("HybridWebViewMessageReceived", { detail: { message: message } }); - window.dispatchEvent(event); - } +window.HybridWebView = { + "Init": function () { + function DispatchHybridWebViewMessage(message) { + const event = new CustomEvent("HybridWebViewMessageReceived", { detail: { message: message } }); + window.dispatchEvent(event); + } - if (window.chrome && window.chrome.webview) { - // Windows WebView2 - window.chrome.webview.addEventListener('message', arg => { - DispatchHybridWebViewMessage(arg.data); - }); - } - else if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.webwindowinterop) { - // iOS and MacCatalyst WKWebView - window.external = { - "receiveMessage": message => { - DispatchHybridWebViewMessage(message); - } - }; - } - else { - // Android WebView - window.addEventListener('message', arg => { - DispatchHybridWebViewMessage(arg.data); - }); - } -} + if (window.chrome && window.chrome.webview) { + // Windows WebView2 + window.chrome.webview.addEventListener('message', arg => { + DispatchHybridWebViewMessage(arg.data); + }); + } + else if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.webwindowinterop) { + // iOS and MacCatalyst WKWebView + window.external = { + "receiveMessage": message => { + DispatchHybridWebViewMessage(message); + } + }; + } + else { + // Android WebView + window.addEventListener('message', arg => { + DispatchHybridWebViewMessage(arg.data); + }); + } + }, -window.HybridWebView = -{ "SendRawMessage": function (message) { + window.HybridWebView.__SendMessageInternal('RawMessage', message); + }, + + "__SendMessageInternal": function (type, message) { + + const messageToSend = type + '|' + message; if (window.chrome && window.chrome.webview) { // Windows WebView2 - window.chrome.webview.postMessage(message); + window.chrome.webview.postMessage(messageToSend); } else if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.webwindowinterop) { // iOS and MacCatalyst WKWebView - window.webkit.messageHandlers.webwindowinterop.postMessage(message); + window.webkit.messageHandlers.webwindowinterop.postMessage(messageToSend); } else { // Android WebView - hybridWebViewHost.sendRawMessage(message); + hybridWebViewHost.sendMessage(messageToSend); } + }, + + "InvokeMethod": function (taskId, methodName, args) { + if (methodName[Symbol.toStringTag] === 'AsyncFunction') { + // For async methods, we need to call the method and then trigger the callback when it's done + const asyncPromise = methodName(...args); + asyncPromise + .then(asyncResult => { + window.HybridWebView.__TriggerAsyncCallback(taskId, asyncResult); + }) + .catch(error => console.error(error)); + } else { + // For sync methods, we can call the method and trigger the callback immediately + const syncResult = methodName(...args); + window.HybridWebView.__TriggerAsyncCallback(taskId, syncResult); + } + }, + + "__TriggerAsyncCallback": function (taskId, result) { + // Make sure the result is a string + if (result && typeof (result) !== 'string') { + result = JSON.stringify(result); + } + + window.HybridWebView.__SendMessageInternal('InvokeMethodCompleted', taskId + '|' + result); } } -HybridWebViewInit(); +window.HybridWebView.Init(); diff --git a/src/NET_9/HybridWebViewApp/Views/MainPage.xaml b/src/NET_9/HybridWebViewApp/Views/MainPage.xaml index ab59b86..74d523e 100644 --- a/src/NET_9/HybridWebViewApp/Views/MainPage.xaml +++ b/src/NET_9/HybridWebViewApp/Views/MainPage.xaml @@ -38,7 +38,7 @@ Light={StaticResource Primary}}">