DevWiki/calculator
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix for #1666- Back button is not accessible via keyboard when navigating to the about page. (#1679)

Browse Source 
* initial changes

* margin

* format

* resolve review comments

* Popup Content Height
This commit is contained in:
Tian L
2021-09-03 16:10:17 +08:00
committed by GitHub
parent 83e3a46374
commit 46497be75c
6 changed files with 79 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/Calculator/Views/MainPage.xaml
View File

@@ -2,14 +2,11 @@
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:automation="using:CalculatorApp.ViewModel.Common.Automation"
xmlns:common="using:CalculatorApp.Common"
xmlns:controls="using:CalculatorApp.Controls"
xmlns:converters="using:CalculatorApp.Converters"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:CalculatorApp"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
xmlns:vm="using:CalculatorApp.ViewModel"
x:Name="PageRoot"
muxc:BackdropMaterial.ApplyToRootOrPageBackground="True"
Loaded="OnPageLoaded"
@@ -85,8 +82,7 @@
<local:TitleBar x:Name="AppTitleBar"
Grid.Row="0"
AlwaysOnTopClick="TitleBarAlwaysOnTopButtonClick"
BackButtonClick="TitleBarBackButtonClick"
BackButtonVisibility="{x:Bind ShouldShowBackButton(Model.IsAlwaysOnTop, Popup.IsOpen), Mode=OneWay}"
BackButtonSpaceReserved="{x:Bind ShouldShowBackButton(Model.IsAlwaysOnTop, Popup.IsOpen), Mode=OneWay}"
IsAlwaysOnTopMode="{x:Bind Model.IsAlwaysOnTop, Mode=OneWay}"/>
<muxc:NavigationView x:Name="NavView"
@@ -163,8 +159,7 @@
HorizontalOffset="0"
IsLightDismissEnabled="False"
LightDismissOverlayMode="Off"
Opened="Popup_Opened"
VerticalOffset="{x:Bind AppTitleBar.Height, Mode=OneWay}">
Opened="Popup_Opened">
<Popup.ChildTransitions>
<TransitionCollection>
<EntranceThemeTransition/>
@@ -172,7 +167,7 @@
</Popup.ChildTransitions>
<Grid x:Name="PopupContent" x:Load="false">
<local:Settings/>
<local:Settings BackButtonClick="Settings_BackButtonClick" TitleBarHeight="{x:Bind DoubleToGridLength(AppTitleBar.Height), Mode=OneWay}"/>
</Grid>
</Popup>
</Grid>

23
src/Calculator/Views/MainPage.xaml.cs
View File

@@ -154,7 +154,7 @@ namespace CalculatorApp
if(PopupContent != null)
{
PopupContent.Width = e.Size.Width;
PopupContent.Height = e.Size.Height - AppTitleBar.ActualHeight;
PopupContent.Height = e.Size.Height;
}
}
@@ -300,7 +300,7 @@ namespace CalculatorApp
var windowBounds = Window.Current.Bounds;
PopupContent.Width = windowBounds.Width;
PopupContent.Height = windowBounds.Height - AppTitleBar.ActualHeight;
PopupContent.Height = windowBounds.Height;
}
}
@@ -578,14 +578,9 @@ namespace CalculatorApp
NarratorNotifier.Announce(announcement);
}
private void TitleBarBackButtonClick(object sender, RoutedEventArgs e)
private bool ShouldShowBackButton(bool isAlwaysOnTop, bool isPopupOpen)
{
CloseSettingsPopup();
}
private Visibility ShouldShowBackButton(bool isAlwaysOnTop, bool isPopupOpen)
{
return !isAlwaysOnTop && isPopupOpen ? Visibility.Visible : Visibility.Collapsed;
return !isAlwaysOnTop && isPopupOpen;
}
private double NavigationViewOpenPaneLength(bool isAlwaysOnTop)
@@ -593,6 +588,16 @@ namespace CalculatorApp
return isAlwaysOnTop ? 0 : (double)Application.Current.Resources["SplitViewOpenPaneLength"];
}
private GridLength DoubleToGridLength(double value)
{
return new GridLength(value);
}
private void Settings_BackButtonClick(object sender, RoutedEventArgs e)
{
CloseSettingsPopup();
}
private CalculatorApp.Calculator m_calculator;
private GraphingCalculator m_graphingCalculator;
private CalculatorApp.UnitConverter m_converter;

23
src/Calculator/Views/Settings.xaml
View File

