Updates for preview 14

src/WeatherTwentyOne/App.xaml

@@ -1,10 +1,8 @@
 <Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             xmlns:windows="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.WindowsSpecific;assembly=Microsoft.Maui.Controls"
              xmlns:local="clr-namespace:WeatherTwentyOne"
              xmlns:page="clr-namespace:WeatherTwentyOne.Pages"
-             x:Class="WeatherTwentyOne.App"
-             windows:Application.ImageDirectory="Assets">
+             x:Class="WeatherTwentyOne.App">
     <Application.Resources>
         <ResourceDictionary Source="Resources/Styles/DefaultTheme.xaml"/>
     </Application.Resources>

src/WeatherTwentyOne/App.xaml.cs

@@ -10,7 +10,7 @@ public App()
 
         //App.Current.UserAppTheme = OSAppTheme.Light;
 
-        if (Device.Idiom == TargetIdiom.Phone)
+        if (DeviceInfo.Idiom == DeviceIdiom.Phone)
             Shell.Current.CurrentItem = PhoneTabs;
 
         Routing.RegisterRoute("settings", typeof(SettingsPage));

src/WeatherTwentyOne/MauiProgram.cs

@@ -1,4 +1,6 @@
 using Microsoft.Maui.LifecycleEvents;
+using WeatherTwentyOne.Pages;
+using WeatherTwentyOne.ViewModels;
 
 namespace WeatherTwentyOne;
 
@@ -16,16 +18,19 @@ public static MauiApp CreateMauiApp()
             });
         builder.ConfigureLifecycleEvents(lifecycle => {
 #if WINDOWS
-        lifecycle
-            .AddWindows(windows =>
-                windows.OnNativeMessage((app, args) => {
-                    if (WindowExtensions.Hwnd == IntPtr.Zero)
-                    {
-                        WindowExtensions.Hwnd = args.Hwnd;
-                        WindowExtensions.SetIcon("Platforms/Windows/trayicon.ico");
-                    }
-                    app.ExtendsContentIntoTitleBar = false;
-                }));
+        //lifecycle
+        //    .AddWindows(windows =>
+        //        windows.OnNativeMessage((app, args) => {
+        //            if (WindowExtensions.Hwnd == IntPtr.Zero)
+        //            {
+        //                WindowExtensions.Hwnd = args.Hwnd;
+        //                WindowExtensions.SetIcon("Platforms/Windows/trayicon.ico");
+        //            }
+        //        }));
+
+            lifecycle.AddWindows(windows => windows.OnWindowCreated((del) => {
+                del.ExtendsContentIntoTitleBar = true;
+            }));
 #endif
         });
 
@@ -37,6 +42,8 @@ public static MauiApp CreateMauiApp()
             services.AddSingleton<ITrayService, MacCatalyst.TrayService>();
             services.AddSingleton<INotificationService, MacCatalyst.NotificationService>();
 #endif
+        services.AddSingleton<HomeViewModel>();
+        services.AddSingleton<HomePage>();
 
 
 

src/WeatherTwentyOne/Pages/FavoritesPage.xaml.cs

@@ -15,22 +15,22 @@ protected override async void OnAppearing()
     {
         base.OnAppearing();
 
-        //await Task.Delay(300);
-        //TransitionIn();
+        await Task.Delay(300);
+        TransitionIn();
     }
 
     async void TransitionIn()
     {
         foreach (var item in tiles)
         {
-            item.FadeTo(1, 800);
+            await item.FadeTo(1, 800);
             await Task.Delay(50);
         }
     }
 
     int tileCount = 0;
     List<Frame> tiles = new List<Frame>();
