Browser work

2026-01-17 07:52:05 +00:00
parent 71f6aa1179
commit e9d4b84790
24 changed files with 159 additions and 50 deletions
--- a/WebViewDemo/App.xaml.cs
+++ b/WebViewDemo/App.xaml.cs
@@ -1,4 +1,4 @@
-// App.xaml.cs - Main Application with NavigationPage and Theme Support
+// App.xaml.cs - Main Application with Theme Support

 using Microsoft.Maui.Controls;

@@ -6,8 +6,6 @@ namespace WebViewDemo;

 public partial class App : Application
 {
-    public static NavigationPage? NavigationPage { get; private set; }
-
    public App()
    {
        InitializeComponent();
@@ -15,24 +13,18 @@ public partial class App : Application

    protected override Window CreateWindow(IActivationState? activationState)
    {
-        // Determine current theme for navigation bar colors
-        var isDarkMode = Current?.RequestedTheme == AppTheme.Dark;
-        var barBackground = isDarkMode ? Color.FromArgb("#3949AB") : Color.FromArgb("#5C6BC0");
-
-        NavigationPage = new NavigationPage(new WebViewPage())
+        return new Window(new WebViewPage())
        {
-            Title = "OpenMaui WebView Demo",
-            BarBackgroundColor = barBackground,
-            BarTextColor = Colors.White
+            Title = "OpenMaui Browser"
        };
+    }

-        // Update navigation bar when theme changes
-        Current!.RequestedThemeChanged += (s, e) =>
-        {
-            var dark = e.RequestedTheme == AppTheme.Dark;
-            NavigationPage.BarBackgroundColor = dark ? Color.FromArgb("#3949AB") : Color.FromArgb("#5C6BC0");
-        };
+    public static void ToggleTheme()
+    {
+        if (Current is null) return;

-        return new Window(NavigationPage);
+        Current.UserAppTheme = Current.UserAppTheme == AppTheme.Dark
+            ? AppTheme.Light
+            : AppTheme.Dark;
    }
 }
--- a/WebViewDemo/Pages/WebViewPage.xaml
+++ b/WebViewDemo/Pages/WebViewPage.xaml
@@ -2,14 +2,13 @@
 <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="WebViewDemo.WebViewPage"
-             Title="OpenMaui Browser"
             BackgroundColor="{AppThemeBinding Light={StaticResource PageBackgroundLight}, Dark={StaticResource PageBackgroundDark}}">

    <Grid RowDefinitions="Auto,*,Auto">

        <!-- Browser Toolbar -->
        <Grid Grid.Row="0"
-              ColumnDefinitions="Auto,Auto,Auto,*,Auto,Auto,Auto"
+              ColumnDefinitions="Auto,Auto,Auto,*,Auto,Auto,Auto,Auto"
              ColumnSpacing="4"
              Padding="8"
              BackgroundColor="{AppThemeBinding Light={StaticResource CardBackgroundLight}, Dark={StaticResource CardBackgroundDark}}">
@@ -22,6 +21,7 @@
                         HeightRequest="36"
                         Padding="8"
                         BackgroundColor="Transparent"
+                         VerticalOptions="Center"
                         Clicked="OnBackClicked"
                         ToolTipProperties.Text="Go Back" />

@@ -33,6 +33,7 @@
                         HeightRequest="36"
                         Padding="8"
                         BackgroundColor="Transparent"
+                         VerticalOptions="Center"
                         Clicked="OnForwardClicked"
                         ToolTipProperties.Text="Go Forward" />

@@ -44,6 +45,7 @@
                         HeightRequest="36"
                         Padding="8"
                         BackgroundColor="Transparent"
+                         VerticalOptions="Center"
                         Clicked="OnReloadClicked"
                         ToolTipProperties.Text="Reload Page" />

@@ -53,7 +55,8 @@
                    StrokeThickness="1"
                    Stroke="{AppThemeBinding Light={StaticResource BorderLight}, Dark={StaticResource BorderDark}}"
                    Padding="8,4"
-                    Margin="4,0">
+                    Margin="4,0"
+                    VerticalOptions="Center">
                <Border.StrokeShape>
                    <RoundRectangle CornerRadius="18" />
                </Border.StrokeShape>
@@ -78,6 +81,7 @@
                         Padding="8"
                         BackgroundColor="{StaticResource AccentColor}"
                         CornerRadius="18"
+                         VerticalOptions="Center"
                         Clicked="OnGoClicked"
                         ToolTipProperties.Text="Navigate" />

@@ -89,6 +93,7 @@
                         HeightRequest="36"
                         Padding="8"
                         BackgroundColor="Transparent"
+                         VerticalOptions="Center"
                         Clicked="OnLoadHtmlClicked"
                         ToolTipProperties.Text="Load Demo HTML" />

@@ -100,8 +105,21 @@
                         HeightRequest="36"
                         Padding="8"
                         BackgroundColor="Transparent"
+                         VerticalOptions="Center"
                         Clicked="OnEvalJsClicked"
                         ToolTipProperties.Text="Run JavaScript" />
+
+            <!-- Theme Toggle Button -->
+            <ImageButton Grid.Column="7"
+                         x:Name="ThemeToggleButton"
+                         Source="{AppThemeBinding Light=dark_mode.svg, Dark=light_mode.svg}"
+                         WidthRequest="36"
+                         HeightRequest="36"
+                         Padding="8"
+                         BackgroundColor="Transparent"
+                         VerticalOptions="Center"
+                         Clicked="OnThemeToggleClicked"
+                         ToolTipProperties.Text="Toggle Theme" />
        </Grid>

        <!-- Loading Progress Bar -->
--- a/WebViewDemo/Pages/WebViewPage.xaml.cs
+++ b/WebViewDemo/Pages/WebViewPage.xaml.cs
@@ -249,4 +249,20 @@ public partial class WebViewPage : ContentPage
            Console.WriteLine($"[WebViewPage] JS Error: {ex.Message}");
        }
    }
