Added control catalog.

Ported from old branch to incorporate latest master.

Perspex.sln

@@ -1,7 +1,7 @@
 
 Microsoft Visual Studio Solution File, Format Version 12.00
 # Visual Studio 14
-VisualStudioVersion = 14.0.23107.0
+VisualStudioVersion = 14.0.24720.0
 MinimumVisualStudioVersion = 10.0.40219.1
 Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Perspex.Base", "src\Perspex.Base\Perspex.Base.csproj", "{B09B78D8-9B26-48B0-9149-D64A2F120F3F}"
 EndProject
@@ -138,6 +138,8 @@ Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Perspex.iOSTestApplication"
 EndProject
 Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Perspex.LeakTests", "tests\Perspex.LeakTests\Perspex.LeakTests.csproj", "{E1AA3DBF-9056-4530-9376-18119A7A3FFE}"
 EndProject
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ControlCatalog", "samples\ControlCatalog\ControlCatalog.csproj", "{61BEC86C-F307-4295-B5B8-9428610D7D55}"
+EndProject
 Global
 	GlobalSection(SharedMSBuildProjectFiles) = preSolution
 		src\Shared\RenderHelpers\RenderHelpers.projitems*{fb05ac90-89ba-4f2f-a924-f37875fb547c}*SharedItemsImports = 4
@@ -146,18 +148,18 @@ Global
 		src\Shared\PlatformSupport\PlatformSupport.projitems*{e4d9629c-f168-4224-3f51-a5e482ffbc42}*SharedItemsImports = 13
 		src\Skia\Perspex.Skia\Perspex.Skia.projitems*{2f59f3d0-748d-4652-b01e-e0d954756308}*SharedItemsImports = 13
 		src\Shared\PlatformSupport\PlatformSupport.projitems*{db070a10-bf39-4752-8456-86e9d5928478}*SharedItemsImports = 4
-		src\Shared\RenderHelpers\RenderHelpers.projitems*{925dd807-b651-475f-9f7c-cbeb974ce43d}*SharedItemsImports = 4
 		src\Skia\Perspex.Skia\Perspex.Skia.projitems*{925dd807-b651-475f-9f7c-cbeb974ce43d}*SharedItemsImports = 4
+		src\Shared\RenderHelpers\RenderHelpers.projitems*{925dd807-b651-475f-9f7c-cbeb974ce43d}*SharedItemsImports = 4
 		samples\TestApplicationShared\TestApplicationShared.projitems*{78345174-5b52-4a14-b9fd-d5f2428137f0}*SharedItemsImports = 13
 		src\Shared\PlatformSupport\PlatformSupport.projitems*{54f237d5-a70a-4752-9656-0c70b1a7b047}*SharedItemsImports = 4
 		src\Shared\RenderHelpers\RenderHelpers.projitems*{3c4c0cb4-0c0f-4450-a37b-148c84ff905f}*SharedItemsImports = 13
 		src\Shared\PlatformSupport\PlatformSupport.projitems*{811a76cf-1cf6-440f-963b-bbe31bd72a82}*SharedItemsImports = 4
-		src\Shared\RenderHelpers\RenderHelpers.projitems*{47be08a7-5985-410b-9ffc-2264b8ea595f}*SharedItemsImports = 4
 		src\Skia\Perspex.Skia\Perspex.Skia.projitems*{47be08a7-5985-410b-9ffc-2264b8ea595f}*SharedItemsImports = 4
+		src\Shared\RenderHelpers\RenderHelpers.projitems*{47be08a7-5985-410b-9ffc-2264b8ea595f}*SharedItemsImports = 4
 		samples\TestApplicationShared\TestApplicationShared.projitems*{8c923867-8a8f-4f6b-8b80-47d9e8436166}*SharedItemsImports = 4
 		samples\TestApplicationShared\TestApplicationShared.projitems*{e3a1060b-50d0-44e8-88b6-f44ef2e5bd72}*SharedItemsImports = 4
-		src\Shared\RenderHelpers\RenderHelpers.projitems*{bd43f7c0-396b-4aa1-bad9-dfde54d51298}*SharedItemsImports = 4
 		src\Skia\Perspex.Skia\Perspex.Skia.projitems*{bd43f7c0-396b-4aa1-bad9-dfde54d51298}*SharedItemsImports = 4