-    async void OnHandlerChanged(object sender, EventArgs e)
+    void OnHandlerChanged(object sender, EventArgs e)
     {
         Frame f = (Frame)sender;
         tiles.Add(f);

src/WeatherTwentyOne/Pages/HomePage.xaml

@@ -5,9 +5,27 @@
     xmlns:v="clr-namespace:WeatherTwentyOne.Views"
     xmlns:ios="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;assembly=Microsoft.Maui.Controls"
     ios:Page.UseSafeArea="True"
-    Title="Redmond, WA"
+    Title="St. Louis, Missouri USA"
     x:Class="WeatherTwentyOne.Pages.HomePage">
 
+    <ContentPage.MenuBarItems>
+        <MenuBarItem Text="File">
+            <MenuFlyoutItem Text="Quit" Command="{Binding QuitCommand}"/>
+        </MenuBarItem>
+        <MenuBarItem Text="Locations">
+            <MenuFlyoutSubItem Text="Change Location">
+                <MenuFlyoutItem Text="Boston, MA"/>
+                <MenuFlyoutItem Text="Redmond, WA"/>
+                <MenuFlyoutItem Text="St. Louis, MO"/>
+            </MenuFlyoutSubItem>
+            <MenuFlyoutItem Text="Add a Location" Command="{Binding AddLocationCommand}"/>
+        </MenuBarItem>
+        <MenuBarItem Text="View">
+            <MenuFlyoutItem Text="Refresh" Command="{Binding RefreshCommand}"/>
+            <MenuFlyoutItem Text="Toggle Light/Dark Mode" Command="{Binding ToggleModeCommand}"/>
+        </MenuBarItem>
+    </ContentPage.MenuBarItems>
+
     <Grid
         ColumnDefinitions="{OnIdiom Phone='*', Default='*,500'}"
         RowDefinitions="*"
@@ -18,7 +36,7 @@
             <VerticalStackLayout
                 Padding="{OnIdiom Phone='0,50',Default='0,50'}"
                 Spacing="{OnIdiom Phone=25,Default=50}">
-
+                
                 <!-- Top widgets -->
                 <FlexLayout
                     IsVisible="{OnIdiom Phone=False, Default=True}"
@@ -28,9 +46,10 @@
                     JustifyContent="SpaceEvenly">
                     <v:CurrentWidget
                         WidthRequest="200" />
-                    <v:WindLiveWidget
+                    <v:WindLiveWidget 
                         x:Name="WindWidget"
                         WidthRequest="200" />
+
                 </FlexLayout>
 
                 <v:CurrentWidget

src/WeatherTwentyOne/Pages/HomePage.xaml.cs

@@ -1,6 +1,7 @@
 using System.Diagnostics;
 using Microsoft.Maui.Controls.PlatformConfiguration.WindowsSpecific;
 using WeatherTwentyOne.Services;
+using WeatherTwentyOne.ViewModels;
 using Application = Microsoft.Maui.Controls.Application;
 using WindowsConfiguration = Microsoft.Maui.Controls.PlatformConfiguration.Windows;
 
@@ -10,10 +11,12 @@ public partial class HomePage : ContentPage
 {
     static bool isSetup = false;
 
-    public HomePage()
+    public HomePage(HomeViewModel vm)
     {
         InitializeComponent();
 
+        BindingContext = vm;
+
         if (!isSetup)
         {
             isSetup = true;

src/WeatherTwentyOne/Platforms/Windows/Package.appxmanifest

@@ -34,19 +34,19 @@
         DisplayName="WeatherTwentyOne"
         Description="WeatherTwentyOne"
         BackgroundColor="transparent"
-        Square150x150Logo="Assets\appiconMediumTile.png"
-        Square44x44Logo="Assets\appiconLogo.png">
+        Square150x150Logo="appiconMediumTile.png"
+        Square44x44Logo="appiconLogo.png">
         <uap:DefaultTile
-          Wide310x150Logo="Assets\appiconWideTile.png"
-          Square71x71Logo="Assets\appiconSmallTile.png"
-          Square310x310Logo="Assets\appiconLargeTile.png"
+          Wide310x150Logo="appiconWideTile.png"
+          Square71x71Logo="appiconSmallTile.png"
+          Square310x310Logo="appiconLargeTile.png"
           ShortName="WeatherTwentyOne">
           <uap:ShowNameOnTiles>
             <uap:ShowOn Tile="square150x150Logo"/>
             <uap:ShowOn Tile="wide310x150Logo"/>
           </uap:ShowNameOnTiles>
         </uap:DefaultTile >
-        <uap:SplashScreen Image="Assets\appiconfgSplashScreen.png" />
+        <uap:SplashScreen Image="appiconfgSplashScreen.png" />
       </uap:VisualElements>
     </Application>
   </Applications>

src/WeatherTwentyOne/Resources/Styles/DefaultTheme.xaml

@@ -148,7 +148,7 @@
         <Setter Property="FontSize"
                 Value="14"/>
         <Setter Property="TextColor"
-                Value="{AppThemeBinding Light={StaticResource MidGray}, Dark={StaticResource TabOff}}"/>
+                Value="{AppThemeBinding Light={StaticResource DarkGray}, Dark={StaticResource TabOff}}"/>
     </Style>
     <Style TargetType="Label"
             Class="Footnote">

src/WeatherTwentyOne/ViewModels/HomeViewModel.cs

@@ -1,16 +1,50 @@
-using WeatherTwentyOne.Models;
+using System.ComponentModel;
+using System.Runtime.CompilerServices;
+using WeatherTwentyOne.Models;
 
 namespace WeatherTwentyOne.ViewModels;
 
-public class HomeViewModel
+public class HomeViewModel : INotifyPropertyChanged
 {
     public List<Forecast> Week { get; set; }
 
     public List<Forecast> Hours { get; set; }
 
+    public Command QuitCommand { get; set; } = new Command(() => {
+        Application.Current.Quit();
+    });
+
+    public Command AddLocationCommand { get; set; } = new Command(() => {
+        // nav to modal form
+    });
+
+    public Command<string> ChangeLocationCommand { get; set; } = new Command<string>((location) => {
+        // change primary location
+    });
+
+    public Command RefreshCommand { get; set; } = new Command(() => {
+        // fake a refresh call
+    });
+
+    private Command toggleModeCommand;
+
+    public Command ToggleModeCommand {
+        get {
+            return toggleModeCommand;
+        }
+        set {
+            toggleModeCommand = value;
+            OnPropertyChanged();
+        }
+    }
+
     public HomeViewModel()
     {
         InitData();
+
+        ToggleModeCommand = new Command(() => {
+            App.Current.UserAppTheme = App.Current.UserAppTheme == AppTheme.Light ? AppTheme.Dark : AppTheme.Light;
+        });
     }
 
     private void InitData()
@@ -248,4 +282,14 @@ private void InitData()
                 }
             };
     }
+
+    public event PropertyChangedEventHandler PropertyChanged;
+
+    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
+    {
+        PropertyChangedEventHandler handler = PropertyChanged;
+        if (handler != null)
+            handler(this, new PropertyChangedEventArgs(propertyName));
+    }
+
 }

src/WeatherTwentyOne/ViewModels/SettingsViewModel.cs

@@ -21,10 +21,10 @@ public string Units {
 
     public bool IsDarkMode {
         get {
-            return App.Current.UserAppTheme == OSAppTheme.Dark;
+            return App.Current.UserAppTheme == AppTheme.Dark;
         }
         set {
-            App.Current.UserAppTheme = value ? OSAppTheme.Dark : OSAppTheme.Light;
+            App.Current.UserAppTheme = value ? AppTheme.Dark : AppTheme.Light;
             OnPropertyChanged();
         }
     }
@@ -51,7 +51,7 @@ public SettingsViewModel()
 
     private void OnChangeThemeMode(bool dark)
     {
-        App.Current.UserAppTheme = dark ? OSAppTheme.Dark : OSAppTheme.Light;
+        App.Current.UserAppTheme = dark ? AppTheme.Dark : AppTheme.Light;
         OnPropertyChanged(nameof(IsDarkMode));
     }
 

src/WeatherTwentyOne/Views/Next7DWidget.xaml

@@ -69,7 +69,9 @@
                                 HeightRequest="16"
                                 VerticalOptions="Center"/>
                             <Label
-                                Text="13%" class="SubContent" VerticalOptions="Center"/>
+                                Text="13%" 
+                                class="SubContent" 
+                                VerticalOptions="Center"/>
                         </StackLayout>
 
                     </VerticalStackLayout>

src/WeatherTwentyOne/Views/WidgetsPanel.xaml

@@ -5,16 +5,18 @@
             ColumnDefinitions="1,*">
     <Grid.Resources>
         <DataTemplate x:Key="MetricTemplate">
-            <Frame
+            <Border
                 HeightRequest="154"
-                WidthRequest="154"
-                Padding="0"
-                CornerRadius="20"
-                HasShadow="False"
+                WidthRequest="150"
                 x:DataType="m:Metric"
+                Stroke="Transparent"
                 BackgroundColor="{AppThemeBinding Light={StaticResource LightGray}, Dark={StaticResource Background_Mid}}">
+                <Border.StrokeShape>
+                    <RoundRectangle         
+                        CornerRadius="40" />
+                </Border.StrokeShape>
                 <Grid
-                    Margin="20"
+                    Margin="15"
                     ColumnDefinitions="*"
                     RowDefinitions="*">
                     <Grid.GestureRecognizers>
@@ -38,22 +40,20 @@
                         <Label Text="{Binding WeatherStation}" class="SubContent"/>
                     </StackLayout>
                 </Grid>
-            </Frame>
+            </Border>
         </DataTemplate>
 
         <DataTemplate x:Key="MetricBorderTemplate">
             <Border
-                Margin="25"
-                HorizontalOptions="Start"
                 HeightRequest="154"
-                WidthRequest="154"
+                WidthRequest="150"
                 Stroke="Transparent"
                 BackgroundColor="{AppThemeBinding Light={StaticResource LightGray}, Dark={StaticResource Background_Mid}}">
                 <Border.StrokeShape>
                     <RoundRectangle CornerRadius="40"/>
                 </Border.StrokeShape>
                 <Grid
-                    Margin="20"
+                    Margin="15"
                     ColumnDefinitions="*"
                     RowDefinitions="*">
                     <Grid.GestureRecognizers>
@@ -82,13 +82,13 @@
 
      <CollectionView
          Grid.Column="1"
-         Margin="5"
+         Margin="5" ItemSizingStrategy="MeasureFirstItem"
          ItemTemplate="{StaticResource MetricTemplate}">
         <CollectionView.ItemsLayout>
             <GridItemsLayout Orientation="Vertical"
-                             Span="3"
                              HorizontalItemSpacing="8"
-                             VerticalItemSpacing="8"/>
+                             VerticalItemSpacing="8"
+                             Span="3"/>
         </CollectionView.ItemsLayout>
             <CollectionView.ItemsSource>
                 <x:Array Type="{x:Type m:Metric}">

src/WeatherTwentyOne/Views/WindLiveWidget.xaml.cs

@@ -1,6 +1,6 @@
 namespace WeatherTwentyOne.Views;
 
-public partial class WindLiveWidget
+public partial class WindLiveWidget:VerticalStackLayout
 {
     Random rand;
     System.Timers.Timer aTimer;
@@ -12,7 +12,7 @@ public WindLiveWidget()
 
     public void OnTapped(object sender, EventArgs e)
     {
-        if (aTimer == null && Device.RuntimePlatform != Device.Android)
+        if (aTimer == null && DeviceInfo.Platform != DevicePlatform.Android)
             Start();
     }
 
@@ -37,9 +37,8 @@ void UpdateLiveWind(object source, System.Timers.ElapsedEventArgs e)
     {
         var direction = GetDirection();
 
-        Device.BeginInvokeOnMainThread(() =>
-        {
-            Needle.RotateTo(WindValues[direction], 200, Easing.SpringOut);
+        this.Dispatcher.Dispatch(() => {
+            Needle.RotateTo(WindValues[direction], 50, Easing.SpringOut);
         });
     }