+
+    private void OnThemeToggleClicked(object? sender, EventArgs e)
+    {
+        Console.WriteLine("[WebViewPage] Theme toggle clicked");
+        Console.WriteLine($"[WebViewPage] Before: UserAppTheme={Application.Current?.UserAppTheme}, RequestedTheme={Application.Current?.RequestedTheme}");
+
+        App.ToggleTheme();
+
+        Console.WriteLine($"[WebViewPage] After: UserAppTheme={Application.Current?.UserAppTheme}, RequestedTheme={Application.Current?.RequestedTheme}");
+
+        var theme = Application.Current?.UserAppTheme == AppTheme.Dark ? "Dark" : "Light";
+        StatusLabel.Text = $"Theme: {theme}";
+
+        // Debug: Check what the ImageButton Source is now
+        Console.WriteLine($"[WebViewPage] ThemeToggleButton.Source = {ThemeToggleButton.Source}");
+    }
 }
--- a/WebViewDemo/Resources/Images/arrow_back_dark.svg
+++ b/WebViewDemo/Resources/Images/arrow_back_dark.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#FFFFFF" d="m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/arrow_back_light.svg
+++ b/WebViewDemo/Resources/Images/arrow_back_light.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#212121" d="m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#333333">
+  <path d="m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/arrow_forward_dark.svg
+++ b/WebViewDemo/Resources/Images/arrow_forward_dark.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#FFFFFF" d="M647-440H160v-80h487L423-744l57-56 320 320-320 320-57-56 224-224Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M647-440H160v-80h487L423-744l57-56 320 320-320 320-57-56 224-224Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/arrow_forward_light.svg
+++ b/WebViewDemo/Resources/Images/arrow_forward_light.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#212121" d="M647-440H160v-80h487L423-744l57-56 320 320-320 320-57-56 224-224Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#333333">
+  <path d="M647-440H160v-80h487L423-744l57-56 320 320-320 320-57-56 224-224Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/code_dark.svg
+++ b/WebViewDemo/Resources/Images/code_dark.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#FFFFFF" d="M320-240 80-480l240-240 57 57-184 184 183 183-56 56Zm320 0-57-57 184-184-183-183 56-56 240 240-240 240Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M320-240 80-480l240-240 57 57-184 184 183 183-56 56Zm320 0-57-57 184-184-183-183 56-56 240 240-240 240Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/code_light.svg
+++ b/WebViewDemo/Resources/Images/code_light.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#212121" d="M320-240 80-480l240-240 57 57-184 184 183 183-56 56Zm320 0-57-57 184-184-183-183 56-56 240 240-240 240Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#333333">
+  <path d="M320-240 80-480l240-240 57 57-184 184 183 183-56 56Zm320 0-57-57 184-184-183-183 56-56 240 240-240 240Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/dark_mode.svg
+++ b/WebViewDemo/Resources/Images/dark_mode.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M480-120q-150 0-255-105T120-480q0-150 105-255t255-105q14 0 27.5 1t26.5 3q-41 29-65.5 75.5T444-660q0 90 63 153t153 63q55 0 101-24.5t75-65.5q2 13 3 26.5t1 27.5q0 150-105 255T480-120Zm0-80q88 0 158-48.5T740-375q-20 5-40 8t-40 3q-123 0-209.5-86.5T364-660q0-20 3-40t8-40q-78 32-126.5 102T200-480q0 116 82 198t198 82Zm-10-270Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/light_mode.svg
+++ b/WebViewDemo/Resources/Images/light_mode.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M480-360q50 0 85-35t35-85q0-50-35-85t-85-35q-50 0-85 35t-35 85q0 50 35 85t85 35Zm0 80q-83 0-141.5-58.5T280-480q0-83 58.5-141.5T480-680q83 0 141.5 58.5T680-480q0 83-58.5 141.5T480-280ZM200-440H40v-80h160v80Zm720 0H760v-80h160v80ZM440-760v-160h80v160h-80Zm0 720v-160h80v160h-80ZM256-650l-101-97 57-59 96 100-52 56Zm492 496-97-101 53-55 101 97-57 59Zm-98-550 97-101 59 57-100 96-56-52ZM154-212l101-97 55 53-97 101-59-57Zm326-268Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/play_arrow_dark.svg
+++ b/WebViewDemo/Resources/Images/play_arrow_dark.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#FFFFFF" d="M320-200v-560l440 280-440 280Zm80-280Zm0 134 210-134-210-134v268Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M320-200v-560l440 280-440 280Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/play_arrow_light.svg
+++ b/WebViewDemo/Resources/Images/play_arrow_light.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#212121" d="M320-200v-560l440 280-440 280Zm80-280Zm0 134 210-134-210-134v268Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#333333">
+  <path d="M320-200v-560l440 280-440 280Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/refresh_dark.svg
+++ b/WebViewDemo/Resources/Images/refresh_dark.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#FFFFFF" d="M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/refresh_light.svg
+++ b/WebViewDemo/Resources/Images/refresh_light.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#212121" d="M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#333333">
+  <path d="M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/send_dark.svg
+++ b/WebViewDemo/Resources/Images/send_dark.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#FFFFFF" d="M120-160v-640l760 320-760 320Zm80-120 474-200-474-200v140l240 60-240 60v140Zm0 0v-400 400Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M120-160v-640l760 320-760 320Zm80-120 474-200-474-200v140l240 60-240 60v140Zm0 0v-400 400Z"/>
+</svg>
--- a/WebViewDemo/Resources/Images/send_light.svg
+++ b/WebViewDemo/Resources/Images/send_light.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#212121" d="M120-160v-640l760 320-760 320Zm80-120 474-200-474-200v140l240 60-240 60v140Zm0 0v-400 400Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="#FFFFFF">
+  <path d="M120-160v-640l760 320-760 320Zm80-120 474-200-474-200v140l240 60-240 60v140Zm0 0v-400 400Z"/>
+</svg>
--- a/WebViewDemo/WebViewDemo.csproj
+++ b/WebViewDemo/WebViewDemo.csproj
@@ -12,17 +12,24 @@
    <ApplicationId>com.openmaui.webviewdemo</ApplicationId>
    <ApplicationVersion>1.0.0</ApplicationVersion>