+		src\Shared\RenderHelpers\RenderHelpers.projitems*{bd43f7c0-396b-4aa1-bad9-dfde54d51298}*SharedItemsImports = 4
 		src\Shared\RenderHelpers\RenderHelpers.projitems*{3e908f67-5543-4879-a1dc-08eace79b3cd}*SharedItemsImports = 4
 		src\Shared\PlatformSupport\PlatformSupport.projitems*{e1aa3dbf-9056-4530-9376-18119a7a3ffe}*SharedItemsImports = 4
 	EndGlobalSection
@@ -1267,6 +1269,30 @@ Global
 		{E1AA3DBF-9056-4530-9376-18119A7A3FFE}.Release|iPhone.Build.0 = Release|Any CPU
 		{E1AA3DBF-9056-4530-9376-18119A7A3FFE}.Release|iPhoneSimulator.ActiveCfg = Release|Any CPU
 		{E1AA3DBF-9056-4530-9376-18119A7A3FFE}.Release|iPhoneSimulator.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Ad-Hoc|Any CPU.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Ad-Hoc|Any CPU.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Ad-Hoc|iPhone.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Ad-Hoc|iPhone.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Ad-Hoc|iPhoneSimulator.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Ad-Hoc|iPhoneSimulator.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.AppStore|Any CPU.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.AppStore|Any CPU.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.AppStore|iPhone.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.AppStore|iPhone.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.AppStore|iPhoneSimulator.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.AppStore|iPhoneSimulator.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Debug|iPhone.ActiveCfg = Debug|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Debug|iPhone.Build.0 = Debug|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Debug|iPhoneSimulator.ActiveCfg = Debug|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Debug|iPhoneSimulator.Build.0 = Debug|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Release|Any CPU.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Release|iPhone.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Release|iPhone.Build.0 = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Release|iPhoneSimulator.ActiveCfg = Release|Any CPU
+		{61BEC86C-F307-4295-B5B8-9428610D7D55}.Release|iPhoneSimulator.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE
@@ -1310,5 +1336,6 @@ Global
 		{4488AD85-1495-4809-9AA4-DDFE0A48527E} = {0CB0B92E-6CFF-4240-80A5-CCAFE75D91E1}
 		{8C923867-8A8F-4F6B-8B80-47D9E8436166} = {0CB0B92E-6CFF-4240-80A5-CCAFE75D91E1}
 		{E1AA3DBF-9056-4530-9376-18119A7A3FFE} = {C5A00AC3-B34C-4564-9BDD-2DA473EF4D8B}
+		{61BEC86C-F307-4295-B5B8-9428610D7D55} = {9B9E3891-2366-4253-A952-D08BCEB71098}
 	EndGlobalSection
 EndGlobal

samples/ControlCatalog/App.config

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<configuration>
+    <startup> 
+        <supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.6" />
+    </startup>
+</configuration>

samples/ControlCatalog/App.paml

@@ -0,0 +1,16 @@
+<Application xmlns="https://github.com/perspex">
+  <Application.Styles>
+    <Style Selector="TextBlock.h1">
+      <Setter Property="Foreground" Value="#212121"/>
+      <Setter Property="FontSize" Value="20"/>
+      <Setter Property="FontWeight" Value="Medium"/>
+    </Style>
+
+    <Style Selector="TextBlock.h2">
+      <Setter Property="Foreground" Value="#727272"/>
+      <Setter Property="FontSize" Value="13"/>
+    </Style>
+
+    <StyleInclude Source="resource://application/ControlCatalog/ControlCatalog.SideBar.paml"/>
+  </Application.Styles>
+</Application>

samples/ControlCatalog/App.paml.cs

@@ -0,0 +1,55 @@
+using System;
+using System.Linq;
+using Perspex;
+using Perspex.Controls;
+using Perspex.Diagnostics;
+using Perspex.Markup.Xaml;
+using Perspex.Themes.Default;
+
+namespace ControlCatalog
+{
+    class App : Application
+    {
+        public App()
+        {
+            RegisterServices();
+            InitializeSubsystems(GetPlatformId());
+            Styles = new DefaultTheme();
+            InitializeComponent();
+        }
+
+        public static void AttachDevTools(Window window)
+        {
+#if DEBUG
+            DevTools.Attach(window);
+#endif
+        }
+
+        static void Main(string[] args)
+        {
+            var app = new App();
+            var window = new MainWindow();
+            window.Show();
+            app.Run(window);
+        }
+
+        private void InitializeComponent()
+        {
+            PerspexXamlLoader.Load(this);
+        }
+
+        private int GetPlatformId()
+        {
+            var args = Environment.GetCommandLineArgs();
+
+            if (args.Contains("--gtk"))
+            {
+                return (int)PlatformID.Unix;
+            }
+            else
+            {
+                return (int)Environment.OSVersion.Platform;
+            }
+        }
+    }
+}

