Move variables to the right column (#859)

* move variable editor

* support high contrast and tab navigation

* Remove obsolete resources

* take feedback into account

* Fix focus when virtualization recycle a EquationTextBox

* formatting
This commit is contained in:
Rudy Huyn 2019-12-12 14:52:36 -08:00 committed by Pepe Rivera
parent 2a0637e51c
commit da38b5a015
9 changed files with 423 additions and 335 deletions

View File

@ -1816,8 +1816,8 @@
Grid.RowSpan="1"
Grid.Column="0"
Grid.ColumnSpan="4"
MinWidth="{ThemeResource TextControlThemeMinWidth}"
MinHeight="{ThemeResource TextControlThemeMinHeight}"
MinWidth="32"
MinHeight="16"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
@ -1899,7 +1899,6 @@
</VisualState>
<VisualState x:Name="AddEquation">
<VisualState.Setters>
<Setter Target="RemoveButtonPanel.Visibility" Value="Collapsed"/>
<Setter Target="MathRichEditBox.PlaceholderText" Value="Enter an equation"/>
<Setter Target="EquationBoxBorder.Background" Value="{ThemeResource EquationBoxAddBackgroundBrush}"/>
<Setter Target="EquationBoxBorder.BorderBrush" Value="{ThemeResource EquationBoxBorderBrush}"/>
@ -2212,16 +2211,6 @@
</Setter.Value>
</Setter>
</Style>
<Style x:Key="VariableTextBoxStyle" TargetType="TextBox">
<Setter Property="Margin" Value="12,4,4,4"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0,0,0,1"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="AcceptsReturn" Value="False"/>
<Setter Property="InputScope" Value="Number"/>
<Setter Property="TextWrapping" Value="NoWrap"/>
</Style>
</ResourceDictionary>
</Application.Resources>
</Application>

View File

@ -176,7 +176,6 @@ void EquationTextBox::OnLostFocus(RoutedEventArgs ^ e)
return;
}
EquationSubmitted(this, m_sourceSubmission);
if (m_functionButton && m_richEditBox->MathText != L"")
{
m_functionButton->IsEnabled = true;
@ -218,6 +217,8 @@ void EquationTextBox::OnRichEditBoxLostFocus(Object ^ sender, RoutedEventArgs ^
UpdateCommonVisualState();
UpdateButtonsVisualState();
EquationSubmitted(this, m_sourceSubmission);
}
void EquationTextBox::OnDeleteButtonClicked(Object ^ sender, RoutedEventArgs ^ e)

View File

@ -4182,14 +4182,6 @@
<value>Start tracing</value>
<comment>This is the tooltip/automation name for the graphing calculator start tracing button</comment>
</data>
<data name="variablesButton.[using:Windows.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
<value>Variables</value>
<comment>This is the tooltip for the Calculator variables button.</comment>
</data>
<data name="variablesButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
<value>Variables</value>
<comment>This is the automation name for the Calculator variables button.</comment>
</data>
<data name="sliderOptionsButton.[using:Windows.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
<value>Configure slider</value>
<comment>This is the tooltip text for the slider options button in Graphing Calculator</comment>

View File

@ -2,67 +2,278 @@
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
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:mux="using:Microsoft.UI.Xaml.Controls"
xmlns:vm="using:CalculatorApp.ViewModel"
d:DesignHeight="300"
d:DesignWidth="400"
mc:Ignorable="d">
<UserControl.Resources>
<ResourceDictionary>
<converters:BooleanToVisibilityNegationConverter x:Name="BooleanToVisibilityNegationConverter"/>
<Grid>
<ListView x:Name="EquationInputList"
IsItemClickEnabled="False"
ItemsSource="{x:Bind Equations}"
SelectionMode="None">
<DataTemplate x:Key="VariableDataTemplate" x:DataType="vm:VariableViewModel">
<Grid>
<Grid.Resources>
<ResourceDictionary>
<!-- Removes animations from the ListView Style. -->
<ListView.Style>
<Style TargetType="ListView">
<Setter Property="ItemContainerTransitions">
<Setter.Value>
<TransitionCollection/>
</Setter.Value>
</Setter>
</Style>
</ListView.Style>
<Style x:Key="VariableTextBoxStyle" TargetType="TextBox">
<Setter Property="Margin" Value="10,0,0,0"/>
<Setter Property="Padding" Value="2,6,2,2"/>
<Setter Property="TextAlignment" Value="Center"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0,0,0,1"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="InputScope" Value="Number"/>
<Setter Property="MaxWidth" Value="46"/>
<Setter Property="MinWidth" Value="30"/>
</Style>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Margin" Value="1,0,1,0"/>
</Style>
</ListView.ItemContainerStyle>
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Default">
<SolidColorBrush x:Key="TextControlBackgroundFocused" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlForegroundFocused" Color="White"/>
<SolidColorBrush x:Key="SliderLegendBrush" Color="#B2ffffff"/>
<Style x:Key="VariableContainerStyle" TargetType="Border">
<Setter Property="Background" Value="#34000000"/>
</Style>
<Style x:Key="ThemedVariableTextBoxStyle"
BasedOn="{StaticResource VariableTextBoxStyle}"
TargetType="TextBox">
<Setter Property="BorderBrush" Value="#50ffffff"/>
</Style>
</ResourceDictionary>
<ResourceDictionary x:Key="Light">
<SolidColorBrush x:Key="TextControlBackgroundFocused" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlForegroundFocused" Color="Black"/>
<SolidColorBrush x:Key="SliderLegendBrush" Color="#B2000000"/>
<Style x:Key="VariableContainerStyle" TargetType="Border">
<Setter Property="Background" Value="#34ffffff"/>
</Style>
<Style x:Key="ThemedVariableTextBoxStyle"
BasedOn="{StaticResource VariableTextBoxStyle}"
TargetType="TextBox">
<Setter Property="BorderBrush" Value="#70000000"/>
</Style>
</ResourceDictionary>
<ResourceDictionary x:Key="HighContrast">
<SolidColorBrush x:Key="TextControlBackgroundFocused" Color="{StaticResource SystemColorButtonFaceColor}"/>
<SolidColorBrush x:Key="TextControlBackgroundPointerOver" Color="{StaticResource SystemColorButtonFaceColor}"/>
<SolidColorBrush x:Key="TextControlForegroundFocused" Color="{StaticResource SystemColorButtonTextColor}"/>
<SolidColorBrush x:Key="VariablesBackgroundBrush" Color="{StaticResource SystemColorBackgroundColor}"/>
<SolidColorBrush x:Key="SliderLegendBrush" Color="{StaticResource SystemColorWindowTextColor}"/>
<Style x:Key="VariableContainerStyle" TargetType="Border">
<Setter Property="Background" Value="{StaticResource SystemColorWindowColor}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="BorderBrush" Value="{StaticResource SystemColorWindowTextColor}"/>
</Style>
<Style x:Key="ThemedVariableTextBoxStyle" TargetType="TextBox">
<Setter Property="InputScope" Value="Number"/>
<Setter Property="TextAlignment" Value="Center"/>
<Setter Property="InputScope" Value="Number"/>
<Setter Property="MaxWidth" Value="80"/>
<Setter Property="MinWidth" Value="40"/>
</Style>
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>
</Grid.Resources>
<Border Margin="0,3" Style="{ThemeResource VariableContainerStyle}">
<StackPanel Padding="12,0" DataContext="{x:Bind}">
<Grid HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock MinWidth="10"
Margin="0,4,0,0"
VerticalAlignment="Center"
FontWeight="SemiBold"
Text="{x:Bind Name}"/>
<TextBox x:Name="ValueTextBox"
Grid.Column="1"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Style="{StaticResource ThemedVariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Value, Mode=OneWay}"/>
<ToggleButton x:Uid="sliderOptionsButton"
Grid.Column="2"
Margin="0,0,-8,0"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Background="Transparent"
FontFamily="{StaticResource SymbolThemeFontFamily}"
Content="&#xE713;"
IsChecked="{x:Bind SliderSettingsVisible, Mode=TwoWay}">
<ToggleButton.Resources>
<SolidColorBrush x:Key="ToggleButtonBackgroundPressed" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundChecked" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundCheckedPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBorderBrushCheckedPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBorderBrushPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundCheckedPressed" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonForegroundPointerOver" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundPressed" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundChecked" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundCheckedPressed" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundCheckedPointerOver" Color="{ThemeResource SystemAccentColor}"/>
<x:Double x:Key="TextControlThemeMinWidth">32</x:Double>
</ToggleButton.Resources>
</ToggleButton>
</Grid>
<Grid Visibility="{x:Bind SliderSettingsVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="auto"/>
</Grid.ColumnDefinitions>
<TextBlock VerticalAlignment="Center"
Foreground="{ThemeResource SliderLegendBrush}"
Text="{x:Bind Min, Mode=OneWay}"/>
<Slider Grid.Column="1"
Margin="8,0"
VerticalAlignment="Center"
Maximum="{x:Bind Max, Mode=TwoWay}"
Minimum="{x:Bind Min, Mode=TwoWay}"
StepFrequency="{x:Bind Step, Mode=TwoWay}"
Value="{x:Bind Value, Mode=TwoWay}"/>
<TextBlock Grid.Column="2"
VerticalAlignment="Center"
Foreground="{ThemeResource SliderLegendBrush}"
Text="{x:Bind Max, Mode=OneWay}"/>
</Grid>
<Grid Grid.Row="1"
Padding="0,6,0,12"
HorizontalAlignment="Stretch"
Visibility="{x:Bind SliderSettingsVisible, Mode=OneWay}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid HorizontalAlignment="Left">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Uid="MinTextBlock"
Margin="0,4,0,0"
VerticalAlignment="Center"/>
<TextBox x:Name="MinTextBox"
Grid.Column="1"
Style="{StaticResource ThemedVariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Min, Mode=OneWay}"/>
</Grid>
<Grid Grid.Column="1"
Margin="4,0"
HorizontalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Uid="StepTextBlock"
Margin="0,4,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
<TextBox x:Name="StepTextBox"
Grid.Column="1"
Style="{StaticResource ThemedVariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Step, Mode=OneWay}"/>
</Grid>
<Grid Grid.Column="2" HorizontalAlignment="Right">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Uid="MaxTextBlock"
Margin="0,4,0,0"
VerticalAlignment="Center"/>
<TextBox x:Name="MaxTextBox"
Grid.Column="1"
Style="{StaticResource ThemedVariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Max, Mode=OneWay}"/>
</Grid>
</Grid>
</StackPanel>
</Border>
</Grid>
</DataTemplate>
</ResourceDictionary>
</UserControl.Resources>
<mux:ItemsRepeaterScrollHost>
<ScrollViewer>
<StackPanel>
<mux:ItemsRepeater x:Name="EquationInputList"
ItemsSource="{x:Bind Equations}"
TabFocusNavigation="Local">
<mux:ItemsRepeater.ItemTemplate>
<DataTemplate x:DataType="vm:EquationViewModel">
<controls:EquationTextBox x:Uid="EquationInputButton"
Margin="1,0,1,2"
Style="{StaticResource EquationTextBoxStyle}"
DataContext="{x:Bind Mode=OneWay}"
DataContextChanged="InputTextBox_DataContextChanged"
EquationButtonClicked="EquationTextBox_EquationButtonClicked"
EquationButtonContentIndex="{x:Bind FunctionLabelIndex, Mode=OneWay}"
EquationColor="{x:Bind LineColor, Mode=OneWay}"
EquationSubmitted="InputTextBox_Submitted"
GotFocus="InputTextBox_GotFocus"
HasError="{x:Bind GraphEquation.HasGraphError, Mode=OneWay}"
IsAddEquationMode="{x:Bind IsLastItemInList, Mode=OneWay}"
KeyGraphFeaturesButtonClicked="EquationTextBox_KeyGraphFeaturesButtonClicked"
Loaded="InputTextBox_Loaded"
LostFocus="InputTextBox_LostFocus"
RemoveButtonClicked="EquationTextBox_RemoveButtonClicked">
<controls:EquationTextBox.ColorChooserFlyout>
<Flyout x:Name="ColorChooserFlyout"
x:Uid="ColorChooserFlyout"
Placement="Bottom">
<local:EquationStylePanelControl SelectedColor="{x:Bind LineColor, Mode=TwoWay}"/>
</Flyout>
</controls:EquationTextBox.ColorChooserFlyout>
</controls:EquationTextBox>
</DataTemplate>
</mux:ItemsRepeater.ItemTemplate>
</mux:ItemsRepeater>
<StackPanel Margin="12" Visibility="{x:Bind local:EquationInputArea.ManageEditVariablesButtonVisibility(Variables.Size), Mode=OneWay}">
<TextBlock x:Uid="VaiablesHeader"
Margin="0,6"
FontWeight="SemiBold"/>
<mux:ItemsRepeater x:Name="VariableListView"
ItemTemplate="{StaticResource VariableDataTemplate}"
ItemsSource="{x:Bind Variables, Mode=OneWay}"
TabFocusNavigation="Local">
<mux:ItemsRepeater.Transitions>
<TransitionCollection>
<AddDeleteThemeTransition/>
</TransitionCollection>
</mux:ItemsRepeater.Transitions>
</mux:ItemsRepeater>
</StackPanel>
</StackPanel>
</ScrollViewer>
</mux:ItemsRepeaterScrollHost>
<ListView.ItemTemplate>
<DataTemplate x:DataType="vm:EquationViewModel">
<controls:EquationTextBox x:Name="EquationInputButton"
x:Uid="EquationInputButton"
Margin="1"
Style="{StaticResource EquationTextBoxStyle}"
EquationButtonClicked="EquationTextBox_EquationButtonClicked"
EquationButtonContentIndex="{x:Bind FunctionLabelIndex, Mode=OneWay}"
EquationColor="{x:Bind LineColor, Mode=OneWay}"
EquationSubmitted="InputTextBox_Submitted"
GotFocus="InputTextBox_GotFocus"
HasError="{x:Bind GraphEquation.HasGraphError, Mode=OneWay}"
IsAddEquationMode="{x:Bind IsLastItemInList, Mode=OneWay}"
KeyGraphFeaturesButtonClicked="EquationTextBox_KeyGraphFeaturesButtonClicked"
Loaded="EquationTextBoxLoaded"
LostFocus="InputTextBox_LostFocus"
RemoveButtonClicked="EquationTextBox_RemoveButtonClicked">
<controls:EquationTextBox.ColorChooserFlyout>
<Flyout x:Name="ColorChooserFlyout"
x:Uid="ColorChooserFlyout"
Placement="Bottom">
<local:EquationStylePanelControl SelectedColor="{x:Bind LineColor, Mode=TwoWay}"/>
</Flyout>
</controls:EquationTextBox.ColorChooserFlyout>
</controls:EquationTextBox>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</UserControl>

View File

@ -74,8 +74,8 @@ void EquationInputArea::AddNewEquation()
eq->LineColor = AvailableColors->GetAt(m_lastLineColorIndex);
eq->IsLineEnabled = true;
eq->FunctionLabelIndex = ++m_lastFunctionLabelIndex;
Equations->Append(eq);
m_equationToFocus = eq;
Equations->Append(eq);
}
void EquationInputArea::InputTextBox_GotFocus(Object ^ sender, RoutedEventArgs ^ e)
@ -113,41 +113,52 @@ void EquationInputArea::InputTextBox_Submitted(Object ^ sender, EquationSubmissi
if (source == EquationSubmissionSource::ENTER_KEY || eq->Expression != nullptr && eq->Expression->Length() > 0)
{
unsigned int index = 0;
if (Equations->IndexOf(eq, &index) && index == Equations->Size - 1)
if (Equations->IndexOf(eq, &index))
{
// If it's the last equation of the list
AddNewEquation();
}
else
{
auto nextEquation = Equations->GetAt(index + 1);
FocusEquationTextBox(nextEquation);
if (index == Equations->Size - 1)
{
// If it's the last equation of the list
AddNewEquation();
}
else
{
auto nextEquation = Equations->GetAt(index + 1);
FocusEquationTextBox(nextEquation);
}
}
}
}
void EquationInputArea::FocusEquationTextBox(EquationViewModel ^ equation)
{
auto nextContainer = EquationInputList->ContainerFromItem(equation);
if (nextContainer == nullptr)
unsigned int index;
if (!Equations->IndexOf(equation, &index) || index < 0)
{
return;
}
auto listviewItem = dynamic_cast<ListViewItem ^>(nextContainer);
if (listviewItem == nullptr)
auto container = EquationInputList->TryGetElement(index);
if (container == nullptr)
{
return;
}
auto equationInput = VisualTree::FindDescendantByName(nextContainer, "EquationInputButton");
if (equationInput == nullptr)
{
return;
}
auto equationTextBox = dynamic_cast<EquationTextBox ^>(equationInput);
auto equationTextBox = dynamic_cast<EquationTextBox ^>(container);
if (equationTextBox != nullptr)
{
equationTextBox->FocusTextBox();
}
else
{
auto equationInput = VisualTree::FindDescendantByName(container, "EquationInputButton");
if (equationInput == nullptr)
{
return;
}
equationTextBox = dynamic_cast<EquationTextBox ^>(equationInput);
if (equationTextBox != nullptr)
{
equationTextBox->FocusTextBox();
}
}
}
void EquationInputArea::EquationTextBox_RemoveButtonClicked(Object ^ sender, RoutedEventArgs ^ e)
@ -182,7 +193,6 @@ void EquationInputArea::EquationTextBox_KeyGraphFeaturesButtonClicked(Object ^ s
auto eq = static_cast<EquationViewModel ^>(tb->DataContext);
EquationVM = eq;
KeyGraphFeaturesRequested(EquationVM, ref new RoutedEventArgs());
}
@ -193,17 +203,59 @@ void EquationInputArea::EquationTextBox_EquationButtonClicked(Object ^ sender, R
eq->IsLineEnabled = !eq->IsLineEnabled;
}
void EquationInputArea::EquationTextBoxLoaded(Object ^ sender, RoutedEventArgs ^ e)
void EquationInputArea::InputTextBox_Loaded(Object ^ sender, RoutedEventArgs ^ e)
{
auto tb = static_cast<EquationTextBox ^>(sender);
auto colorChooser = static_cast<EquationStylePanelControl ^>(tb->ColorChooserFlyout->Content);
colorChooser->AvailableColors = AvailableColors;
if (tb->DataContext == m_equationToFocus)
if (m_equationToFocus!=nullptr && tb->DataContext == m_equationToFocus)
{
m_equationToFocus = nullptr;
tb->FocusTextBox();
unsigned int index;
if (Equations->IndexOf(m_equationToFocus, &index))
{
auto container = EquationInputList->TryGetElement(index);
if (container != nullptr)
{
container->StartBringIntoView();
}
}
}
}
void EquationInputArea::InputTextBox_DataContextChanged(
Windows::UI::Xaml::FrameworkElement ^ sender,
Windows::UI::Xaml::DataContextChangedEventArgs ^ args)
{
auto tb = static_cast<EquationTextBox ^>(sender);
if (!tb->IsLoaded)
{
return;
}
FocusEquationIfNecessary(tb);
}
void EquationInputArea::FocusEquationIfNecessary(CalculatorApp::Controls::EquationTextBox ^ textBox)
{
if (m_equationToFocus != nullptr && textBox->DataContext == m_equationToFocus)
{
m_equationToFocus = nullptr;
textBox->FocusTextBox();
unsigned int index;
if (Equations->IndexOf(m_equationToFocus, &index))
{
auto container = EquationInputList->TryGetElement(index);
if (container != nullptr)
{
container->StartBringIntoView();
}
}
}
}
@ -258,3 +310,60 @@ void EquationInputArea::ReloadAvailableColors(bool isHighContrast)
equationViewModel->LineColor = AvailableColors->GetAt(m_lastLineColorIndex);
}
}
void EquationInputArea::TextBoxGotFocus(TextBox ^ sender, RoutedEventArgs ^ e)
{
sender->SelectAll();
}
void EquationInputArea::SubmitTextbox(TextBox ^ sender)
{
auto variableViewModel = static_cast<VariableViewModel ^>(sender->DataContext);
if (sender->Name == "ValueTextBox")
{
variableViewModel->SetValue(validateDouble(sender->Text, variableViewModel->Value));
}
else if (sender->Name == "MinTextBox")
{
variableViewModel->Min = validateDouble(sender->Text, variableViewModel->Min);
}
else if (sender->Name == "MaxTextBox")
{
variableViewModel->Max = validateDouble(sender->Text, variableViewModel->Max);
}
else if (sender->Name == "StepTextBox")
{
variableViewModel->Step = validateDouble(sender->Text, variableViewModel->Step);
}
}
void EquationInputArea::TextBoxLosingFocus(TextBox ^ sender, LosingFocusEventArgs ^)
{
SubmitTextbox(sender);
}
void EquationInputArea::TextBoxKeyDown(TextBox ^ sender, KeyRoutedEventArgs ^ e)
{
if (e->Key == ::VirtualKey::Enter)
{
SubmitTextbox(sender);
}
}
double EquationInputArea::validateDouble(String ^ value, double defaultValue)
{
try
{
return stod(value->Data());
}
catch (...)
{
return defaultValue;
}
}
::Visibility EquationInputArea::ManageEditVariablesButtonVisibility(unsigned int numberOfVariables)
{
return numberOfVariables == 0 ? ::Visibility::Collapsed : ::Visibility::Visible;
}

