Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update styles for buttons on Graph and ListView #793

Merged
merged 8 commits into from Nov 20, 2019
Merged

Update styles for buttons on Graph and ListView #793

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
65f5c12
Fix listview
joseartrivera Nov 13, 2019
6c2a88d
merge with master
joseartrivera Nov 14, 2019
5258771
extra merge with KGF
joseartrivera Nov 14, 2019
e079ca8
Merge branch 'feature/GraphingCalculator' into uifixes
joseartrivera Nov 14, 2019
8f95c5b
Few tweaks
joseartrivera Nov 14, 2019
d039078
Fix scrolling
joseartrivera Nov 15, 2019
1536625
PR feedback and other tweaks
joseartrivera Nov 15, 2019
12586a7
Update src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
joseartrivera Nov 20, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 5 additions & 1 deletion src/Calculator/App.xaml
View file
Open in desktop
Expand Up @@ -28,6 +28,7 @@
<RevealBackgroundBrush x:Key="AppControlPressedButtonFaceBrush" Color="#30FFFFFF"/>
<SolidColorBrush x:Key="AppControlTransparentAccentColorBrush" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="AppControlPageTextBaseHighColorBrush" Color="{StaticResource SystemBaseHighColor}"/>
<SolidColorBrush x:Key="AppControlForegroundAccentBrush" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="AppControlPageTextRedColorBrush" Color="Red"/>
<RevealBorderBrush x:Key="AppControlForegroundTransparentRevealBorderBrush"
FallbackColor="Transparent"
Expand Down Expand Up @@ -85,6 +86,7 @@
<RevealBackgroundBrush x:Key="AppControlPressedButtonFaceBrush" Color="#30000000"/>
<SolidColorBrush x:Key="AppControlTransparentAccentColorBrush" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="AppControlPageTextBaseHighColorBrush" Color="{StaticResource SystemBaseHighColor}"/>
<SolidColorBrush x:Key="AppControlForegroundAccentBrush" Color="{ThemeResource SystemAccentColor}"/>
<SolidColorBrush x:Key="AppControlPageTextRedColorBrush" Color="Red"/>
<RevealBorderBrush x:Key="AppControlForegroundTransparentRevealBorderBrush"
FallbackColor="Transparent"
Expand Down Expand Up @@ -139,6 +141,7 @@
<SolidColorBrush x:Key="AppControlPressedButtonFaceBrush" Color="{ThemeResource SystemColorButtonFaceColor}"/>
<SolidColorBrush x:Key="AppControlTransparentAccentColorBrush" Color="Transparent"/>
<SolidColorBrush x:Key="AppControlPageTextBaseHighColorBrush" Color="{ThemeResource SystemColorWindowTextColor}"/>
<SolidColorBrush x:Key="AppControlForegroundAccentBrush" Color="{ThemeResource SystemColorHighlightColor}"/>
<SolidColorBrush x:Key="AppControlPageTextRedColorBrush" Color="{ThemeResource SystemColorWindowTextColor}"/>
<SolidColorBrush x:Key="AppControlForegroundTransparentRevealBorderBrush" Color="{ThemeResource SystemColorButtonTextColor}"/>
<SolidColorBrush x:Key="AppControlHighlightAccentRevealBackgroundBrush" Color="{ThemeResource SystemColorHighlightColor}"/>
Expand Down Expand Up @@ -522,6 +525,7 @@
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="FontSize" Value="{StaticResource CaptionFontSize}"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
Expand Down Expand Up @@ -561,7 +565,7 @@
BorderBrush="{ThemeResource AppControlForegroundTransparentRevealBorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
FontSize="{TemplateBinding FontSize}"
FontWeight="SemiBold"
FontWeight="{TemplateBinding FontWeight}"
AutomationProperties.AccessibilityView="Raw"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Expand Down
2 changes: 1 addition & 1 deletion src/Calculator/Resources/en-US/Resources.resw
View file
Open in desktop
Expand Up @@ -3491,7 +3491,7 @@
<value>Zoom Out</value>
<comment>Screen reader prompt for the zoom out button.</comment>
</data>
<data name="EquationInputButtonPlaceholderText" xml:space="preserve">
<data name="EquationInputButtonPlaceholder.Text" xml:space="preserve">
<value>Add Equation</value>
<comment>Placeholder text for the equation input button</comment>
</data>
Expand Down
124 changes: 78 additions & 46 deletions src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
View file
Open in desktop
Expand Up @@ -8,54 +8,86 @@
xmlns:vm="using:CalculatorApp.ViewModel"
d:DesignHeight="300"
d:DesignWidth="400"
SizeChanged="UserControl_SizeChanged"
mc:Ignorable="d">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>

