From 0f0ae1fb7b7390d7ebf676173d8721e18f746d87 Mon Sep 17 00:00:00 2001
From: donandren <donandren@gmail.com>
Date: Fri, 18 Dec 2015 19:13:29 +0200
Subject: [PATCH 1/2] new expander control

---
 src/Perspex.Controls/Expander.cs              |  69 ++++++++++
 src/Perspex.Controls/Perspex.Controls.csproj  |   1 +
 src/Perspex.Themes.Default/DefaultTheme.paml  |   1 +
 src/Perspex.Themes.Default/Expander.paml      | 123 ++++++++++++++++++
 .../Perspex.Themes.Default.csproj             |   1 +
 5 files changed, 195 insertions(+)
 create mode 100644 src/Perspex.Controls/Expander.cs
 create mode 100644 src/Perspex.Themes.Default/Expander.paml

diff --git a/src/Perspex.Controls/Expander.cs b/src/Perspex.Controls/Expander.cs
new file mode 100644
index 0000000000..5d96107ac8
--- /dev/null
+++ b/src/Perspex.Controls/Expander.cs
@@ -0,0 +1,69 @@
+using Perspex.Animation;
+using Perspex.Controls.Primitives;
+
+namespace Perspex.Controls
+{
+    public enum ExpandDirection
+    {
+        Down,
+        Up,
+        Left,
+        Right
+    }
+
+    public class Expander : HeaderedContentControl
+    {
+        static Expander()
+        {
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Down, ":ExpandDirectionDown");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Up, ":ExpandDirectionUp");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Left, ":ExpandDirectionLeft");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Right, ":ExpandDirectionRight");
+
+            PseudoClass(IsExpandedProperty, ":expanded");
+
+            IsExpandedProperty.Changed.AddClassHandler<Expander>(x => x.OnIsExpandedChanged);
+        }
+
+        protected virtual void OnIsExpandedChanged(PerspexPropertyChangedEventArgs e)
+        {
+            IVisual visualContent = Presenter;
+            if (Content != null && ContentTransition != null && visualContent != null)
+            {
+                bool forward = ExpandDirection == ExpandDirection.Left || ExpandDirection == ExpandDirection.Up;
+                if (IsExpanded)
+                {
+                    ContentTransition.Start(null, visualContent, forward);
+                }
+                else
+                {
+                    ContentTransition.Start(visualContent, null, !forward);
+                }
+            }
+        }
+
+        public static readonly PerspexProperty<bool> IsExpandedProperty = PerspexProperty.Register<Expander, bool>(nameof(IsExpanded), true);
+
+        public bool IsExpanded
+        {
+            get { return GetValue(IsExpandedProperty); }
+            set { SetValue(IsExpandedProperty, value); }
+        }
+
+        public static readonly PerspexProperty<ExpandDirection> ExpandDirectionProperty = PerspexProperty.Register<Expander, ExpandDirection>(nameof(ExpandDirection), ExpandDirection.Down);
+
+        public ExpandDirection ExpandDirection
+        {
+            get { return GetValue(ExpandDirectionProperty); }
+            set { SetValue(ExpandDirectionProperty, value); }
+        }
+
+        public static readonly PerspexProperty<IPageTransition> ContentTransitionProperty = PerspexProperty.Register<Expander, IPageTransition>(nameof(ContentTransition));
+
+        public IPageTransition ContentTransition
+        {
+            get { return GetValue(ContentTransitionProperty); }
+            set { SetValue(ContentTransitionProperty, value); }
+        }
+    }
+}
\ No newline at end of file
diff --git a/src/Perspex.Controls/Perspex.Controls.csproj b/src/Perspex.Controls/Perspex.Controls.csproj
index 6bd1dd9162..0e8f07767e 100644
--- a/src/Perspex.Controls/Perspex.Controls.csproj
+++ b/src/Perspex.Controls/Perspex.Controls.csproj
@@ -44,6 +44,7 @@
     </Compile>
     <Compile Include="Classes.cs" />
     <Compile Include="DockPanel.cs" />