@@ -3,7 +3,6 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:automation="using:CalculatorApp.ViewModel.Common.Automation"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:CalculatorApp"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
Loaded="OnLoaded"
@@ -40,6 +39,10 @@
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="{x:Bind TitleBarHeight, Mode=OneWay}"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="LayoutVisualStates">
<VisualState x:Name="LargeWideView">
@@ -77,7 +80,20 @@
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Height="{StaticResource HamburgerHeight}"
<Button x:Name="BackButton"
x:Uid="TitleBarBackButton"
Grid.Row="0"
Width="44"
Height="{x:Bind TitleBarHeight.Value, Mode=OneWay}"
Margin="0,0,4,0"
Padding="2,0,0,0"
Style="{StaticResource SquareIconButtonStyle}"
FontSize="12"
Click="BackButton_Click"
Content="&#xE72B;"/>
<Grid Grid.Row="1"
Height="{StaticResource HamburgerHeight}"
Padding="24,0"
HorizontalAlignment="Stretch"
VerticalAlignment="Top">
@@ -86,7 +102,8 @@
Style="{StaticResource CategoryNameTextBlockStyle}"/>
</Grid>
<ScrollViewer Margin="0,60,0,0"
<ScrollViewer Grid.Row="1"
Margin="0,60,0,0"
Padding="24,0,24,16"
Style="{StaticResource SettingsContentScrollViewStyle}">
<Grid x:Name="ContentGrid">

39
src/Calculator/Views/Settings.xaml.cs
View File

@@ -12,12 +12,10 @@ using Windows.Foundation.Collections;
using Windows.System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using CalculatorApp.ViewModel.Common.Automation;
using Windows.UI.Core;
using Windows.UI.Xaml.Automation.Peers;
using Windows.UI.Xaml.Automation.Provider;
// The User Control item template is documented at https://go.microsoft.com/fwlink/?LinkId=234236
@@ -29,6 +27,16 @@ namespace CalculatorApp
// BUILD_YEAR was a C++/CX macro and may update the value from the pipeline
private const string BUILD_YEAR = "2021";
public event Windows.UI.Xaml.RoutedEventHandler BackButtonClick;
public GridLength TitleBarHeight
{
get { return (GridLength)GetValue(TitleBarHeightProperty); }
set { SetValue(TitleBarHeightProperty, value); }
}
public static readonly DependencyProperty TitleBarHeightProperty =
DependencyProperty.Register(nameof(TitleBarHeight), typeof(GridLength), typeof(Settings), new PropertyMetadata(default(GridLength)));
public Settings()
{
var locService = LocalizationService.GetInstance();
@@ -63,6 +71,8 @@ namespace CalculatorApp
// OnLoaded would be invoked by Popup several times while contructed once
private void OnLoaded(object sender, RoutedEventArgs args)
{
SystemNavigationManager.GetForCurrentView().BackRequested += System_BackRequested;
AnnouncePageOpened();
var currentTheme = ThemeHelper.RootTheme.ToString();
@@ -83,6 +93,8 @@ namespace CalculatorApp
{
// back to the default state
AppThemeExpander.IsExpanded = false;
SystemNavigationManager.GetForCurrentView().BackRequested -= System_BackRequested;
}
private void FeedbackButton_Click(object sender, RoutedEventArgs e)
@@ -131,5 +143,22 @@ namespace CalculatorApp
ContributeRunLink.Text = contributeTextLink;
ContributeRunAfterLink.Text = contributeTextAfterHyperlink;
}
private void System_BackRequested(object sender, BackRequestedEventArgs e)
{
if (!e.Handled && BackButton.IsEnabled)
{
var buttonPeer = new ButtonAutomationPeer(BackButton);
IInvokeProvider invokeProvider = buttonPeer.GetPattern(PatternInterface.Invoke) as IInvokeProvider;
invokeProvider.Invoke();
e.Handled = true;
}
}
private void BackButton_Click(object sender, RoutedEventArgs e)
{
BackButtonClick?.Invoke(this, e);
}
}
}

17
src/Calculator/Views/TitleBar.xaml
View File

@@ -27,9 +27,7 @@
<VisualState x:Name="BackButtonCollapsed"/>
<VisualState x:Name="BackButtonVisible">
<VisualState.Setters>
<Setter Target="BackButton.Visibility" Value="Visible"/>
<Setter Target="BackButton.IsEnabled" Value="True"/>
<Setter Target="AppIcon.Margin" Value="0"/>
<Setter Target="AppIcon.Margin" Value="48,0,0,0"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
@@ -47,19 +45,6 @@
</TransitionCollection>
</Grid.Transitions>
<Button x:Name="BackButton"
x:Uid="TitleBarBackButton"
Width="44"
Height="32"
Margin="0,0,4,0"
Padding="2,0,0,0"
Style="{StaticResource SquareIconButtonStyle}"
FontSize="12"
Click="BackButton_Click"
Content="&#xE72B;"
Visibility="Collapsed"
IsEnabled="False"/>
<Grid x:Name="BackgroundElement"
Grid.Column="1"
Background="Transparent">