samples/ControlCatalog/ControlCatalog.csproj

@@ -0,0 +1,186 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="14.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <Import Project="$(MSBuildExtensionsPath)\$(MSBuildToolsVersion)\Microsoft.Common.props" Condition="Exists('$(MSBuildExtensionsPath)\$(MSBuildToolsVersion)\Microsoft.Common.props')" />
+  <PropertyGroup>
+    <Configuration Condition=" '$(Configuration)' == '' ">Debug</Configuration>
+    <Platform Condition=" '$(Platform)' == '' ">AnyCPU</Platform>
+    <ProjectGuid>{61BEC86C-F307-4295-B5B8-9428610D7D55}</ProjectGuid>
+    <OutputType>WinExe</OutputType>
+    <AppDesignerFolder>Properties</AppDesignerFolder>
+    <RootNamespace>ControlCatalog</RootNamespace>
+    <AssemblyName>ControlCatalog</AssemblyName>
+    <TargetFrameworkVersion>v4.6</TargetFrameworkVersion>
+    <FileAlignment>512</FileAlignment>
+    <AutoGenerateBindingRedirects>true</AutoGenerateBindingRedirects>
+  </PropertyGroup>
+  <PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Debug|AnyCPU' ">
+    <PlatformTarget>AnyCPU</PlatformTarget>
+    <DebugSymbols>true</DebugSymbols>
+    <DebugType>full</DebugType>
+    <Optimize>false</Optimize>
+    <OutputPath>bin\Debug\</OutputPath>
+    <DefineConstants>DEBUG;TRACE</DefineConstants>
+    <ErrorReport>prompt</ErrorReport>
+    <WarningLevel>4</WarningLevel>
+  </PropertyGroup>
+  <PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Release|AnyCPU' ">
+    <PlatformTarget>AnyCPU</PlatformTarget>
+    <DebugType>pdbonly</DebugType>
+    <Optimize>true</Optimize>
+    <OutputPath>bin\Release\</OutputPath>
+    <DefineConstants>TRACE</DefineConstants>
+    <ErrorReport>prompt</ErrorReport>
+    <WarningLevel>4</WarningLevel>
+  </PropertyGroup>
+  <PropertyGroup>
+    <StartupObject />
+  </PropertyGroup>
+  <ItemGroup>
+    <Reference Include="System" />
+    <Reference Include="System.Core" />
+    <Reference Include="System.Xml.Linq" />
+    <Reference Include="System.Data.DataSetExtensions" />
+    <Reference Include="Microsoft.CSharp" />
+    <Reference Include="System.Data" />
+    <Reference Include="System.Net.Http" />
+    <Reference Include="System.Xml" />
+  </ItemGroup>
+  <ItemGroup>
+    <Compile Include="App.paml.cs">
+      <DependentUpon>App.paml</DependentUpon>
+    </Compile>
+    <Compile Include="MainWindow.paml.cs">
+      <DependentUpon>MainWindow.paml</DependentUpon>
+    </Compile>
+    <Compile Include="Pages\BorderPage.paml.cs">
+      <DependentUpon>BorderPage.paml</DependentUpon>
+    </Compile>
+    <Compile Include="Pages\CarouselPage.paml.cs">
+      <DependentUpon>CarouselPage.paml</DependentUpon>
+    </Compile>
+    <Compile Include="Pages\CanvasPage.paml.cs">
+      <DependentUpon>CanvasPage.paml</DependentUpon>
+    </Compile>
+    <Compile Include="Pages\ButtonPage.paml.cs">
+      <DependentUpon>ButtonPage.paml</DependentUpon>
+    </Compile>
+    <Compile Include="Properties\AssemblyInfo.cs" />
+  </ItemGroup>
+  <ItemGroup>
+    <None Include="App.config" />
+    <EmbeddedResource Include="App.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+    <EmbeddedResource Include="Pages\ButtonPage.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+    <EmbeddedResource Include="SideBar.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+    <EmbeddedResource Include="MainWindow.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+    <EmbeddedResource Include="Pages\BorderPage.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+    <EmbeddedResource Include="Pages\CanvasPage.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+    <EmbeddedResource Include="Pages\CarouselPage.paml">
+      <SubType>Designer</SubType>
+    </EmbeddedResource>
+  </ItemGroup>
+  <ItemGroup>
+    <ProjectReference Include="..\..\src\Gtk\Perspex.Cairo\Perspex.Cairo.csproj">
+      <Project>{fb05ac90-89ba-4f2f-a924-f37875fb547c}</Project>
+      <Name>Perspex.Cairo</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Gtk\Perspex.Gtk\Perspex.Gtk.csproj">
+      <Project>{54f237d5-a70a-4752-9656-0c70b1a7b047}</Project>
+      <Name>Perspex.Gtk</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Markup\Perspex.Markup.Xaml\Perspex.Markup.Xaml.csproj">
+      <Project>{3e53a01a-b331-47f3-b828-4a5717e77a24}</Project>
+      <Name>Perspex.Markup.Xaml</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Markup\Perspex.Markup\Perspex.Markup.csproj">
+      <Project>{6417e941-21bc-467b-a771-0de389353ce6}</Project>
+      <Name>Perspex.Markup</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Animation\Perspex.Animation.csproj">
+      <Project>{d211e587-d8bc-45b9-95a4-f297c8fa5200}</Project>
+      <Name>Perspex.Animation</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Application\Perspex.Application.csproj">
+      <Project>{799a7bb5-3c2c-48b6-85a7-406a12c420da}</Project>
+      <Name>Perspex.Application</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Base\Perspex.Base.csproj">
+      <Project>{b09b78d8-9b26-48b0-9149-d64a2f120f3f}</Project>
+      <Name>Perspex.Base</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Controls\Perspex.Controls.csproj">
+      <Project>{d2221c82-4a25-4583-9b43-d791e3f6820c}</Project>
+      <Name>Perspex.Controls</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Diagnostics\Perspex.Diagnostics.csproj">
+      <Project>{7062ae20-5dcc-4442-9645-8195bdece63e}</Project>
+      <Name>Perspex.Diagnostics</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.HtmlRenderer\Perspex.HtmlRenderer.csproj">
+      <Project>{5fb2b005-0a7f-4dad-add4-3ed01444e63d}</Project>
+      <Name>Perspex.HtmlRenderer</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Input\Perspex.Input.csproj">
+      <Project>{62024b2d-53eb-4638-b26b-85eeaa54866e}</Project>
+      <Name>Perspex.Input</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Interactivity\Perspex.Interactivity.csproj">
+      <Project>{6b0ed19d-a08b-461c-a9d9-a9ee40b0c06b}</Project>
+      <Name>Perspex.Interactivity</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Layout\Perspex.Layout.csproj">
+      <Project>{42472427-4774-4c81-8aff-9f27b8e31721}</Project>
+      <Name>Perspex.Layout</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.ReactiveUI\Perspex.ReactiveUI.csproj">
+      <Project>{6417b24e-49c2-4985-8db2-3ab9d898ec91}</Project>
+      <Name>Perspex.ReactiveUI</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.SceneGraph\Perspex.SceneGraph.csproj">
+      <Project>{eb582467-6abb-43a1-b052-e981ba910e3a}</Project>
+      <Name>Perspex.SceneGraph</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Styling\Perspex.Styling.csproj">
+      <Project>{f1baa01a-f176-4c6a-b39d-5b40bb1b148f}</Project>
+      <Name>Perspex.Styling</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Perspex.Themes.Default\Perspex.Themes.Default.csproj">
+      <Project>{3e10a5fa-e8da-48b1-ad44-6a5b6cb7750f}</Project>
+      <Name>Perspex.Themes.Default</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Windows\Perspex.Direct2D1\Perspex.Direct2D1.csproj">
+      <Project>{3e908f67-5543-4879-a1dc-08eace79b3cd}</Project>
+      <Name>Perspex.Direct2D1</Name>
+    </ProjectReference>
+    <ProjectReference Include="..\..\src\Windows\Perspex.Win32\Perspex.Win32.csproj">
+      <Project>{811a76cf-1cf6-440f-963b-bbe31bd72a82}</Project>
+      <Name>Perspex.Win32</Name>
+    </ProjectReference>
+  </ItemGroup>
+  <ItemGroup>
+    <EmbeddedResource Include="Assets\hirsch-899118_640.jpg" />
+  </ItemGroup>
+  <ItemGroup>
+    <EmbeddedResource Include="Assets\delicate-arch-896885_640.jpg" />
+    <EmbeddedResource Include="Assets\maple-leaf-888807_640.jpg" />
+  </ItemGroup>
+  <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
+  <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
+       Other similar extension points exist, see Microsoft.Common.targets.
+  <Target Name="BeforeBuild">
+  </Target>
+  <Target Name="AfterBuild">
+  </Target>
+  -->
+</Project>