+    <Compile Include="Expander.cs" />
     <Compile Include="Generators\ItemContainer.cs" />
     <Compile Include="HotkeyManager.cs" />
     <Compile Include="INameScope.cs" />
diff --git a/src/Perspex.Themes.Default/DefaultTheme.paml b/src/Perspex.Themes.Default/DefaultTheme.paml
index 5d8ea78ef1..e3bcf623f1 100644
--- a/src/Perspex.Themes.Default/DefaultTheme.paml
+++ b/src/Perspex.Themes.Default/DefaultTheme.paml
@@ -23,6 +23,7 @@
   <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.TabStripItem.paml"/>
   <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.TextBox.paml"/>
   <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.ToggleButton.paml"/>
+  <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.Expander.paml"/>
   <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.ToolTip.paml"/>
   <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.TreeView.paml"/>
   <StyleInclude Source="resource://application/Perspex.Themes.Default/Perspex.Themes.Default.TreeViewItem.paml"/>
diff --git a/src/Perspex.Themes.Default/Expander.paml b/src/Perspex.Themes.Default/Expander.paml
new file mode 100644
index 0000000000..c1cb99248d
--- /dev/null
+++ b/src/Perspex.Themes.Default/Expander.paml
@@ -0,0 +1,123 @@
+<Styles xmlns="https://github.com/perspex">
+
+  <Style Selector="Expander">
+    <Setter Property="ContentTransition">
+      <Setter.Value>
+        <CrossFade Duration="00:00:00.25" />
+      </Setter.Value>
+    </Setter>
+  </Style>
+  <Style Selector="Expander[ExpandDirection=Down]">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}">
+          <Grid RowDefinitions="Auto,*">
+            <ToggleButton Name="PART_toggle" Grid.Row="0"  Content="{TemplateBinding Header}" IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Grid.Row="1"
+                              IsVisible="{TemplateBinding IsExpanded}"
+                              Content="{TemplateBinding Content}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Stretch" />
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="Expander[ExpandDirection=Up]">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}">
+          <Grid RowDefinitions="*,Auto">
+            <ToggleButton Name="PART_toggle" Grid.Row="1"  Content="{TemplateBinding Header}" IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Grid.Row="0"
+                              IsVisible="{TemplateBinding IsExpanded}"
+                              Content="{TemplateBinding Content}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Stretch" />
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="Expander[ExpandDirection=Right]">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}">
+          <Grid ColumnDefinitions="Auto,*">
+            <ToggleButton Name="PART_toggle" Grid.Column="0"  Content="{TemplateBinding Header}" IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Grid.Column="1"
+                              IsVisible="{TemplateBinding IsExpanded}"
+                              Content="{TemplateBinding Content}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Stretch" />
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="Expander[ExpandDirection=Left]">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border Background="{TemplateBinding Background}">
+          <Grid ColumnDefinitions="*,Auto">
+            <ToggleButton Name="PART_toggle" Grid.Column="1"  Content="{TemplateBinding Header}" IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}" />
+            <ContentPresenter Name="PART_ContentPresenter"
+                              Grid.Column="0"
+                              IsVisible="{TemplateBinding IsExpanded}"
+                              Content="{TemplateBinding Content}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Stretch" />
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="Expander /template/ ToggleButton#PART_toggle">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Border BorderThickness="1">
+          <Grid ColumnDefinitions="Auto,Auto">
+            <Border Grid.Column="0" Width="20" Height="20" HorizontalAlignment="Center" VerticalAlignment="Center">
+              <Path Fill="Black"
+                      HorizontalAlignment="Center"
+                      VerticalAlignment="Center"
+                      Data="M 0 2 L 4 6 L 0 10 Z" />
+            </Border>
+            <ContentPresenter Grid.Column="1" Content="{TemplateBinding Content}" VerticalAlignment="Center" />
+          </Grid>
+        </Border>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+  <Style Selector="Expander /template/ ToggleButton#PART_toggle:pointerover /template/ Border">
+    <Setter Property="BorderBrush" Value="#ffaaaaaa" />
+  </Style>
+  <Style Selector="Expander:ExpandDirectionDown:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+    <Setter Property="RenderTransform">
+      <RotateTransform Angle="90" />
+    </Setter>
+  </Style>
+  <Style Selector="Expander:ExpandDirectionUp:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+    <Setter Property="RenderTransform">
+      <RotateTransform Angle="-90" />
+    </Setter>
+  </Style>
+  <Style Selector="Expander:ExpandDirectionLeft:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+    <Setter Property="RenderTransform">
+      <RotateTransform Angle="180" />
+    </Setter>
+  </Style>
+  <Style Selector="Expander:ExpandDirectionRight /template/ ToggleButton#PART_toggle /template/ Path">
+    <Setter Property="RenderTransform">
+      <RotateTransform Angle="180" />
+    </Setter>
+  </Style>
+  <Style Selector="Expander:ExpandDirectionRight:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+    <Setter Property="RenderTransform">
+      <RotateTransform Angle="0" />
+    </Setter>
+  </Style>
+</Styles>
\ No newline at end of file
diff --git a/src/Perspex.Themes.Default/Perspex.Themes.Default.csproj b/src/Perspex.Themes.Default/Perspex.Themes.Default.csproj
index f17c80fe52..cfc8544d16 100644
--- a/src/Perspex.Themes.Default/Perspex.Themes.Default.csproj
+++ b/src/Perspex.Themes.Default/Perspex.Themes.Default.csproj
@@ -143,6 +143,7 @@
     <EmbeddedResource Include="ToolTip.paml">
       <SubType>Designer</SubType>
     </EmbeddedResource>
