calculator/src/Calculator/Views/GraphingCalculator/KeyGraphFeaturesPanel.xaml
Eric Wong 603d672015 Add tooltips to buttons in graphing calculator (#822)
* Add tooltips to buttons in graphing calculator

* Fix break due to bad merge

* CR Feedback
2019-11-22 15:08:23 -08:00

469 lines
33 KiB
XML

<UserControl x:Class="CalculatorApp.KeyGraphFeaturesPanel"
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:ts="using:CalculatorApp.TemplateSelectors"
xmlns:vm="using:CalculatorApp.ViewModel"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
mc:Ignorable="d">
<UserControl.Resources>
<Style x:Key="KGF_EquationTextBoxStyle" TargetType="controls:EquationTextBox">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
<Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="Foreground" Value="{ThemeResource TextBoxForegroundThemeBrush}"/>
<Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}"/>
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="Typography.StylisticSet20" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="controls:EquationTextBox">
<Grid>
<Grid.Resources>
<Style x:Key="KGF_EquationTextBoxStyle" TargetType="controls:MathRichEditBox">
<Setter Property="Foreground" Value="{ThemeResource TextControlForeground}"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="ContentLinkForegroundColor" Value="{ThemeResource ContentLinkForegroundColor}"/>
<Setter Property="ContentLinkBackgroundColor" Value="{ThemeResource ContentLinkBackgroundColor}"/>
<Setter Property="SelectionHighlightColor" Value="{ThemeResource TextControlSelectionHighlightColor}"/>
<Setter Property="BorderBrush" Value="{ThemeResource TextControlBorderBrush}"/>
<Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}"/>
<Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
<Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
<Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden"/>
<Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/>
<Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}"/>
<Setter Property="UseSystemFocusVisuals" Value="{ThemeResource IsApplicationFocusVisualKindReveal}"/>
<Setter Property="ContextFlyout" Value="{StaticResource TextControlCommandBarContextFlyout}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="controls:MathRichEditBox">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Disabled"/>
<VisualState x:Name="Normal"/>
<VisualState x:Name="PointerOver"/>
<VisualState x:Name="Focused"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ContentPresenter x:Name="HeaderContentPresenter"
Grid.Row="0"
Grid.Column="0"
Grid.ColumnSpan="4"
Margin="{ThemeResource RichEditBoxTopHeaderMargin}"
Foreground="{ThemeResource TextControlHeaderForeground}"
FontWeight="Normal"
x:DeferLoadStrategy="Lazy"
Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}"
TextWrapping="Wrap"
Visibility="Collapsed"/>
<Border x:Name="BorderElement"
Grid.Row="1"
Grid.RowSpan="1"
Grid.Column="0"
Grid.ColumnSpan="4"
MinWidth="{ThemeResource TextControlThemeMinWidth}"
MinHeight="{ThemeResource TextControlThemeMinHeight}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="0"
Control.IsTemplateFocusTarget="True"
CornerRadius="{TemplateBinding CornerRadius}"/>
<ScrollViewer x:Name="ContentElement"
Grid.Row="1"
Grid.Column="0"
Margin="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}"
VerticalAlignment="Center"
AutomationProperties.AccessibilityView="Raw"
HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
IsTabStop="False"
IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
ZoomMode="Disabled"/>
<TextBlock x:Name="PlaceholderTextContentPresenter"
Grid.Row="1"
Grid.Column="0"
Grid.ColumnSpan="4"
Margin="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}"
VerticalAlignment="Center"
Foreground="{ThemeResource TextControlPlaceholderForeground}"
IsHitTestVisible="False"
Text="{TemplateBinding PlaceholderText}"
TextAlignment="{TemplateBinding TextAlignment}"
TextWrapping="{TemplateBinding TextWrapping}"/>
<ContentPresenter x:Name="DescriptionPresenter"
Grid.Row="2"
Grid.Column="0"
Grid.ColumnSpan="4"
Background="Transparent"
Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}"
x:Load="False"
AutomationProperties.AccessibilityView="Raw"
Content="{TemplateBinding Description}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition MinHeight="44"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Button x:Name="KGFEquationButton"
x:Uid="equationAnalysisBack"
MinWidth="44"
MinHeight="44"
VerticalAlignment="Stretch"
Background="{TemplateBinding EquationColor}"
Foreground="{StaticResource SystemChromeWhiteColor}"
BorderThickness="0">
<Button.Content>
<StackPanel x:Name="FunctionNumberLabel"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Background="Transparent"
Orientation="Horizontal"
Margin="5,0">
<FontIcon VerticalAlignment="Center"
FontFamily="{ThemeResource SymbolThemeFontFamily}"
FontSize="16"
Glyph="&#xE72B;"/>
<TextBlock Text="ƒ" Margin="12,0,0,0"/>
<TextBlock Margin="0,10,0,0"
FontSize="9"
Text="{TemplateBinding EquationButtonContentIndex}"/>
</StackPanel>
</Button.Content>
<Button.Resources>
<SolidColorBrush x:Name="ButtonBackgroundPointerOver"
Opacity="0.7"
Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=EquationColor.Color}"/>
<SolidColorBrush x:Name="ButtonForegroundPointerOver" Color="{ThemeResource SystemChromeWhiteColor}"/>
<SolidColorBrush x:Name="ButtonBorderBrushPointerOver" Color="Transparent"/>
</Button.Resources>
</Button>
<controls:MathRichEditBox x:Name="EquationTextBox"
Grid.Column="1"
MinHeight="44"
Padding="{TemplateBinding Padding}"
VerticalAlignment="Stretch"
Style="{StaticResource MathRichEdit_EquationTextBoxStyle}"
Background="Transparent"
BorderThickness="0"
FontFamily="{TemplateBinding FontFamily}"
FontSize="{TemplateBinding FontSize}"
FontWeight="{TemplateBinding FontWeight}"
AcceptsReturn="false"
InputScope="Text"
IsReadOnly="True"
MaxLength="2048"
TextWrapping="NoWrap"
UseSystemFocusVisuals="True"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="KGF_RichEditBoxStyle" TargetType="controls:MathRichEditBox">
<Setter Property="FontSize" Value="14"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="IsReadOnly" Value="True"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="IsEnabled" Value="True"/>
<Setter Property="Margin" Value="-8,0,0,0"/>
<Setter Property="UseSystemFocusVisuals" Value="True"/>
<Setter Property="TextWrapping" Value="NoWrap"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Stretch"/>
<Setter Property="Typography.StylisticSet20" Value="True"/>
<Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollMode" Value="Disabled"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/>
<Setter Property="TextWrapping" Value="NoWrap"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Stretch"/>
<Setter Property="Typography.StylisticSet20" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RichEditBox">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForeground}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBorderBrush}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForeground}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundDisabled}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Normal"/>
<VisualState x:Name="PointerOver"/>
<VisualState x:Name="Focused"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ContentPresenter x:Name="HeaderContentPresenter"
Grid.Row="0"
Margin="{ThemeResource RichEditBoxTopHeaderMargin}"
Foreground="{ThemeResource TextControlHeaderForeground}"
FontWeight="Normal"
x:DeferLoadStrategy="Lazy"
Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}"
TextWrapping="Wrap"
Visibility="Collapsed"/>
<Border x:Name="BorderElement"
Grid.Row="1"
Grid.RowSpan="1"
MinWidth="{ThemeResource TextControlThemeMinWidth}"
MinHeight="{ThemeResource TextControlThemeMinHeight}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}"/>
<ScrollViewer x:Name="ContentElement"
Grid.Row="1"
Margin="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}"
VerticalAlignment="Center"
AutomationProperties.AccessibilityView="Raw"
HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
IsTabStop="False"
IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
ZoomMode="Disabled"/>
<TextBlock x:Name="PlaceholderTextContentPresenter"
Grid.Row="1"
Margin="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}"
Foreground="{ThemeResource TextControlPlaceholderForeground}"
IsHitTestVisible="False"
Text="{TemplateBinding PlaceholderText}"
TextAlignment="{TemplateBinding TextAlignment}"
TextWrapping="{TemplateBinding TextWrapping}"/>
<ContentPresenter x:Name="DescriptionPresenter"
Grid.Row="2"
Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}"
x:Load="False"
AutomationProperties.AccessibilityView="Raw"
Content="{TemplateBinding Description}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Name="KGF_TitleTextBlockStyle" TargetType="TextBlock">
<Setter Property="FontWeight" Value="Medium"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="TextWrapping" Value="WrapWholeWords"/>
<Setter Property="VerticalAlignment" Value="Bottom"/>
<Setter Property="AutomationProperties.HeadingLevel" Value="Level2"/>
</Style>
<Style x:Name="KGF_TextBlockStyle" TargetType="TextBlock">
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="TextWrapping" Value="WrapWholeWords"/>
</Style>
<Style x:Name="KGF_ListViewItemContainerStyle" TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="Width" Value="Auto"/>
<Setter Property="AutomationProperties.AccessibilityView" Value="Raw"/>
<Setter Property="Margin" Value="0,10"/>
</Style>
<DataTemplate x:Key="KGFRichEditDataTemplate" x:DataType="vm:KeyGraphFeaturesItem">
<StackPanel>
<TextBlock x:Name="TitleTextBlock"
Style="{StaticResource KGF_TitleTextBlockStyle}"
Text="{x:Bind Title, Mode=OneWay}"/>
<ItemsControl ItemsSource="{x:Bind DisplayItems, Mode=OneWay}" UseSystemFocusVisuals="True">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="x:String">
<controls:MathRichEditBox HorizontalAlignment="Left"
HorizontalContentAlignment="Left"
Style="{StaticResource KGF_RichEditBoxStyle}"
MathText="{x:Bind}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="KGFGridDataTemplate" x:DataType="vm:KeyGraphFeaturesItem">
<StackPanel>
<TextBlock x:Name="TitleTextBlock"
Style="{StaticResource KGF_TitleTextBlockStyle}"
Text="{x:Bind Title, Mode=OneWay}"/>
<ItemsControl ItemsSource="{x:Bind GridItems, Mode=OneWay}" UseSystemFocusVisuals="True">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="vm:GridDisplayItems">
<Grid VerticalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<controls:MathRichEditBox Grid.Column="0"
MinWidth="25"
VerticalAlignment="Center"
Style="{StaticResource KGF_RichEditBoxStyle}"
MathText="{x:Bind Expression}"/>
<TextBlock Grid.Column="1"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Style="{StaticResource KGF_TextBlockStyle}"
Text="{x:Bind Direction}"/>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="KGFTextBlockDataTemplate" x:DataType="vm:KeyGraphFeaturesItem">
<StackPanel>
<TextBlock x:Name="TitleTextBlock"
Style="{StaticResource KGF_TitleTextBlockStyle}"
Text="{x:Bind Title, Mode=OneWay}"/>
<ItemsControl ItemsSource="{x:Bind DisplayItems, Mode=OneWay}" UseSystemFocusVisuals="True">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="x:String">
<TextBlock Style="{StaticResource KGF_TextBlockStyle}" Text="{x:Bind}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</DataTemplate>
<ts:KeyGraphFeaturesTemplateSelector x:Key="KGFTemplateSelector"
GridTemplate="{StaticResource KGFGridDataTemplate}"
RichEditTemplate="{StaticResource KGFRichEditDataTemplate}"
TextBlockTemplate="{StaticResource KGFTextBlockDataTemplate}"/>
<converters:BooleanToVisibilityNegationConverter x:Name="BooleanToVisibilityNegationConverter"/>
</UserControl.Resources>
<Grid Margin="0,7,0,0" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<controls:EquationTextBox x:Name="EquationInputTextBox"
x:Uid="EquationInputButton"
Grid.Row="0"
Margin="0,0,3,0"
Style="{StaticResource KGF_EquationTextBoxStyle}"
Background="Transparent"
BorderThickness="0"
DataContext="{x:Bind ViewModel, Mode=OneWay}"
EquationButtonClicked="EquationButtonClicked"
EquationButtonContentIndex="{x:Bind ViewModel.FunctionLabelIndex, Mode=OneWay}"
EquationColor="{x:Bind ViewModel.LineColor, Mode=OneWay}"
Loaded="EquationInputTextBox_Loaded"/>
<TextBlock x:Uid="KeyGraphFeaturesLabel"
Grid.Row="1"
Margin="12,20,10,0"
Style="{StaticResource KGF_TitleTextBlockStyle}"
FontSize="18"
AutomationProperties.HeadingLevel="Level1"/>
<ListView x:Name="KeyGraphFeaturesListView"
Grid.Row="2"
Margin="12,10,10,0"
Padding="0,0,0,12"
IsItemClickEnabled="False"
ItemContainerStyle="{StaticResource KGF_ListViewItemContainerStyle}"
ItemTemplateSelector="{StaticResource KGFTemplateSelector}"
ItemsSource="{x:Bind ViewModel.KeyGraphFeaturesItems}"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.VerticalScrollMode="Auto"
SelectionMode="None"
Visibility="{x:Bind ViewModel.AnalysisErrorVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
<TextBlock x:Name="AnalysisErrorTextBlock"
Grid.Row="2"
Margin="12,10,10,0"
Style="{StaticResource KGF_TextBlockStyle}"
FontWeight="Normal"
Text="{x:Bind ViewModel.AnalysisErrorString, Mode=OneWay}"
Visibility="{x:Bind ViewModel.AnalysisErrorVisible, Mode=OneWay}"/>
</Grid>
</UserControl>