Use a routed event to handle closing the properties dialog

Author: ScottHaney

AdobeScriptMaker.UI.ViewModels/MainWindows/MainScriptBuilderViewModel.cs

@@ -43,5 +43,11 @@ private void Loaded()
         {
             WeakReferenceMessenger.Default.Send(new InitializeStateMessage(1000, 0));
         }
+
+        [RelayCommand]
+        private void PropertiesClosed()
+        {
+            int x = 2;
+        }
     }
 }

AdobeScriptMaker.UI.ViewModels/Timeline/TimelineViewModel.cs

@@ -70,6 +70,12 @@ private void UpdatePosition(object arg)
                 Position = updatedPosition;
         }
 
+        [RelayCommand]
+        private void PropertiesClosed()
+        {
+            SelectedItem = null;
+        }
+
         public TimelineViewModel()
         {
             WeakReferenceMessenger.Default.Register<ResizeTimelineComponentMessage>(this);

AdobeScriptMaker.UI/Views/MainWindow.xaml

@@ -18,7 +18,7 @@
         WindowStyle="None"
         WindowStartupLocation="CenterScreen"
         d:DataContext="{d:DesignInstance {x:Type designTimeData:DesignTimeScriptBuilderViewModel}, IsDesignTimeCreatable=True}">
-    
+
     <Window.Resources>
         <Style TargetType="{x:Type mainViews:WindowSection}">
             <Setter Property="HeaderTemplate">

AdobeScriptMaker.UI/Views/PropertiesEditor/PropertiesEditor.xaml

@@ -3,6 +3,8 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
+             xmlns:prism="http://prismlibrary.com/"
              xmlns:local="clr-namespace:AdobeScriptMaker.UI.Views.PropertiesEditor"
              xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
              xmlns:customControls="clr-namespace:WPFCustomControls;assembly=WPFCustomControls"
@@ -31,6 +33,11 @@
                                             DoubleTemplate="{StaticResource doubleTemplate}"/>
     </UserControl.Resources>
     <customControls:SideSheet IsActive="{Binding SelectedItem, Converter={StaticResource selectedItemToActiveConverter}}">
+        <i:Interaction.Triggers>
+            <i:EventTrigger EventName="CloseClick">
+                <prism:InvokeCommandAction Command="{Binding PropertiesClosedCommand}"/>
+            </i:EventTrigger>
+        </i:Interaction.Triggers>
         <Grid Margin="10">
             <ItemsControl ItemsSource="{Binding SelectedItem.ComponentData.Parameters}"
                       ItemTemplateSelector="{StaticResource templateSelector}"

WPFCustomControls/SideSheet.cs

@@ -14,6 +14,7 @@
 using System.Windows.Navigation;
 using System.Windows.Shapes;
 using System.Xml.Linq;
+using System.Windows.Controls.Primitives;
 
 namespace WPFCustomControls
 {
@@ -28,9 +29,36 @@ public bool IsActive
         public static readonly DependencyProperty IsActiveProperty =
             DependencyProperty.Register("IsActive", typeof(bool), typeof(SideSheet), new PropertyMetadata(false));
 
+        public static readonly RoutedEvent CloseClickEvent = EventManager.RegisterRoutedEvent(
+            name: "CloseClick",
+            routingStrategy: RoutingStrategy.Bubble,
+            handlerType: typeof(RoutedEventHandler),
+            ownerType: typeof(SideSheet));
+
+        public event RoutedEventHandler CloseClick
+        {
+            add { AddHandler(CloseClickEvent, value); }
+            remove { RemoveHandler(CloseClickEvent, value); }
+        }
+
         static SideSheet()
         {
             DefaultStyleKeyProperty.OverrideMetadata(typeof(SideSheet), new FrameworkPropertyMetadata(typeof(SideSheet)));
         }
+
+        public override void OnApplyTemplate()
+        {
+            base.OnApplyTemplate();
+
+            var closeButton = Template.FindName("PART_CloseButton", this) as ButtonBase;
+            if (closeButton != null)
+                closeButton.Click += CloseButton_Click;
+        }
+
+        private void CloseButton_Click(object sender, RoutedEventArgs e)
+        {
+            var args = new RoutedEventArgs(CloseClickEvent);
+            RaiseEvent(args);
+        }
     }
 }

WPFCustomControls/Themes/Generic.xaml

@@ -14,10 +14,21 @@
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
                             Visibility="{TemplateBinding IsActive, Converter={StaticResource booleanToVisibilityConverter}}">
-                        <ScrollViewer HorizontalScrollBarVisibility="Disabled"
-                                      VerticalScrollBarVisibility="Auto">
-                            <ContentPresenter></ContentPresenter>
-                        </ScrollViewer>
+                        <Grid>
+                            <Grid.RowDefinitions>
+                                <RowDefinition Height="Auto"></RowDefinition>
+                                <RowDefinition Height="*"></RowDefinition>
+                            </Grid.RowDefinitions>
+
+                            <Button Name="PART_CloseButton"
+                                    HorizontalAlignment="Right"
+                                    Margin="3">X</Button>
+                            <ScrollViewer Grid.Row="1"
+                                          HorizontalScrollBarVisibility="Disabled"
+                                          VerticalScrollBarVisibility="Auto">
+                                <ContentPresenter></ContentPresenter>
+                            </ScrollViewer>
+                        </Grid>
                     </Border>
                 </ControlTemplate>
             </Setter.Value>