Merge pull request #300 from nventive/dev/arde/update-screen-reader-s…

…upport-feature-from-main

chore: update feature/screen-reader-support from main

src/app/ApplicationTemplate.Mobile/Android/Resources/values/Styles.xml

@@ -28,6 +28,9 @@
 		<!-- This makes the status bar translucent and allows content to be drawn behind -->
 		<item name="android:windowTranslucentStatus">true</item>
 
+		<!-- This makes the navigation bar translucent and allows content to be drawn behind -->
+		<item name="android:windowTranslucentNavigation">true</item>
+
 		<!-- This makes the scrollviewer show a edge when reaching the maximum scrollable area. -->
 		<!-- Change this to ripple_material_dark if you are using dark lists or any accent color. -->
 		<item name="android:colorEdgeEffect">@color/ripple_material_light</item>

src/app/ApplicationTemplate.Mobile/ApplicationTemplate.Mobile.csproj

@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk">
 	<PropertyGroup>
 		<LangVersion>10.0</LangVersion>
 	</PropertyGroup>
@@ -36,15 +36,15 @@
 		<PackageReference Include="Nventive.Persistence.Uno.WinUI" Version="0.4.0-dev.36" />
 		<PackageReference Include="Nventive.View.Uno.WinUI" Version="0.5.0-dev.62" />
 		<PackageReference Include="Reactive.Annex.Uno.WinUI" Version="0.6.0-dev.50" />
-		<PackageReference Include="Uno.Material.WinUI" Version="2.2.0" />
+		<PackageReference Include="Uno.Material.WinUI" Version="2.5.3" />
 		<PackageReference Include="Uno.Microsoft.Xaml.Behaviors.Interactivity.WinUI" Version="2.3.1-uno.2" />
 		<PackageReference Include="Uno.Microsoft.Xaml.Behaviors.WinUI.Managed" Version="2.3.1-uno.2" />
-		<PackageReference Include="Uno.Toolkit.WinUI.Material" Version="2.2.0" />
-		<PackageReference Include="Uno.WinUI" Version="4.7.30" />
-		<PackageReference Include="Uno.WinUI.RemoteControl" Version="4.7.30" Condition="'$(Configuration)'=='Debug'" />
-		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="4.6.19" />
+		<PackageReference Include="Uno.Toolkit.WinUI.Material" Version="2.5.8" />
+		<PackageReference Include="Uno.WinUI" Version="4.7.44" />
+		<PackageReference Include="Uno.WinUI.RemoteControl" Version="4.7.44" Condition="'$(Configuration)'=='Debug'" />
+		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="4.7.44" />
 		<PackageReference Include="Microsoft.Extensions.Logging.Console" Version="6.0.0" />
-		<PackageReference Include="Uno.WinUI.Lottie" Version="4.7.30" />
+		<PackageReference Include="Uno.WinUI.Lottie" Version="4.7.44" />
 		<PackageReference Include="Serilog.Sinks.Xamarin" Version="1.0.0" />
 		<PackageReference Include="Serilog.Sinks.File" Version="5.0.0" />
 	</ItemGroup>

src/app/ApplicationTemplate.Presentation/Configuration/ApiConfiguration.cs

