Use data binding

Author: VictoriousRaptor

Flow.Launcher/MainWindow.xaml

@@ -343,7 +343,7 @@
                     <StackPanel
                         x:Name="ResultArea"
                         Grid.Column="0"
-                        Grid.ColumnSpan="2">
+                        Grid.ColumnSpan="{Binding ResultAreaColumn}">
                         <Border Style="{DynamicResource WindowRadius}">
                             <Border.Clip>
                                 <MultiBinding Converter="{StaticResource BorderClipConverter}">
@@ -397,11 +397,13 @@
                         x:Name="Preview"
                         Grid.Column="1"
                         VerticalAlignment="Stretch"
-                        d:DataContext="{d:DesignInstance vm:ResultViewModel}"
-                        DataContext="{Binding SelectedItem, ElementName=ResultListBox}"
                         Style="{DynamicResource PreviewArea}"
-                        Visibility="Collapsed">
-                        <Border Style="{DynamicResource PreviewBorderStyle}" Visibility="{Binding ShowDefaultPreview}">
+                        Visibility="{Binding PreviewVisible, Converter={StaticResource BoolToVisibilityConverter}}">
+                        <Border 
+                            Style="{DynamicResource PreviewBorderStyle}" 
+                            d:DataContext="{d:DesignInstance vm:ResultViewModel}"
+                            DataContext="{Binding SelectedItem, ElementName=ResultListBox}"
+                            Visibility="{Binding ShowDefaultPreview}">
                             <Grid
                                 Margin="20,0,10,0"
                                 VerticalAlignment="Stretch"
@@ -472,7 +474,11 @@
                                 </StackPanel>
                             </Grid>
                         </Border>
-                        <Border Style="{DynamicResource PreviewBorderStyle}" Visibility="{Binding ShowCustomizedPreview}">
+                        <Border 
+                            d:DataContext="{d:DesignInstance vm:ResultViewModel}"
+                            DataContext="{Binding SelectedItem, ElementName=ResultListBox}"
+                            Style="{DynamicResource PreviewBorderStyle}" 
+                            Visibility="{Binding ShowCustomizedPreview}">
                             <ContentControl Content="{Binding Result.PreviewPanel.Value}" />
                         </Border>
                     </Grid>

Flow.Launcher/MainWindow.xaml.cs

@@ -633,30 +633,11 @@ private void OnKeyDown(object sender, KeyEventArgs e)
 
         public void PreviewReset()
         {
-            if (_settings.AlwaysPreview == true)
-            {
-                ResultArea.SetValue(Grid.ColumnSpanProperty, 1);
-                Preview.Visibility = Visibility.Visible;
-            }
-            else
-            {
-                ResultArea.SetValue(Grid.ColumnSpanProperty, 2);
-                Preview.Visibility = Visibility.Collapsed;
-            }
+            _viewModel.ResetPreview();
         }
         public void PreviewToggle()
         {
-
-            if (Preview.Visibility == Visibility.Collapsed)
-            {
-                ResultArea.SetValue(Grid.ColumnSpanProperty, 1);
-                Preview.Visibility = Visibility.Visible;
-            }
-            else
-            {
-                ResultArea.SetValue(Grid.ColumnSpanProperty, 2);
-                Preview.Visibility = Visibility.Collapsed;
-            }
+            _viewModel.TogglePreview();
         }
 
         private void MoveQueryTextToEnd()

Flow.Launcher/ViewModel/MainViewModel.cs

@@ -104,7 +104,7 @@ public MainViewModel(Settings settings)
             RegisterResultsUpdatedEvent();
             RegisterClockAndDateUpdateAsync();
 
-            SetOpenResultModifiers();
+            SetOpenResultModifiers(); // TODO?
         }
 
         private void RegisterViewUpdate()
@@ -424,6 +424,43 @@ private void DecreaseMaxResult()
             Settings.MaxResultsToShow -= 1;
         }
 
+        [RelayCommand]
+        public void TogglePreview()
+        {
+            if (!PreviewVisible)
+            {
+                ShowPreview();
+            }
+            else
+            {
+                HidePreview();
+            }
+        }
+
+        private void ShowPreview()
+        {
+            ResultAreaColumn = 1;
+            PreviewVisible = true;
+        }
+
+        private void HidePreview()
+        {
+            ResultAreaColumn = 2;
+            PreviewVisible = false;
+        }
+
+        public void ResetPreview()
+        {
+            if (Settings.AlwaysPreview == true)
+            {
+                ShowPreview();
+            }
+            else
+            {
+                HidePreview();
+            }
+        }
+
         /// <summary>
         /// we need move cursor to end when we manually changed query
         /// but we don't want to move cursor to end when query is updated from TextBox
@@ -519,6 +556,10 @@ public double MainWindowWidth
 
         public bool StartWithEnglishMode => Settings.AlwaysStartEn;
 
+        public bool PreviewVisible { get; set; } = false;
+
+        public int ResultAreaColumn { get; set; } = 1;
+
         #endregion
 
         public void Query()