<ListView x:Name="EquationInputList"
VerticalContentAlignment="Top"
IsItemClickEnabled="False"
ItemsSource="{x:Bind Equations}"
SelectionMode="None">
<ListView x:Name="EquationInputList"
VerticalContentAlignment="Top"
IsItemClickEnabled="False"
ItemsSource="{x:Bind Equations}"
SelectionMode="None">

<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="IsTabStop" Value="False"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Margin" Value="0,0,0,2"/>
</Style>
</ListView.ItemContainerStyle>
<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>

<ListView.ItemTemplate>
<DataTemplate x:DataType="vm:EquationViewModel">
<controls:EquationTextBox x:Uid="EquationInputButton"
Margin="0,0,3,0"
Style="{StaticResource EquationTextBoxStyle}"
EquationColor="{x:Bind LineColor, Mode=OneWay}"
EquationSubmitted="InputTextBox_Submitted"
GotFocus="InputTextBox_GotFocus"
Loaded="EquationTextBoxLoaded"
LostFocus="InputTextBox_LostFocus"
RemoveButtonClicked="EquationTextBox_RemoveButtonClicked">
<controls:EquationTextBox.KeyGraphFeaturesContent>
<StackPanel x:Name="KeyGraphFeaturesGrid" Visibility="{x:Bind KeyGraphFeaturesVisibility, Mode=OneWay}">
<TextBlock Text="Key Graph Features"/>
<TextBlock Text="{x:Bind Expression, Mode=OneWay}"/>
</StackPanel>
</controls:EquationTextBox.KeyGraphFeaturesContent>
<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.Footer>
<Button Margin="4"
Click="AddEquationButton_Click"
Content="+"/>
</ListView.Footer>
</ListView>
<ListView.ItemTemplate>
<DataTemplate x:DataType="vm:EquationViewModel">
<controls:EquationTextBox x:Uid="EquationInputButton"
Margin="1,0,1,0"
Style="{StaticResource EquationTextBoxStyle}"
EquationColor="{x:Bind LineColor, Mode=OneWay}"
EquationSubmitted="InputTextBox_Submitted"
GotFocus="InputTextBox_GotFocus"
Loaded="EquationTextBoxLoaded"
LostFocus="InputTextBox_LostFocus"
RemoveButtonClicked="EquationTextBox_RemoveButtonClicked">
<controls:EquationTextBox.KeyGraphFeaturesContent>
<StackPanel x:Name="KeyGraphFeaturesGrid" Visibility="{x:Bind KeyGraphFeaturesVisibility, Mode=OneWay}">
<TextBlock Text="Key Graph Features"/>
<TextBlock Text="{x:Bind Expression, Mode=OneWay}"/>
</StackPanel>
</controls:EquationTextBox.KeyGraphFeaturesContent>
<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>
<Button Grid.Row="1"
MinHeight="44"
Margin="2,0,2,1"
Padding="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
Style="{ThemeResource CaptionButtonStyle}"
FontSize="14"
FontWeight="Normal"
Click="AddEquationButton_Click">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>

<FontIcon MinWidth="44"
FontFamily="{StaticResource SymbolThemeFontFamily}"
Glyph="&#xE710;"/>

<TextBlock x:Uid="EquationInputButtonPlaceholder"
Grid.Column="1"
Margin="8,0,0,0"
VerticalAlignment="Center"/>
</Grid>
</Button.Content>
</Button>
</Grid>
</UserControl>
6 changes: 6 additions & 0 deletions src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp
View file
Open in desktop
Expand Up @@ -67,6 +67,7 @@ void EquationInputArea::AddNewEquation()
eq->LineColor = AvailableColors->GetAt(m_lastLineColorIndex);

Equations->Append(eq);
EquationInputList->ScrollIntoView(eq);
}

void EquationInputArea::InputTextBox_GotFocus(Object ^ sender, RoutedEventArgs ^ e)
Expand Down Expand Up @@ -158,3 +159,8 @@ void EquationInputArea::ReloadAvailableColors(bool isHighContrast)
equationViewModel->LineColor = AvailableColors->GetAt(m_lastLineColorIndex);
}
}

void CalculatorApp::EquationInputArea::UserControl_SizeChanged(Platform::Object ^ sender, Windows::UI::Xaml::SizeChangedEventArgs ^ e)
{
EquationInputList->MaxHeight = ActualHeight - 44;
joseartrivera marked this conversation as resolved.
Show resolved Hide resolved
}
1 change: 1 addition & 0 deletions src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.h
View file
Open in desktop
Expand Up @@ -38,5 +38,6 @@ namespace CalculatorApp
int m_lastLineColorIndex;
void EquationTextBox_RemoveButtonClicked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
void EquationTextBoxLoaded(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
void UserControl_SizeChanged(Platform::Object ^ sender, Windows::UI::Xaml::SizeChangedEventArgs ^ e);
};
}