@@ -130,7 +130,9 @@ private static IServiceCollection AddResponseContentDeserializer(this IServiceCo
 	private static IServiceCollection AddNetworkExceptionHandler(this IServiceCollection services)
 	{
 		return services
-			.AddSingleton<INetworkAvailabilityChecker>(new NetworkAvailabilityChecker(ct => Task.FromResult(true)))
+			.AddSingleton<INetworkAvailabilityChecker>(s =>
+					new NetworkAvailabilityChecker(ct => Task.FromResult(s.GetRequiredService<IConnectivityProvider>().NetworkAccess is NetworkAccess.Internet))
+			)
 			.AddTransient<NetworkExceptionHandler>();
 	}
 

src/app/ApplicationTemplate.Presentation/Framework/DataLoader/NetworkReconnectionDataLoaderTrigger.cs

@@ -19,7 +19,7 @@ public NetworkReconnectionDataLoaderTrigger(IDataLoader dataLoader, IConnectivit
 	{
 		_dataLoader = dataLoader ?? throw new ArgumentNullException(nameof(dataLoader));
 		_connectivity = connectivity;
-		connectivity.ConnectivityChanged += OnConnectivityChanged;
+		_connectivity.ConnectivityChanged += OnConnectivityChanged;
 	}
 
 	private void OnConnectivityChanged(object sender, ConnectivityChangedEventArgs e)

src/app/ApplicationTemplate.Presentation/ViewModels/Authentication/LoginPageViewModel.cs

@@ -27,7 +27,7 @@ public string Title
 
 	public string Quote
 	{
-		get => IsFirstLogin ? this.GetService<IStringLocalizer>()["Login_Subtitle1"] : this.GetService<IStringLocalizer>()["Login_Subtitle2"];
+		get => IsFirstLogin ? this.GetService<IStringLocalizer>()["Login_TitleMedium"] : this.GetService<IStringLocalizer>()["Login_TitleSmall"];
 		set => this.Set(value);
 	}
 

src/app/ApplicationTemplate.Presentation/ViewModels/Diagnostics/DiagnosticsOverlayViewModel.cs

@@ -46,19 +46,39 @@ public int ActiveTabIndex
 		await this.GetService<ISectionsNavigator>().OpenModal(ct, () => new DiagnosticsPageViewModel());
 	});
 
+	/// <summary>
+	/// Gets a value indicating whether the diagnostic overlay has been enabled by the user.
+	/// </summary>
 	public bool IsDiagnosticsOverlayEnabled => this.GetFromOptionsMonitor<DiagnosticsOptions, bool>(o => o.IsDiagnosticsOverlayEnabled);
 
-	public bool IsAlignmentGridEnabled
+	/// <summary>
+	/// Gets a value indicating whether gets whether the user has closed manually the diagnostic overlay.
+	/// </summary>
+	public bool IsClosed
 	{
 		get => this.Get<bool>();
-		set => this.Set(value);
+		private set => this.Set(value);
 	}
 