+    <EmbeddedResource Include="Expander.paml" />
     <None Include="packages.config" />
     <EmbeddedResource Include="PopupRoot.paml">
       <SubType>Designer</SubType>

From 440fbf44fc38346dbdbc14e096af0e9a16854b4a Mon Sep 17 00:00:00 2001
From: donandren <donandren@gmail.com>
Date: Fri, 18 Dec 2015 19:42:25 +0200
Subject: [PATCH 2/2] expander some code refactoring

---
 src/Perspex.Controls/Expander.cs         | 59 +++++++++++++-----------
 src/Perspex.Themes.Default/Expander.paml | 10 ++--
 2 files changed, 37 insertions(+), 32 deletions(-)

diff --git a/src/Perspex.Controls/Expander.cs b/src/Perspex.Controls/Expander.cs
index 5d96107ac8..5ac926af47 100644
--- a/src/Perspex.Controls/Expander.cs
+++ b/src/Perspex.Controls/Expander.cs
@@ -13,57 +13,62 @@ namespace Perspex.Controls
 
     public class Expander : HeaderedContentControl
     {
+        public static readonly PerspexProperty<bool> IsExpandedProperty =
+            PerspexProperty.Register<Expander, bool>(nameof(IsExpanded), true);
+
+        public static readonly PerspexProperty<ExpandDirection> ExpandDirectionProperty =
+            PerspexProperty.Register<Expander, ExpandDirection>(nameof(ExpandDirection), ExpandDirection.Down);
+
+        public static readonly PerspexProperty<IPageTransition> ContentTransitionProperty =
+            PerspexProperty.Register<Expander, IPageTransition>(nameof(ContentTransition));
+
         static Expander()
         {
-            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Down, ":ExpandDirectionDown");
-            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Up, ":ExpandDirectionUp");
-            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Left, ":ExpandDirectionLeft");
-            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Right, ":ExpandDirectionRight");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Down, ":down");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Up, ":up");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Left, ":left");
+            PseudoClass(ExpandDirectionProperty, d => d == ExpandDirection.Right, ":right");
 
             PseudoClass(IsExpandedProperty, ":expanded");
 
             IsExpandedProperty.Changed.AddClassHandler<Expander>(x => x.OnIsExpandedChanged);
         }
 
