Fix Contextual Tab Sample Page

Author: michael-hawker

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/TabbedCommandBar/TabbedCommandBar.bind

@@ -3,7 +3,11 @@
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
+      xmlns:converters="using:Microsoft.Toolkit.Uwp.UI.Converters"
       mc:Ignorable="d">
+    <Page.Resources>
+      <converters:VisibilityToBoolConverter x:Key="VisBoolConverter"/>
+    </Page.Resources>
     <Grid>
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto"/>
@@ -86,8 +90,10 @@
                         <AppBarButton Icon="Add" Label="New item" />
                     </controls:TabbedCommandBarItem.SecondaryCommands>
                 </controls:TabbedCommandBarItem>
-                <controls:TabbedCommandBarItem Header="Picture Format" IsContextual="True"
-                                               Visibility="{Binding ElementName=ContextualToggle, Path=IsOn}">
+                <controls:TabbedCommandBarItem x:Name="PictureFormat"
+                                               Header="Picture Format"
+                                               IsContextual="True"
+                                               Visibility="Collapsed">
                     <AppBarButton Label="Remove Background">
                         <AppBarButton.Icon>
                             <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}" Glyph="&#xE706;" />
@@ -134,7 +140,7 @@
         </controls:TabbedCommandBar>
 
         <Grid Grid.Row="1">
-            <ToggleSwitch x:Name="ContextualToggle" IsOn="{Binding Visibility, ElementName=ShapeFormat, Mode=TwoWay}"
+            <ToggleSwitch x:Name="ContextualToggle" IsOn="{Binding Visibility, ElementName=PictureFormat, Converter={StaticResource VisBoolConverter}, Mode=TwoWay}"
                           OffContent="Contextual Tab Off" OnContent="Contextual Tab On"/>
         </Grid>
     </Grid>

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/XamlOnlyPage.xaml

@@ -3,6 +3,7 @@
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:ani="using:Microsoft.Toolkit.Uwp.UI.Animations"
       xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Behaviors"
+      xmlns:converters="using:Microsoft.Toolkit.Uwp.UI.Converters"
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:interactions="using:Microsoft.Xaml.Interactions.Core"
       xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
@@ -17,6 +18,8 @@
     <!--  Put a copy of any controls/resources required for XAML Parsing within XAML Only Samples  -->
     <!--  This page is never loaded by the app, but used to trick the compiler...  -->
     <Page.Resources>
+        <converters:VisibilityToBoolConverter x:Key="VisibilityBoolConverter" />
+        <converters:BoolToVisibilityConverter x:Key="BoolVisibilityConverter" />
         <triggers:CompareStateTrigger x:Key="CompareStateTrigger" />
         <triggers:IsEqualStateTrigger x:Key="IsEqualStateTrigger" />
         <triggers:IsNotEqualStateTrigger x:Key="IsNotEqualStateTrigger" />
@@ -34,17 +37,17 @@
                 <ani:OpacityAnimation />
                 <ani:StartAnimationActivity />
                 <ani:InvokeActionsActivity />
-                <ani:ClipAnimation/>
-                <ani:BlurEffectAnimation/>
-                <ani:SaturationEffectAnimation/>
-                <ani:AnimationScope/>
-                <ani:ExposureEffectAnimation/>
+                <ani:ClipAnimation />
+                <ani:BlurEffectAnimation />
+                <ani:SaturationEffectAnimation />
+                <ani:AnimationScope />
+                <ani:ExposureEffectAnimation />
             </ani:AnimationSet>
         </ani:Explicit.Animations>
         <media:UIElementExtensions.VisualFactory>
             <media:PipelineVisualFactory>
                 <media:OpacityEffect />
-                <media:ExposureEffect/>
+                <media:ExposureEffect />
             </media:PipelineVisualFactory>
         </media:UIElementExtensions.VisualFactory>