-	public IDynamicCommand ToggleAlignmentGrid => this.GetCommand(() =>
+	public IDynamicCommand CloseDiagnostic => this.GetCommand(() =>
 	{
-		IsAlignmentGridEnabled = !IsAlignmentGridEnabled;
+		IsClosed = true;
 	});
 
+	/// <summary>
+	/// Gets a value indicating whether the diagnostic overlay should be displayed.
+	/// </summary>
+	public bool ShouldDisplayOverlay => this.GetFromObservable(ObserveShouldDisplayOverlay(), initialValue: IsDiagnosticsOverlayEnabled);
+
+	private IObservable<bool> ObserveShouldDisplayOverlay()
+	{
+		return Observable.CombineLatest(
+			this.GetProperty(x => x.IsDiagnosticsOverlayEnabled).GetAndObserve(),
+			this.GetProperty(x => x.IsClosed).GetAndObserve(),
+			(isEnabled, isClosed) => isEnabled && !isClosed
+		);
+	}
+
 	public IDynamicCommand ToggleHttpDebugger => this.GetCommand(() =>
 	{
 		// The HttpDebugger is currently the only thing in the expanded view.

src/app/ApplicationTemplate.Shared.Views/App.xaml

@@ -10,11 +10,11 @@
 
 				<!-- Load Toolkit resources -->
 				<ToolkitResources xmlns="using:Uno.Toolkit.UI" />
-				
+
 				<!-- Uno material -->
-				<MaterialColorsV1 xmlns="using:Uno.Material"
-								  OverrideSource="ms-appx:///Styles/Application/MaterialOverride.xaml" />
-				<MaterialResourcesV1 xmlns="using:Uno.Material" />
+				<MaterialTheme xmlns="using:Uno.Material"
+							   FontOverrideSource="ms-appx:///Styles/Application/Fonts.xaml"
+							   ColorOverrideSource="ms-appx:///Styles/Application/MaterialOverride.xaml" />
 
 				<ResourceDictionary Source="Styles/Application/ColorPalette.xaml" />
 				<ResourceDictionary Source="Styles/Application/Brushes.xaml" />

src/app/ApplicationTemplate.Shared.Views/ApplicationTemplate.Shared.Views.projitems

@@ -400,8 +400,6 @@
     <Content Include="$(MSBuildThisFileDirectory)Assets\Fonts\Guillon-Light.ttf" />
     <Content Include="$(MSBuildThisFileDirectory)Assets\Fonts\Guillon-Regular.ttf" />
     <Content Include="$(MSBuildThisFileDirectory)Assets\Fonts\Guillon-SemiBold.ttf" />
-    <Content Include="$(MSBuildThisFileDirectory)Assets\Fonts\Roboto-Medium.ttf" />
-    <Content Include="$(MSBuildThisFileDirectory)Assets\Fonts\Roboto-Regular.ttf" />
     <Content Include="$(MSBuildThisFileDirectory)Assets\Fonts\segmdl2.ttf" />
   </ItemGroup>
 </Project>

src/app/ApplicationTemplate.Shared.Views/Behaviors/FormattingTextBoxBehavior.cs

@@ -1,6 +1,7 @@
 using System;
 using System.Linq;
 using System.Text;
+using Microsoft.UI.Dispatching;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
 using Uno.Extensions;
@@ -195,7 +196,7 @@ private static void FormatText(TextBox textbox, string textFormat)
 			return;
 		}
 
-		_ = textbox.Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>
+		_ = textbox.DispatcherQueue.RunAsync(DispatcherQueuePriority.Normal, () =>
 		{
 			textbox.Text = formattedText;
 			textbox.SelectionStart = selectionStart;

src/app/ApplicationTemplate.Shared.Views/Behaviors/FormattingTextBoxBehavior.iOS.cs

@@ -134,12 +134,8 @@ public override bool ShouldChangeCharacters(UITextField textField, NSRange range
 		}
 
 #region restore uno implementations
-		//public override bool ShouldChangeCharacters(UITextField textField, NSRange range, string replacementString) => _delegate.ShouldChangeCharacters(textField, range, replacementString);
-
 		public override bool ShouldReturn(UITextField textField) => _delegate.ShouldReturn(textField);
 
-		public override bool ShouldBeginEditing(UITextField textField) => _delegate.ShouldBeginEditing(textField);
-
 		public override void EditingStarted(UITextField textField) => _delegate.EditingStarted(textField);
 
 		public override void EditingEnded(UITextField textField) => _delegate.EditingEnded(textField);

src/app/ApplicationTemplate.Shared.Views/Content/Authentication/CreateAccountPage.xaml

@@ -43,15 +43,15 @@
 					<!-- Title -->
 					<TextBlock Text="Join the fun!"
 							   x:Uid="CreateAccount_Title"
-							   Style="{StaticResource Headline2}"
-							   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+							   Style="{StaticResource HeadlineLarge}"
+							   Foreground="{StaticResource OnPrimaryBrush}"
 							   TextAlignment="Center" />
 
 					<!-- Subtitle -->
 					<TextBlock Text="Only 2 seconds to create an account"
 							   x:Uid="CreateAccount_Subtitle"
-							   Style="{StaticResource Body1}"
-							   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+							   Style="{StaticResource BodyLarge}"
+							   Foreground="{StaticResource OnPrimaryBrush}"
 							   TextAlignment="Center"
 							   Margin="0,16,0,0" />
 
@@ -94,16 +94,16 @@
 											  Margin="0,12,0,0">
 
 						<TextBox x:Name="EmailField"
-									 PlaceholderText="Enter an email"
-									 x:Uid="CreateAccount_Email"
-									 Text="{Binding Form.Email, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
-									 ue:ControlExtensions.LostFocusCommand="{Binding Form.ValidateProperty}"
-									 ue:ControlExtensions.LostFocusCommandParameter="Email"
-									 InputScope="EmailSmtpAddress"
-									 IsSpellCheckEnabled="False"
-									 ios:ReturnKeyType="Next"
-									 android:ImeOptions="Next"
-									 ue:TextBoxBehavior.NextControl="{Binding ElementName=PhoneNumberField}" />
+								 PlaceholderText="Enter an email"
+								 x:Uid="CreateAccount_Email"
+								 Text="{Binding Form.Email, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
+								 ue:ControlExtensions.LostFocusCommand="{Binding Form.ValidateProperty}"
+								 ue:ControlExtensions.LostFocusCommandParameter="Email"
+								 InputScope="EmailSmtpAddress"
+								 IsSpellCheckEnabled="False"
+								 ios:ReturnKeyType="Next"
+								 android:ImeOptions="Next"
+								 ue:TextBoxBehavior.NextControl="{Binding ElementName=PhoneNumberField}" />
 					</local:DataValidationView>
 
 					<!-- Phone Number -->
@@ -129,18 +129,19 @@
 					<!-- Birth Day Label -->
 					<TextBlock Text="Date of birth"
 							   x:Uid="CreateAccount_DateOfBirth"
-							   Style="{StaticResource Subtitle2}"
-							   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+							   Style="{StaticResource TitleSmall}"
+							   Foreground="{StaticResource OnPrimaryBrush}"
 							   Margin="0,12,0,0" />
 
 					<!-- Birth Day DatePicker -->
 					<local:DataValidationView PropertyName="DateOfBirth"
 											  Model="{Binding Form}">
-
+						<!-- On Uno Material V2 the Background and the Foreground properties don't take the correct values -->
+						<!-- Issue: https://github.com/unoplatform/Uno.Themes/issues/969 -->
 						<CalendarDatePicker x:Name="BirthDayField"
 											Date="{Binding Form.DateOfBirth, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
-											Background="{StaticResource MaterialSurfaceBrush}"
-											Foreground="{StaticResource MaterialOnSurfaceBrush}"
+											Background="{StaticResource SurfaceBrush}"
+											Foreground="{StaticResource OnSurfaceBrush}"
 											HorizontalAlignment="Stretch"
 											MinHeight="56" />
 					</local:DataValidationView>
@@ -199,8 +200,8 @@
 						<TextBlock x:Name="HasMinimumLengthText"
 								   Text="8 characters minimum"
 								   x:Uid="Password_Validation1"
-								   Style="{StaticResource Body3}"
-								   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+								   Style="{StaticResource BodyMediumLight}"
+								   Foreground="{StaticResource OnPrimaryBrush}"
 								   VerticalAlignment="Center"
 								   android:Margin="8,0,0,0"
 								   not_android:Margin="8,3,0,0" />
@@ -221,8 +222,8 @@
 						<TextBlock x:Name="HasNumberText"
 								   Text="One number"
 								   x:Uid="Password_Validation2"
-								   Style="{StaticResource Body3}"
-								   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+								   Style="{StaticResource BodyMediumLight}"
+								   Foreground="{StaticResource OnPrimaryBrush}"
 								   VerticalAlignment="Center"
 								   android:Margin="8,0,0,0"
 								   not_android:Margin="8,3,0,0" />
@@ -243,8 +244,8 @@
 						<TextBlock x:Name="HasUppercaseText"
 								   Text="One uppercase character"
 								   x:Uid="Password_Validation3"
-								   Style="{StaticResource Body3}"
-								   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+								   Style="{StaticResource BodyMediumLight}"
+								   Foreground="{StaticResource OnPrimaryBrush}"
 								   VerticalAlignment="Center"
 								   android:Margin="8,0,0,0"
 								   not_android:Margin="8,3,0,0" />
@@ -253,19 +254,20 @@
 					<!-- Favorite Dad Nickname Label -->
 					<TextBlock Text="Favorite dad nickname (pick at least 1)"
 							   x:Uid="CreateAccount_FavoriteDadNames"
-							   Style="{StaticResource Subtitle2}"
-							   Foreground="{StaticResource MaterialOnPrimaryBrush}"
+							   Style="{StaticResource TitleSmall}"
+							   Foreground="{StaticResource OnPrimaryBrush}"
 							   Margin="0,16,0,0" />
 
 					<!-- Favorite Dad names -->
 					<local:DataValidationView PropertyName="FavoriteDadNames"
 											  Model="{Binding Form}"
 											  Margin="0,4,0,0">
 						<!-- List -->
-						<Grid Background="{StaticResource MaterialSurfaceBrush}"
+						<Grid Background="{StaticResource SurfaceBrush}"
 							  CornerRadius="4">
+							<!--Remove this line from listView Properties to avoid crash on Windows App: ue:ListViewBaseMultipleSelectionBehavior.SelectedItems="{Binding Form.FavoriteDadNames, Mode=TwoWay}"
+								TODO : https://dev.azure.com/nventive/Practice%20committees/_workitems/edit/251910-->
 							<ListView ItemsSource="{Binding DadNames}"
-									  ue:ListViewBaseMultipleSelectionBehavior.SelectedItems="{Binding Form.FavoriteDadNames, Mode=TwoWay}"
 									  ItemContainerStyle="{StaticResource CheckedListViewItemStyle}"
 									  SelectionMode="Single"
 									  IsItemClickEnabled="True" />
@@ -283,8 +285,8 @@
 								  Content="I agree to the terms of services"
 								  x:Uid="CreateAccount_TermsOfServices"
 								  IsChecked="{Binding Form.AgreeToTermsOfServices, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
-								  Foreground="{StaticResource MaterialSurfaceBrush}"
-								  Style="{StaticResource CustomMaterialCheckBoxStyle}"
+								  Foreground="{StaticResource SurfaceBrush}"
+								  Style="{StaticResource CustomCheckBoxStyle}"
 								  HorizontalAlignment="Left" />
 					</local:DataValidationView>
 

src/app/ApplicationTemplate.Shared.Views/Content/Authentication/ForgotPasswordPage.xaml

@@ -9,7 +9,7 @@
 	  xmlns:toolkit="using:Uno.UI.Toolkit"
 	  mc:Ignorable="android ios">
 
-	<Grid Background="{StaticResource MaterialBackgroundBrush}">
+	<Grid Background="{StaticResource BackgroundBrush}">
 
 		<!-- Background Image -->
 		<Image Source="{StaticResource BackgroundMustachesLightImage}"
@@ -23,7 +23,7 @@
 
 			<!-- CommandBar -->
 			<CommandBar Style="{StaticResource TransparentCommandBarStyle}"
-						toolkit:CommandBarExtensions.BackButtonForeground="{StaticResource MaterialOnBackgroundBrush}" />
+						toolkit:CommandBarExtensions.BackButtonForeground="{StaticResource OnBackgroundBrush}" />
 
 			<ScrollViewer Grid.Row="1">
 				<StackPanel VerticalAlignment="Center"
@@ -32,8 +32,8 @@
 					<!-- Title -->
 					<TextBlock Text="Oh no,&#x0A;it's happening!"
 							   x:Uid="ForgotPassword_Title"
-							   Style="{StaticResource Headline3}"
-							   Foreground="{StaticResource MaterialOnBackgroundBrush}"
+							   Style="{StaticResource HeadlineMedium}"
+							   Foreground="{StaticResource OnBackgroundBrush}"
 							   TextAlignment="Center" />
 
 					<!-- Title needed a bit more space to avoid wrapping on small device -->
@@ -42,8 +42,8 @@
 						<!-- Subtitle -->
 						<TextBlock Text="We'll send you a link to reset your password by email."
 								   x:Uid="ForgotPassword_Subtitle"
-								   Style="{StaticResource Body1}"
-								   Foreground="{StaticResource MaterialOnBackgroundBrush}"
+								   Style="{StaticResource BodyLarge}"
+								   Foreground="{StaticResource OnBackgroundBrush}"
 								   TextAlignment="Center"
 								   MaxWidth="230"
 								   Margin="0,16,0,0" />