BrowserPage

Author: gluschenko

src/Wishmaster/Views/MainWindow.xaml

@@ -17,8 +17,6 @@
             <ColumnDefinition Width="*" />
         </Grid.ColumnDefinitions>
 
-        
-
         <wpfui:NavigationCompact
             x:Name="RootNavigation"
             Grid.Column="0"
@@ -70,13 +68,13 @@
 
                 <!--  Contains buttons responsible for maximizing, minimizing and closing the app. It also has a background colored strip that allows you to move the application around  -->
                 <wpfui:TitleBar
-                x:Name="RootTitleBar"
-                Grid.Row="0"
-                ForceShutdown="False"
-                MinimizeToTray="False"
-                ShowHelp="False"
-                UseSnapLayout="True"
-                Title="Wishmaster">
+                    x:Name="RootTitleBar"
+                    Grid.Row="0"
+                    ForceShutdown="False"
+                    MinimizeToTray="False"
+                    ShowHelp="False"
+                    UseSnapLayout="True"
+                    Title="Wishmaster">
                 </wpfui:TitleBar>
 
                 <Grid Grid.Row="1">

src/Wishmaster/Views/Pages/BrowserPage.xaml

@@ -5,14 +5,37 @@
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
       xmlns:local="clr-namespace:Wishmaster.Views.Pages"
       xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
+      xmlns:wpfui="clr-namespace:WPFUI.Controls;assembly=WPFUI"
       mc:Ignorable="d" 
       d:DesignHeight="400" d:DesignWidth="400"
       Title="BrowserPage">
 
     <Grid>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+
+        <Grid Grid.Row="0">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="5*" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+
+            <TextBox Grid.Column="0" x:Name="AddressTextBox" Text="https://google.com" />
+            <Button Grid.Column="1" Content="Go" Click="GoButton_Click" />
+        </Grid>
+
         <wv2:WebView2 
+            Grid.Row="1"
             Name="WebView"
-            Source="http://localhost:5080/index.html"
+            Source="https://google.com"
+            NavigationStarting="WebView_NavigationStarting"
+            NavigationCompleted="WebView_NavigationCompleted"
         />
+
+        <Grid x:Name="LoadingOverlay" Background="#C222" Grid.Row="1">
+            <wpfui:ProgressRing IsIndeterminate="True" />
+        </Grid>
     </Grid>
 </Page>

src/Wishmaster/Views/Pages/BrowserPage.xaml.cs

@@ -1,4 +1,5 @@
-using System.Windows.Controls;
+using System;
+using System.Windows.Controls;
 
 namespace Wishmaster.Views.Pages
 {
@@ -7,6 +8,41 @@ public partial class BrowserPage : Page
         public BrowserPage()
         {
             InitializeComponent();
+            Loaded += BrowserPage_Loaded;
+        }
+
+        private void BrowserPage_Loaded(object sender, System.Windows.RoutedEventArgs e)
+        {
+            WebView.Source = new Uri(AddressTextBox.Text);
+        }
+
+        private void GoButton_Click(object sender, System.Windows.RoutedEventArgs e)
+        {
+            try
+            {
+                var url = AddressTextBox.Text;
+
+                if (string.IsNullOrWhiteSpace(url))
+                {
+                    return;
+                }
+
+                WebView.Source = new Uri(AddressTextBox.Text);
+            }
+            catch
+            {
+                return;
+            }
+        }
+
+        private void WebView_NavigationStarting(object sender, Microsoft.Web.WebView2.Core.CoreWebView2NavigationStartingEventArgs e)
+        {
+            LoadingOverlay.Visibility = System.Windows.Visibility.Visible;
+        }
+
+        private void WebView_NavigationCompleted(object sender, Microsoft.Web.WebView2.Core.CoreWebView2NavigationCompletedEventArgs e)
+        {
+            LoadingOverlay.Visibility = System.Windows.Visibility.Hidden;
         }
     }
 }

src/Wishmaster/Views/Shared/WebView.xaml

@@ -0,0 +1,39 @@
+<UserControl x:Class="Wishmaster.Views.Shared.WebView"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             xmlns:local="clr-namespace:Wishmaster.Views.Shared"
+             xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
+             xmlns:wpfui="clr-namespace:WPFUI.Controls;assembly=WPFUI"
+             mc:Ignorable="d" 
+             d:DesignHeight="400" 
+             d:DesignWidth="400">
+    <Grid>
+
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+
+        <Grid Grid.Row="0">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="5*" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+
+            <TextBox Grid.Column="0" Text="https://google.com" />
+            <Button Grid.Column="1" Content="Go"/>
+        </Grid>
+
+        <wv2:WebView2 
+            Grid.Row="1"
+            Name="WebViewElement"
+            Source="http://localhost:5080/index.html"
+        />
+
+        <Grid x:Name="LoadingOverlay" Background="#C222" Grid.Row="1">
+            <wpfui:ProgressRing IsIndeterminate="True" />
+        </Grid>
+    </Grid>
+</UserControl>

src/Wishmaster/Views/Shared/WebView.xaml.cs

@@ -0,0 +1,30 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Data;
+using System.Windows.Documents;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Windows.Media.Imaging;
+using System.Windows.Navigation;
+using System.Windows.Shapes;
+
+namespace Wishmaster.Views.Shared
+{
+    public partial class WebView : UserControl
+    {
+        public WebView()
+        {
+            InitializeComponent();
+            Loaded += WebView_Loaded;
+        }
+
+        private async void WebView_Loaded(object sender, RoutedEventArgs e)
+        {
+            await WebViewElement.EnsureCoreWebView2Async();
+        }
+    }
+}