41
src/Calculator/Views/TitleBar.xaml.cs
View File

@@ -1,16 +1,10 @@
using CalculatorApp.ViewModel.Common;
using System;
using System.ComponentModel;
using Windows.ApplicationModel.Core;
using Windows.System.Profile;
using Windows.UI;
using Windows.UI.Core;
using Windows.UI.ViewManagement;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Automation.Peers;
using Windows.UI.Xaml.Automation.Provider;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media;
// The User Control item template is documented at https://go.microsoft.com/fwlink/?LinkId=234236
@@ -53,7 +47,6 @@ namespace CalculatorApp
}));
public event Windows.UI.Xaml.RoutedEventHandler AlwaysOnTopClick;
public event Windows.UI.Xaml.RoutedEventHandler BackButtonClick;
private void OnLoaded(object sender, RoutedEventArgs e)
{
@@ -65,9 +58,6 @@ namespace CalculatorApp
m_accessibilitySettings.HighContrastChanged += OnHighContrastChanged;
Window.Current.Activated += OnWindowActivated;
// Register the system back requested event
SystemNavigationManager.GetForCurrentView().BackRequested += System_BackRequested;
// Register RequestedTheme changed callback to update title bar system button colors.
m_rootFrameRequestedThemeCallbackToken =
Utils.ThemeHelper.RegisterAppThemeChangedCallback(RootFrame_RequestedThemeChanged);
@@ -93,24 +83,10 @@ namespace CalculatorApp
m_accessibilitySettings.HighContrastChanged -= OnHighContrastChanged;
Window.Current.Activated -= OnWindowActivated;
SystemNavigationManager.GetForCurrentView().BackRequested -= System_BackRequested;
Utils.ThemeHelper.
UnregisterAppThemeChangedCallback(m_rootFrameRequestedThemeCallbackToken);
}
private void System_BackRequested(object sender, BackRequestedEventArgs e)
{
if (!e.Handled && BackButton.IsEnabled)
{
var buttonPeer = new ButtonAutomationPeer(BackButton);
IInvokeProvider invokeProvider = buttonPeer.GetPattern(PatternInterface.Invoke) as IInvokeProvider;
invokeProvider.Invoke();
e.Handled = true;
}
}
private void RootFrame_RequestedThemeChanged(DependencyObject sender, DependencyProperty dp)
{
if(Frame.RequestedThemeProperty == dp)
@@ -231,11 +207,6 @@ namespace CalculatorApp
AlwaysOnTopClick?.Invoke(this, e);
}
private void BackButton_Click(object sender, RoutedEventArgs e)
{
BackButtonClick?.Invoke(this, e);
}
// Dependency properties for the color of the system title bar buttons
public Windows.UI.Xaml.Media.SolidColorBrush ButtonBackground
{
@@ -301,18 +272,18 @@ namespace CalculatorApp
public static readonly DependencyProperty ButtonPressedForegroundProperty =
DependencyProperty.Register(nameof(ButtonPressedForeground), typeof(Windows.UI.Xaml.Media.SolidColorBrush), typeof(TitleBar), new PropertyMetadata(null));
public Visibility BackButtonVisibility
public bool BackButtonSpaceReserved
{
get { return (Visibility)GetValue(BackButtonVisibilityProperty); }
set { SetValue(BackButtonVisibilityProperty, value); }
get => (bool)GetValue(BackButtonSpaceReservedProperty);
set => SetValue(BackButtonSpaceReservedProperty, value);
}
public static readonly DependencyProperty BackButtonVisibilityProperty =
public static readonly DependencyProperty BackButtonSpaceReservedProperty =
DependencyProperty.Register(
nameof(BackButtonVisibility), typeof(Visibility), typeof(TitleBar),
nameof(BackButtonSpaceReserved), typeof(bool), typeof(TitleBar),
new PropertyMetadata(false, new PropertyChangedCallback((sender, args)=> {
var self = sender as TitleBar;
VisualStateManager.GoToState(
self, (Visibility)args.NewValue == Visibility.Visible ? self.BackButtonVisible.Name : self.BackButtonCollapsed.Name, true);
self, (bool)args.NewValue ? self.BackButtonVisible.Name : self.BackButtonCollapsed.Name, true);
})));
private Windows.ApplicationModel.Core.CoreApplicationViewTitleBar m_coreTitleBar;