-    <!-- MAUI Settings -->
-    <UseMaui>true</UseMaui>
+    <!-- MAUI Settings (conditional based on platform) -->
    <SingleProject>true</SingleProject>
    <EnableDefaultXamlItems>true</EnableDefaultXamlItems>
+  </PropertyGroup>

-    <!-- Linux Runtime -->
+  <!-- Non-Linux platforms: Use official MAUI workload -->
+  <PropertyGroup Condition="!$([MSBuild]::IsOSPlatform('Linux'))">
+    <UseMaui>true</UseMaui>
+    <TargetFrameworks>net9.0-android;net9.0-ios;net9.0-maccatalyst;net9.0-windows10.0.19041.0</TargetFrameworks>
+  </PropertyGroup>
+
+  <!-- Linux: Use OpenMaui -->
+  <PropertyGroup Condition="$([MSBuild]::IsOSPlatform('Linux'))">
    <RuntimeIdentifiers>linux-x64;linux-arm64</RuntimeIdentifiers>
  </PropertyGroup>

-  <ItemGroup>
-    <!-- OpenMaui Linux Platform (local development reference) -->
+  <!-- OpenMaui Linux Platform (used on Linux) -->
+  <ItemGroup Condition="$([MSBuild]::IsOSPlatform('Linux'))">
    <ProjectReference Include="../../maui-linux/OpenMaui.Controls.Linux.csproj" />
  </ItemGroup>

@@ -31,9 +38,12 @@
    <MauiXaml Update="**/*.xaml" />
  </ItemGroup>

-  <!-- Embedded Resources (icons) -->
+  <!-- Images -->
  <ItemGroup>
-    <EmbeddedResource Include="Resources\Images\*.svg" />
+    <MauiImage Include="Resources\Images\*.svg" />
  </ItemGroup>

+  <!-- Import OpenMaui targets for Linux builds -->
+  <Import Project="../../maui-linux/build/OpenMaui.Controls.Linux.targets" Condition="$([MSBuild]::IsOSPlatform('Linux'))" />
+
 </Project>
--- a/WebViewDemo/run.sh
+++ b/WebViewDemo/run.sh
@@ -0,0 +1,8 @@
+#!/bin/bash
+
+# Set .NET environment for desktop launcher compatibility
+export DOTNET_ROOT="$HOME/.dotnet"
+export PATH="$DOTNET_ROOT:$PATH"
+
+cd "$(dirname "$0")/bin/Debug/net9.0"
+exec ./WebViewDemo "$@"