-        protected virtual void OnIsExpandedChanged(PerspexPropertyChangedEventArgs e)
-        {
-            IVisual visualContent = Presenter;
-            if (Content != null && ContentTransition != null && visualContent != null)
-            {
-                bool forward = ExpandDirection == ExpandDirection.Left || ExpandDirection == ExpandDirection.Up;
-                if (IsExpanded)
-                {
-                    ContentTransition.Start(null, visualContent, forward);
-                }
-                else
-                {
-                    ContentTransition.Start(visualContent, null, !forward);
-                }
-            }
-        }
-
-        public static readonly PerspexProperty<bool> IsExpandedProperty = PerspexProperty.Register<Expander, bool>(nameof(IsExpanded), true);
-
         public bool IsExpanded
         {
             get { return GetValue(IsExpandedProperty); }
             set { SetValue(IsExpandedProperty, value); }
         }
 
-        public static readonly PerspexProperty<ExpandDirection> ExpandDirectionProperty = PerspexProperty.Register<Expander, ExpandDirection>(nameof(ExpandDirection), ExpandDirection.Down);
-
         public ExpandDirection ExpandDirection
         {
             get { return GetValue(ExpandDirectionProperty); }
             set { SetValue(ExpandDirectionProperty, value); }
         }
 
-        public static readonly PerspexProperty<IPageTransition> ContentTransitionProperty = PerspexProperty.Register<Expander, IPageTransition>(nameof(ContentTransition));
-
         public IPageTransition ContentTransition
         {
             get { return GetValue(ContentTransitionProperty); }
             set { SetValue(ContentTransitionProperty, value); }
         }
+
+        protected virtual void OnIsExpandedChanged(PerspexPropertyChangedEventArgs e)
+        {
+            IVisual visualContent = Presenter;
+
+            if (Content != null && ContentTransition != null && visualContent != null)
+            {
+                bool forward = ExpandDirection == ExpandDirection.Left ||
+                                ExpandDirection == ExpandDirection.Up;
+                if (IsExpanded)
+                {
+                    ContentTransition.Start(null, visualContent, forward);
+                }
+                else
+                {
+                    ContentTransition.Start(visualContent, null, !forward);
+                }
+            }
+        }
     }
 }
\ No newline at end of file
diff --git a/src/Perspex.Themes.Default/Expander.paml b/src/Perspex.Themes.Default/Expander.paml
index c1cb99248d..158f6514fd 100644
--- a/src/Perspex.Themes.Default/Expander.paml
+++ b/src/Perspex.Themes.Default/Expander.paml
@@ -95,27 +95,27 @@
   <Style Selector="Expander /template/ ToggleButton#PART_toggle:pointerover /template/ Border">
     <Setter Property="BorderBrush" Value="#ffaaaaaa" />
   </Style>
-  <Style Selector="Expander:ExpandDirectionDown:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+  <Style Selector="Expander:down:expanded /template/ ToggleButton#PART_toggle /template/ Path">
     <Setter Property="RenderTransform">
       <RotateTransform Angle="90" />
     </Setter>
   </Style>
-  <Style Selector="Expander:ExpandDirectionUp:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+  <Style Selector="Expander:up:expanded /template/ ToggleButton#PART_toggle /template/ Path">
     <Setter Property="RenderTransform">
       <RotateTransform Angle="-90" />
     </Setter>
   </Style>
-  <Style Selector="Expander:ExpandDirectionLeft:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+  <Style Selector="Expander:left:expanded /template/ ToggleButton#PART_toggle /template/ Path">
     <Setter Property="RenderTransform">
       <RotateTransform Angle="180" />
     </Setter>
   </Style>
-  <Style Selector="Expander:ExpandDirectionRight /template/ ToggleButton#PART_toggle /template/ Path">
+  <Style Selector="Expander:right /template/ ToggleButton#PART_toggle /template/ Path">
     <Setter Property="RenderTransform">
       <RotateTransform Angle="180" />
     </Setter>
   </Style>
-  <Style Selector="Expander:ExpandDirectionRight:expanded /template/ ToggleButton#PART_toggle /template/ Path">
+  <Style Selector="Expander:right:expanded /template/ ToggleButton#PART_toggle /template/ Path">
     <Setter Property="RenderTransform">
       <RotateTransform Angle="0" />
     </Setter>