From ebc57af20396ea0d2707a0eb5dd22036a5baf65d Mon Sep 17 00:00:00 2001
From: Pepe Rivera <joseartrivera@gmail.com>
Date: Wed, 11 Mar 2020 09:41:52 -0700
Subject: [PATCH] Work around crash by replacing ItemRepeater with ListView
 (#1058)

* Replace ItemRepeater with ListView

* Allow animations

* undo temp key change

* Remove animation
---
 .../GraphingCalculator/EquationInputArea.xaml | 134 +++++++++++-------
 .../EquationInputArea.xaml.cpp                |   6 +-
 2 files changed, 85 insertions(+), 55 deletions(-)

diff --git a/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml b/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
index d2b1526..07daf2a 100644
--- a/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
+++ b/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
@@ -775,58 +775,88 @@
             </Style>
         </ResourceDictionary>
     </UserControl.Resources>
-    <mux:ItemsRepeaterScrollHost>
-        <ScrollViewer VerticalScrollBarVisibility="Auto">
-            <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="EquationTextBox_DataContextChanged"
-                                                      EquationButtonClicked="EquationTextBox_EquationButtonClicked"
-                                                      EquationButtonContentIndex="{x:Bind FunctionLabelIndex, Mode=OneWay}"
-                                                      EquationColor="{x:Bind local:EquationInputArea.ToSolidColorBrush(LineColor), Mode=OneWay}"
-                                                      EquationFormatRequested="EquationTextBox_EquationFormatRequested"
-                                                      EquationSubmitted="EquationTextBox_Submitted"
-                                                      GotFocus="EquationTextBox_GotFocus"
-                                                      HasError="{x:Bind GraphEquation.HasGraphError, Mode=OneWay}"
-                                                      IsAddEquationMode="{x:Bind IsLastItemInList, Mode=OneWay}"
-                                                      KeyGraphFeaturesButtonClicked="EquationTextBox_KeyGraphFeaturesButtonClicked"
-                                                      Loaded="EquationTextBox_Loaded"
-                                                      LostFocus="EquationTextBox_LostFocus"
-                                                      MathEquation="{x:Bind Expression, Mode=TwoWay}"
-                                                      RemoveButtonClicked="EquationTextBox_RemoveButtonClicked">
-                                <controls:EquationTextBox.ColorChooserFlyout>
-                                    <Flyout 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 x:Name="VariableStackPanel" x:Load="{x:Bind local:EquationInputArea.ManageEditVariablesButtonLoaded(Variables.Size), Mode=OneWay}">
-                    <Rectangle Height="1"
-                               Margin="12"
-                               Fill="#33000000"/>
-                    <mux:ItemsRepeater 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 VerticalScrollBarVisibility="Auto">
+        <StackPanel>
+            <!-- This ListView and the one below should be replacted by an ItemRepeater once https://github.com/microsoft/microsoft-ui-xaml/issues/2011 is fixed. -->
+            <ListView x:Name="EquationInputList"
+                      IsItemClickEnabled="False"
+                      ItemsSource="{x:Bind Equations}"
+                      SelectionMode="None"
+                      TabFocusNavigation="Local">
 
-        </ScrollViewer>
-    </mux:ItemsRepeaterScrollHost>
+                <!-- Removes animations from the ListView Style. -->
+                <ListView.Style>
+                    <Style TargetType="ListView">
+                        <Setter Property="ItemContainerTransitions">
+                            <Setter.Value>
+                                <TransitionCollection/>
+                            </Setter.Value>
+                        </Setter>
+                    </Style>
+                </ListView.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>
+                <ListView.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="EquationTextBox_DataContextChanged"
+                                                  EquationButtonClicked="EquationTextBox_EquationButtonClicked"
+                                                  EquationButtonContentIndex="{x:Bind FunctionLabelIndex, Mode=OneWay}"
+                                                  EquationColor="{x:Bind local:EquationInputArea.ToSolidColorBrush(LineColor), Mode=OneWay}"
+                                                  EquationFormatRequested="EquationTextBox_EquationFormatRequested"
+                                                  EquationSubmitted="EquationTextBox_Submitted"
+                                                  GotFocus="EquationTextBox_GotFocus"
+                                                  HasError="{x:Bind GraphEquation.HasGraphError, Mode=OneWay}"
+                                                  IsAddEquationMode="{x:Bind IsLastItemInList, Mode=OneWay}"
+                                                  KeyGraphFeaturesButtonClicked="EquationTextBox_KeyGraphFeaturesButtonClicked"
+                                                  Loaded="EquationTextBox_Loaded"
+                                                  LostFocus="EquationTextBox_LostFocus"
+                                                  MathEquation="{x:Bind Expression, Mode=TwoWay}"
+                                                  RemoveButtonClicked="EquationTextBox_RemoveButtonClicked">
+                            <controls:EquationTextBox.ColorChooserFlyout>
+                                <Flyout x:Uid="ColorChooserFlyout" Placement="Bottom">
+                                    <local:EquationStylePanelControl SelectedColor="{x:Bind LineColor, Mode=TwoWay}"/>
+                                </Flyout>
+                            </controls:EquationTextBox.ColorChooserFlyout>
+                        </controls:EquationTextBox>
+                    </DataTemplate>
+                </ListView.ItemTemplate>
+            </ListView>
+            <StackPanel x:Name="VariableStackPanel" x:Load="{x:Bind local:EquationInputArea.ManageEditVariablesButtonLoaded(Variables.Size), Mode=OneWay}">
+                <Rectangle Height="1"
+                           Margin="12"
+                           Fill="#33000000"/>
+                <ListView IsItemClickEnabled="False"
+                          ItemTemplate="{StaticResource VariableDataTemplate}"
+                          ItemsSource="{x:Bind Variables, Mode=OneWay}"
+                          SelectionMode="None"
+                          TabFocusNavigation="Local">
+                    <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.Transitions>
+                        <TransitionCollection>
+                            <AddDeleteThemeTransition/>
+                        </TransitionCollection>
+                    </ListView.Transitions>
+                </ListView>
+            </StackPanel>
+        </StackPanel>
+    </ScrollViewer>
 
 </UserControl>
diff --git a/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp b/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp
index 7f981de..9784916 100644
--- a/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp
+++ b/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp
@@ -149,7 +149,7 @@ void EquationInputArea::FocusEquationTextBox(EquationViewModel ^ equation)
     {
         return;
     }
-    auto container = EquationInputList->TryGetElement(index);
+    auto container = EquationInputList->ContainerFromIndex(index);
     if (container == nullptr)
     {
         return;
@@ -234,7 +234,7 @@ void EquationInputArea::EquationTextBox_Loaded(Object ^ sender, RoutedEventArgs
         unsigned int index;
         if (Equations->IndexOf(copyEquationToFocus, &index))
         {
-            auto container = EquationInputList->TryGetElement(index);
+            auto container = static_cast<UIElement^>(EquationInputList->ContainerFromIndex(index));
             if (container != nullptr)
             {
                 container->StartBringIntoView();
@@ -264,7 +264,7 @@ void EquationInputArea::FocusEquationIfNecessary(CalculatorApp::Controls::Equati
         unsigned int index;
         if (Equations->IndexOf(m_equationToFocus, &index))
         {
-            auto container = EquationInputList->TryGetElement(index);
+            auto container = static_cast<UIElement ^>(EquationInputList->ContainerFromIndex(index));
             if (container != nullptr)
             {
                 container->StartBringIntoView();