samples/ControlCatalog/MainWindow.paml

@@ -0,0 +1,13 @@
+<Window xmlns="https://github.com/perspex"
+        xmlns:pages="clr-namespace:ControlCatalog.Pages;assembly=ControlCatalog"
+        Title="Perspex Control Gallery">
+  <TabControl Classes="sidebar">
+    <TabControl.Transition>
+      <CrossFade Duration="0.25"/>
+    </TabControl.Transition>
+    <TabItem Header="Border"><pages:BorderPage/></TabItem>
+    <TabItem Header="Button"><pages:ButtonPage/></TabItem>
+    <TabItem Header="Canvas"><pages:CanvasPage/></TabItem>
+    <TabItem Header="Carousel"><pages:CarouselPage/></TabItem>
+  </TabControl>
+</Window>

samples/ControlCatalog/MainWindow.paml.cs

@@ -0,0 +1,19 @@
+using Perspex.Controls;
+using Perspex.Markup.Xaml;
+
+namespace ControlCatalog
+{
+    public class MainWindow : Window
+    {
+        public MainWindow()
+        {
+            this.InitializeComponent();
+            App.AttachDevTools(this);
+        }
+
+        private void InitializeComponent()
+        {
+            PerspexXamlLoader.Load(this);
+        }
+    }
+}