View File

@ -6,6 +6,7 @@
#include "Views/GraphingCalculator/EquationInputArea.g.h"
#include "CalcViewModel/Common/Utils.h"
#include "CalcViewModel/GraphingCalculator/EquationViewModel.h"
#include "CalcViewModel/GraphingCalculator/GraphingCalculatorViewModel.h"
#include "EquationStylePanelControl.xaml.h"
#include "CalcViewModel/Common/KeyboardShortcutManager.h"
#include "Controls/EquationTextBox.h"
@ -20,29 +21,41 @@ namespace CalculatorApp
EquationInputArea();
OBSERVABLE_OBJECT_CALLBACK(OnPropertyChanged);
OBSERVABLE_PROPERTY_RW(Windows::Foundation::Collections::IObservableVector< ViewModel::EquationViewModel^ >^, Equations);
OBSERVABLE_PROPERTY_RW(Windows::Foundation::Collections::IObservableVector<ViewModel::EquationViewModel ^> ^, Equations);
OBSERVABLE_PROPERTY_RW(Windows::Foundation::Collections::IObservableVector<ViewModel::VariableViewModel ^> ^, Variables);
OBSERVABLE_PROPERTY_RW_ALWAYS_NOTIFY(ViewModel::EquationViewModel ^, EquationVM);
OBSERVABLE_PROPERTY_RW(Windows::Foundation::Collections::IObservableVector<Windows::UI::Xaml::Media::SolidColorBrush ^> ^, AvailableColors);
event Windows::UI::Xaml::RoutedEventHandler ^ KeyGraphFeaturesRequested;
public:
static Windows::UI::Xaml::Visibility ManageEditVariablesButtonVisibility(unsigned int numberOfVariables);
private:
void OnPropertyChanged(Platform::String^ propertyName);
void OnEquationsPropertyChanged();
void AddNewEquation();
void InputTextBox_GotFocus(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
void InputTextBox_LostFocus(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
void InputTextBox_GotFocus(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
void InputTextBox_LostFocus(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
void InputTextBox_Submitted(Platform::Object ^ sender, CalculatorApp::Controls::EquationSubmissionSource e);
void OnHighContrastChanged(Windows::UI::ViewManagement::AccessibilitySettings ^ sender, Platform::Object ^ args);
void ReloadAvailableColors(bool isHighContrast);
void FocusEquationTextBox(ViewModel::EquationViewModel ^ equation);
void EquationTextBox_RemoveButtonClicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void EquationTextBox_RemoveButtonClicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
void EquationTextBox_KeyGraphFeaturesButtonClicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void EquationTextBox_EquationButtonClicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void EquationTextBoxLoaded(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void InputTextBox_Loaded(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void InputTextBox_DataContextChanged(Windows::UI::Xaml::FrameworkElement ^ sender, Windows::UI::Xaml::DataContextChangedEventArgs ^ args);
void FocusEquationIfNecessary(_In_ CalculatorApp::Controls::EquationTextBox ^ textBox);
double validateDouble(Platform::String ^ value, double defaultValue);
void TextBoxGotFocus(Windows::UI::Xaml::Controls::TextBox ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void TextBoxLosingFocus(Windows::UI::Xaml::Controls::TextBox ^ textbox, Windows::UI::Xaml::Input::LosingFocusEventArgs ^ args);
void TextBoxKeyDown(Windows::UI::Xaml::Controls::TextBox ^ textbox, Windows::UI::Xaml::Input::KeyRoutedEventArgs ^ e);
void SubmitTextbox(Windows::UI::Xaml::Controls::TextBox ^ textbox);
private:
Windows::UI::ViewManagement::AccessibilitySettings ^ m_accessibilitySettings;

View File

@ -14,7 +14,6 @@
<UserControl.Resources>
<ResourceDictionary>
<converters:ItemSizeToVisibilityConverter x:Key="ItemSizeToVisibilityConverter"/>
<Style x:Key="GraphToggleButtonStyle" TargetType="ToggleButton">
<Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
@ -213,7 +212,6 @@
</Setter>
</Style>
<converters:BooleanToVisibilityConverter x:Name="BooleanToVisibilityConverter"/>
<converters:BooleanToVisibilityNegationConverter x:Name="BooleanToVisibilityNegationConverter"/>
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Default">
@ -278,7 +276,9 @@
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2*"/>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"
MinWidth="300"
MaxWidth="420"/>
</Grid.ColumnDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
@ -368,180 +368,8 @@
VerticalAlignment="Top"
Style="{ThemeResource GraphControlCommandPanel}"
RequestedTheme="Light">
<StackPanel Orientation="Horizontal">
<!-- Temporary button until the final UI is created -->
<Button x:Name="VariableEditing"
x:Uid="variablesButton"
MinWidth="40"
Style="{ThemeResource ThemedGraphButtonStyle}"
Visibility="{x:Bind local:GraphingCalculator.ManageEditVariablesButtonVisibility(ViewModel.Variables.Size), Mode=OneWay}">
<FontIcon FontFamily="{StaticResource SymbolThemeFontFamily}"
FontSize="18"
Glyph="&#xE70F;"/>
<Button.Flyout>
<Flyout Placement="BottomEdgeAlignedLeft">
<Flyout.FlyoutPresenterStyle>
<Style TargetType="FlyoutPresenter">
<Setter Property="RequestedTheme" Value="Default"/>
<Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="Margin" Value="0,0,0,0"/>
</Style>
</Flyout.FlyoutPresenterStyle>
<ListView x:Name="VariableListView"
MinWidth="300"
ItemsSource="{x:Bind ViewModel.Variables}"
SelectionMode="None">
<ListView.Resources>
<ResourceDictionary>
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Default">
<SolidColorBrush x:Key="TextControlBackgroundFocused" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlForegroundFocused" Color="White"/>
<x:Double x:Key="TextControlThemeMinWidth">32</x:Double>
<x:Double x:Key="TextControlThemeMinHeight">16</x:Double>
</ResourceDictionary>
<ResourceDictionary x:Key="Light">
<SolidColorBrush x:Key="TextControlBackgroundFocused" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="TextControlForegroundFocused" Color="Black"/>
<x:Double x:Key="TextControlThemeMinWidth">32</x:Double>
<x:Double x:Key="TextControlThemeMinHeight">16</x:Double>
</ResourceDictionary>
<ResourceDictionary x:Key="HighContrast">
<SolidColorBrush x:Key="TextControlBackgroundFocused" Color="{ThemeResource SystemColorButtonFaceColor}"/>
<SolidColorBrush x:Key="TextControlBackgroundPointerOver" Color="{StaticResource SystemColorButtonFaceColor}"/>
<SolidColorBrush x:Key="TextControlForegroundFocused" Color="{ThemeResource SystemColorButtonTextColor}"/>
<x:Double x:Key="TextControlThemeMinWidth">32</x:Double>
<x:Double x:Key="TextControlThemeMinHeight">16</x:Double>
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>
</ListView.Resources>
<ListView.Header>
<TextBlock x:Uid="VaiablesHeader" Margin="0,0,0,12"/>
</ListView.Header>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="Margin" Value="0,0,0,12"/>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate x:DataType="vm:VariableViewModel">
<StackPanel>
<Grid HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Padding="0,0,0,8"
VerticalAlignment="Bottom"
Text="{x:Bind Name}"/>
<TextBox x:Name="ValueTextBox"
Grid.Column="1"
HorizontalAlignment="Left"
Style="{StaticResource VariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Value, Mode=OneWay}"/>
<ToggleButton x:Uid="sliderOptionsButton"
Grid.Column="2"
HorizontalAlignment="Right"
Background="Transparent"
FontFamily="{StaticResource SymbolThemeFontFamily}"
Content="&#xE713;"
IsChecked="{x:Bind SliderSettingsVisible, Mode=TwoWay}">
<ToggleButton.Resources>
<SolidColorBrush x:Key="ToggleButtonBackgroundPressed" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundChecked" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundCheckedPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBorderBrushCheckedPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBorderBrushPointerOver" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonBackgroundCheckedPressed" Color="Transparent"/>
<SolidColorBrush x:Key="ToggleButtonForegroundPointerOver" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundPressed" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundChecked" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundCheckedPressed" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="ToggleButtonForegroundCheckedPointerOver" Color="{ThemeResource SystemAccentColor}"/>
<x:Double x:Key="TextControlThemeMinWidth">32</x:Double>
</ToggleButton.Resources>
</ToggleButton>
</Grid>
<Slider MinHeight="38"
Maximum="{x:Bind Max, Mode=TwoWay}"
Minimum="{x:Bind Min, Mode=TwoWay}"
StepFrequency="{x:Bind Step, Mode=TwoWay}"
Visibility="{x:Bind SliderSettingsVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"
Value="{x:Bind Value, Mode=TwoWay}"/>
<Grid Grid.Row="1"
MinHeight="38"
HorizontalAlignment="Stretch"
Visibility="{x:Bind SliderSettingsVisible, Converter={StaticResource BooleanToVisibilityConverter}, Mode=OneWay}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal">
<TextBlock x:Uid="MinTextBlock"
Padding="0,0,0,8"
VerticalAlignment="Bottom"
FontWeight="SemiBold"/>
<TextBox x:Name="MinTextBox"
MaxWidth="96"
Style="{StaticResource VariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Min, Mode=OneWay}"/>
</StackPanel>
<StackPanel Grid.Column="1"
HorizontalAlignment="Center"
Orientation="Horizontal">
<TextBlock x:Uid="StepTextBlock"
Padding="0,0,0,8"
HorizontalAlignment="Center"
VerticalAlignment="Bottom"
FontWeight="SemiBold"/>
<TextBox x:Name="StepTextBox"
MaxWidth="96"
HorizontalAlignment="Center"
Style="{StaticResource VariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Step, Mode=OneWay}"/>
</StackPanel>
<StackPanel Grid.Column="2" Orientation="Horizontal">
<TextBlock x:Uid="MaxTextBlock"
Padding="0,0,0,8"
VerticalAlignment="Bottom"
FontWeight="SemiBold"/>
<TextBox x:Name="MaxTextBox"
MaxWidth="96"
Style="{StaticResource VariableTextBoxStyle}"
GotFocus="TextBoxGotFocus"
KeyDown="TextBoxKeyDown"
LosingFocus="TextBoxLosingFocus"
Text="{x:Bind Max, Mode=OneWay}"/>
</StackPanel>
</Grid>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Flyout>
</Button.Flyout>
</Button>
<ToggleButton x:Name="ActiveTracing"
<StackPanel Orientation="Horizontal">
<ToggleButton x:Name="ActiveTracing"
MinWidth="40"
Margin="0,-1"
Style="{ThemeResource ThemedGraphToggleButtonStyle}"
@ -644,7 +472,7 @@
Visibility="{x:Bind local:GraphingCalculator.ShouldDisplayPanel(IsSmallState, SwitchModeToggleButton.IsChecked.Value, x:False), Mode=OneWay}">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="1.8*"/>
<RowDefinition Height="2.2*" MaxHeight="400"/>
</Grid.RowDefinitions>
<!-- Ideally the KeyGraphFeaturesPanel should be a frame so that navigation to and from the panel could be handled nicely -->
@ -661,6 +489,7 @@
Margin="0,4,0,0"
Equations="{x:Bind ViewModel.Equations}"
KeyGraphFeaturesRequested="OnEquationKeyGraphFeaturesRequested"
Variables="{x:Bind ViewModel.Variables}"
Visibility="{x:Bind IsKeyGraphFeaturesVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
<local:GraphingNumPad Grid.Row="1"

View File

@ -313,58 +313,6 @@ void GraphingCalculator::OnVariableChanged(Platform::Object ^ sender, VariableCh
GraphingControl->SetVariable(args.variableName, args.newValue);
}
void GraphingCalculator::SubmitTextbox(TextBox ^ sender)
{
auto variableViewModel = static_cast<VariableViewModel ^>(sender->DataContext);
if (sender->Name == "ValueTextBox")
{
variableViewModel->SetValue(validateDouble(sender->Text, variableViewModel->Value));
}
else if (sender->Name == "MinTextBox")
{
variableViewModel->Min = validateDouble(sender->Text, variableViewModel->Min);
}
else if (sender->Name == "MaxTextBox")
{
variableViewModel->Max = validateDouble(sender->Text, variableViewModel->Max);
}
else if (sender->Name == "StepTextBox")
{
variableViewModel->Step = validateDouble(sender->Text, variableViewModel->Step);
}
}
void GraphingCalculator::TextBoxLosingFocus(TextBox ^ sender, LosingFocusEventArgs ^)
{
SubmitTextbox(sender);
}
void GraphingCalculator::TextBoxKeyDown(TextBox ^ sender, KeyRoutedEventArgs ^ e)
{
if (e->Key == ::VirtualKey::Enter)
{
SubmitTextbox(sender);
}
}
double GraphingCalculator::validateDouble(String ^ value, double defaultValue)
{
try
{
return stod(value->Data());
}
catch (...)
{
return defaultValue;
}
}
void GraphingCalculator::TextBoxGotFocus(TextBox ^ sender, RoutedEventArgs ^ e)
{
sender->SelectAll();
}
void GraphingCalculator::OnZoomInCommand(Object ^ /* parameter */)
{
GraphingControl->ZoomFromCenter(zoomInScale);

View File

@ -45,10 +45,6 @@ public ref class GraphingCalculator sealed : public Windows::UI::Xaml::Data::INo
Windows::Foundation::Collections::IObservableVector<CalculatorApp::ViewModel::EquationViewModel ^> ^ sender,
Windows::Foundation::Collections::IVectorChangedEventArgs ^ event);
void TextBoxLosingFocus(Windows::UI::Xaml::Controls::TextBox ^ textbox, Windows::UI::Xaml::Input::LosingFocusEventArgs ^ args);
void TextBoxKeyDown(Windows::UI::Xaml::Controls::TextBox ^ textbox, Windows::UI::Xaml::Input::KeyRoutedEventArgs ^ e);
void SubmitTextbox(Windows::UI::Xaml::Controls::TextBox ^ textbox);
void OnZoomInCommand(Object ^ parameter);
void OnZoomOutCommand(Object ^ parameter);
void OnZoomResetCommand(Object ^ parameter);