samples/ControlCatalog/Pages/BorderPage.paml

@@ -0,0 +1,29 @@
+<UserControl xmlns="https://github.com/perspex">
+  <StackPanel Orientation="Vertical" Gap="4">
+    <TextBlock Classes="h1">Border</TextBlock>
+    <TextBlock Classes="h2">A control which decorates a child with a border and background</TextBlock>
+
+    <StackPanel Orientation="Vertical"
+                Margin="0,16,0,0"
+                HorizontalAlignment="Center"
+                Gap="16">
+      <Border BorderBrush="#f44336" BorderThickness="2" Padding="16">
+        <TextBlock>Border</TextBlock>
+      </Border>
+      <Border Background="#f44336" BorderBrush="#4285f4" BorderThickness="4" Padding="16">
+        <TextBlock>Border and Background</TextBlock>
+      </Border>
+      <Border BorderBrush="#4285f4" 
+              BorderThickness="4" 
+              CornerRadius="8"
+              Padding="16">
+        <TextBlock>Rounded Corners</TextBlock>
+      </Border>
+      <Border Background="#f44336" 
+              CornerRadius="8"
+              Padding="16">
+        <TextBlock>Rounded Corners</TextBlock>
+      </Border>
+    </StackPanel>    
+  </StackPanel>
+</UserControl>

samples/ControlCatalog/Pages/BorderPage.paml.cs

@@ -0,0 +1,18 @@
+using Perspex.Controls;
+using Perspex.Markup.Xaml;
+
+namespace ControlCatalog.Pages
+{
+    public class BorderPage : UserControl
+    {
+        public BorderPage()
+        {
+            this.InitializeComponent();
+        }
+
+        private void InitializeComponent()
+        {
+            PerspexXamlLoader.Load(this);
+        }
+    }
+}

samples/ControlCatalog/Pages/ButtonPage.paml

@@ -0,0 +1,26 @@
+<UserControl xmlns="https://github.com/perspex">
+  <StackPanel Orientation="Vertical" Gap="4">
+    <TextBlock Classes="h1">Button</TextBlock>
+    <TextBlock Classes="h2">A button control</TextBlock>
+
+    <StackPanel Orientation="Horizontal"
+                Margin="0,16,0,0"
+                HorizontalAlignment="Center"
+                Gap="16">
+      <StackPanel Orientation="Vertical" Gap="8" Width="150">
+        <Button>Button</Button>
+        <Button Foreground="Blue">Foreground</Button>
+        <Button Background="#f44336">Background</Button>
+        <Button IsEnabled="False">Disabled</Button>
+      </StackPanel>
+
+      <StackPanel Orientation="Vertical" Gap="8" Width="150">
+        <Button BorderThickness="0">No Border</Button>
+        <Button BorderBrush="#f44336">Border Color</Button>
+        <Button BorderBrush="#f44336" BorderThickness="4">Thick Border</Button>
+        <Button BorderBrush="#f44336" BorderThickness="4" IsEnabled="False">Disabled</Button>
+      </StackPanel>
+    </StackPanel>
+    
+  </StackPanel>
+</UserControl>

samples/ControlCatalog/Pages/ButtonPage.paml.cs

@@ -0,0 +1,18 @@
+using Perspex.Controls;
+using Perspex.Markup.Xaml;
+
+namespace ControlCatalog.Pages
+{
+    public class ButtonPage : UserControl
+    {
+        public ButtonPage()
+        {
+            this.InitializeComponent();
+        }
+
+        private void InitializeComponent()
+        {
+            PerspexXamlLoader.Load(this);
+        }
+    }
+}

samples/ControlCatalog/Pages/CanvasPage.paml

@@ -0,0 +1,13 @@
+<UserControl xmlns="https://github.com/perspex">
+  <StackPanel Orientation="Vertical" Gap="4">
+    <TextBlock Classes="h1">Canvas</TextBlock>
+    <TextBlock Classes="h2">A panel which lays out its children by explicit coordinates</TextBlock>
+
+    <Canvas Background="Yellow" Width="300" Height="200">
+      <Rectangle Fill="Blue" Width="63" Height="41" Canvas.Left="40" Canvas.Top="31"/>
+      <Ellipse Fill="Green" Width="58" Height="58" Canvas.Left="160" Canvas.Top="79"/>
+      <Path Fill="Red" Data="M50,0 L0,50 100,50 Z" Canvas.Left="50" Canvas.Top="140"/>
+    </Canvas>
+    
+  </StackPanel>
+</UserControl>

samples/ControlCatalog/Pages/CanvasPage.paml.cs

@@ -0,0 +1,18 @@
+using Perspex.Controls;
+using Perspex.Markup.Xaml;
+
+namespace ControlCatalog.Pages
+{
+    public class CanvasPage : UserControl
+    {
+        public CanvasPage()
+        {
+            this.InitializeComponent();
+        }
+
+        private void InitializeComponent()
+        {
+            PerspexXamlLoader.Load(this);
+        }
+    }
+}

samples/ControlCatalog/Pages/CarouselPage.paml

@@ -0,0 +1,33 @@
+<UserControl xmlns="https://github.com/perspex">
+  <StackPanel Orientation="Vertical" Gap="4">
+    <TextBlock Classes="h1">Carousel</TextBlock>
+    <TextBlock Classes="h2">An items control that displays its items as pages that fill the control.</TextBlock>
+
+    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0 16 0 0" Gap="8">
+      <Button Name="left" VerticalAlignment="Center" Padding="20">
+        <Path Data="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z" Fill="Black"/>
+      </Button>
+      <Carousel Name="carousel">
+        <Carousel.Transition>
+          <PageSlide Duration="0.25"/>
+        </Carousel.Transition>
+        <Image Source="resource://application/ControlCatalog.Assets.delicate-arch-896885_640.jpg"/>
+        <Image Source="resource://application/ControlCatalog.Assets.hirsch-899118_640.jpg"/>
+        <Image Source="resource://application/ControlCatalog.Assets.maple-leaf-888807_640.jpg"/>
+      </Carousel>
+      <Button Name="right" VerticalAlignment="Center" Padding="20">
+        <Path Data="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z" Fill="Black"/>
+      </Button>
+    </StackPanel>
+
+    <StackPanel Orientation="Horizontal">
+      <TextBlock>Transition</TextBlock>
+      <DropDown SelectedIndex="0">
+        <ListBoxItem>None</ListBoxItem>
+        <ListBoxItem>Slide</ListBoxItem>
+        <ListBoxItem>Crossfade</ListBoxItem>
+      </DropDown>
+    </StackPanel>
+    
+  </StackPanel>
+</UserControl>

samples/ControlCatalog/Pages/CarouselPage.paml.cs

@@ -0,0 +1,22 @@
+using Perspex.Controls;
+using Perspex.Markup.Xaml;
+
+namespace ControlCatalog.Pages
+{
+    public class CarouselPage : UserControl
+    {
+        private Carousel carousel;
+        private Button left;
+        private Button right;
+
+        public CarouselPage()
+        {
+            this.InitializeComponent();
+        }
+
+        private void InitializeComponent()
+        {
+            PerspexXamlLoader.Load(this);
+        }
+    }
+}

samples/ControlCatalog/Properties/AssemblyInfo.cs

@@ -0,0 +1,36 @@
+using System.Reflection;
+using System.Runtime.CompilerServices;
+using System.Runtime.InteropServices;
+
+// General Information about an assembly is controlled through the following 
+// set of attributes. Change these attribute values to modify the information
+// associated with an assembly.
+[assembly: AssemblyTitle("ControlCatalog")]
+[assembly: AssemblyDescription("")]
+[assembly: AssemblyConfiguration("")]
+[assembly: AssemblyCompany("")]
+[assembly: AssemblyProduct("ControlCatalog")]
+[assembly: AssemblyCopyright("Copyright ©  2015")]
+[assembly: AssemblyTrademark("")]
+[assembly: AssemblyCulture("")]
+
+// Setting ComVisible to false makes the types in this assembly not visible 
+// to COM components.  If you need to access a type in this assembly from 
+// COM, set the ComVisible attribute to true on that type.
+[assembly: ComVisible(false)]
+
+// The following GUID is for the ID of the typelib if this project is exposed to COM
+[assembly: Guid("61bec86c-f307-4295-b5b8-9428610d7d55")]
+
+// Version information for an assembly consists of the following four values:
+//
+//      Major Version
+//      Minor Version 
+//      Build Number
+//      Revision
+//
+// You can specify all the values or you can default the Build and Revision Numbers 
+// by using the '*' as shown below:
+// [assembly: AssemblyVersion("1.0.*")]
+[assembly: AssemblyVersion("1.0.0.0")]
+[assembly: AssemblyFileVersion("1.0.0.0")]

samples/ControlCatalog/SideBar.paml

@@ -0,0 +1,39 @@
+<Styles xmlns="https://github.com/perspex">
+  <Style Selector="TabControl.sidebar">
+    <Setter Property="Template">
+      <ControlTemplate>
+        <Grid ColumnDefinitions="Auto,*">
+          <Border Width="190" Background="#1976D2">
+            <TabStrip Classes="sidebar"
+                      Items="{TemplateBinding Items}"
+                      SelectedIndex="{TemplateBinding Path=SelectedIndex, Mode=TwoWay}">
+              <TabStrip.ItemsPanel>
+                <ItemsPanelTemplate>
+                  <StackPanel Orientation="Vertical" Gap="4" Margin="0,10,0,0"/>
+                </ItemsPanelTemplate>
+              </TabStrip.ItemsPanel>
+            </TabStrip>
+          </Border>
+          <ScrollViewer Grid.Column="1">
+            <Carousel Items="{TemplateBinding Items}"
+                      MemberSelector="Content"
+                      SelectedIndex="{TemplateBinding Path=SelectedIndex}"
+                      Transition="{TemplateBinding Transition}"
+                      Margin="8,0,0,0"/>
+          </ScrollViewer>
+        </Grid>
+      </ControlTemplate>
+    </Setter>
+  </Style>
+
+  <Style Selector="TabStrip.sidebar TabItem">
+    <Setter Property="Foreground" Value="White"/>
+    <Setter Property="FontSize" Value="14"/>
+    <Setter Property="Margin" Value="0"/>
+    <Setter Property="Padding" Value="8"/>
+  </Style>
+
+  <Style Selector="TabStrip.sidebar TabItem:selected">
+    <Setter Property="Background" Value="#20ffffff"/>
+  </Style>
+</Styles>