Tabview switch to converter instead of template settings (#2827)

* Switch to converter * Remove negative margins from templatesettings * Fix formatting * Switch to improved existing converter * Remove old converter
microsoft · Jul 15, 2020 · 8aaf7f8 · 8aaf7f8
1 parent 24cec5c
commit 8aaf7f8
Show file tree

Hide file tree

Showing 11 changed files with 114 additions and 93 deletions.
diff --git a/dev/Common/CornerRadiusToThicknessConverter.cpp b/dev/Common/CornerRadiusToThicknessConverter.cpp
@@ -5,35 +5,85 @@
 #include <common.h>
 #include "CornerRadiusToThicknessConverter.h"
 
-winrt::Thickness CornerRadiusToThicknessConverter::Convert(winrt::CornerRadius const& radius, winrt::CornerRadiusToThicknessConverterKind const& filterKind)
+winrt::Thickness CornerRadiusToThicknessConverter::Convert(winrt::CornerRadius const& radius,
+    winrt::CornerRadiusToThicknessConverterKind const& filterKind,
+    double multiplier)
 {
     auto result = winrt::Thickness{};
 
     switch (filterKind)
     {
     case winrt::CornerRadiusToThicknessConverterKind::FilterLeftAndRightFromTop:
-        result.Left = radius.TopLeft;
-        result.Right = radius.TopRight;
+        result.Left = radius.TopLeft * multiplier;
+        result.Right = radius.TopRight * multiplier;
         result.Top = 0;
         result.Bottom = 0;
         break;
     case winrt::CornerRadiusToThicknessConverterKind::FilterLeftAndRightFromBottom:
-        result.Left = radius.BottomLeft;
-        result.Right = radius.BottomRight;
+        result.Left = radius.BottomLeft * multiplier;
+        result.Right = radius.BottomRight * multiplier;
         result.Top = 0;
         result.Bottom = 0;
         break;
     case winrt::CornerRadiusToThicknessConverterKind::FilterTopAndBottomFromLeft:
         result.Left = 0;
         result.Right = 0;
-        result.Top = radius.TopLeft;
-        result.Bottom = radius.BottomLeft;
+        result.Top = radius.TopLeft * multiplier;
+        result.Bottom = radius.BottomLeft * multiplier;
         break;
     case winrt::CornerRadiusToThicknessConverterKind::FilterTopAndBottomFromRight:
         result.Left = 0;
         result.Right = 0;
-        result.Top = radius.TopRight;
-        result.Bottom = radius.BottomRight;
+        result.Top = radius.TopRight * multiplier;
+        result.Bottom = radius.BottomRight * multiplier;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterTopFromTopLeft:
+        result.Left = 0;
+        result.Right = 0;
+        result.Top = radius.TopLeft * multiplier;
+        result.Bottom = 0;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterTopFromTopRight:
+        result.Left = 0;
+        result.Right = 0;
+        result.Top = radius.TopRight * multiplier;
+        result.Bottom = 0;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterRightFromTopRight:
+        result.Left = 0;
+        result.Right = radius.TopRight * multiplier;
+        result.Top = 0;
+        result.Bottom = 0;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterRightFromBottomRight:
+        result.Left = 0;
+        result.Right = radius.BottomRight * multiplier;
+        result.Top = 0;
+        result.Bottom = 0;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterBottomFromBottomRight:
+        result.Left = 0;
+        result.Right = 0;
+        result.Top = 0;
+        result.Bottom = radius.BottomRight * multiplier;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterBottomFromBottomLeft:
+        result.Left = 0;
+        result.Right = 0;
+        result.Top = 0;
+        result.Bottom = radius.BottomLeft * multiplier;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterLeftFromBottomLeft:
+        result.Left = radius.BottomLeft * multiplier;
+        result.Right = 0;
+        result.Top = 0;
+        result.Bottom = 0;
+        break;
+    case winrt::CornerRadiusToThicknessConverterKind::FilterLeftFromTopLeft:
+        result.Left = radius.TopLeft * multiplier;
+        result.Right = 0;
+        result.Top = 0;
+        result.Bottom = 0;
         break;
     }
 
@@ -47,8 +97,8 @@ winrt::IInspectable CornerRadiusToThicknessConverter::Convert(
     winrt::hstring const& language)
 {
     auto radius = unbox_value<winrt::CornerRadius>(value);
-
-    return box_value(Convert(radius, ConversionKind()));
+    const auto multiplier = Multiplier();
+    return box_value(Convert(radius, ConversionKind(),multiplier));
 }
 
 winrt::IInspectable CornerRadiusToThicknessConverter::ConvertBack(
@@ -58,4 +108,5 @@ winrt::IInspectable CornerRadiusToThicknessConverter::ConvertBack(
     winrt::hstring const& language)
 {
     winrt::throw_hresult(E_NOTIMPL);
+
 }
diff --git a/dev/Common/CornerRadiusToThicknessConverter.h b/dev/Common/CornerRadiusToThicknessConverter.h
@@ -10,9 +10,9 @@ class CornerRadiusToThicknessConverter :
     public CornerRadiusToThicknessConverterProperties
 {
 public:
-    winrt::Thickness Convert(
-        winrt::CornerRadius const& radius,
-        winrt::CornerRadiusToThicknessConverterKind const& filterKind);
+    winrt::Thickness Convert(winrt::CornerRadius const& radius,
+        winrt::CornerRadiusToThicknessConverterKind const& filterKind,
+        double multiplier);
 
     winrt::IInspectable Convert(
         winrt::IInspectable const& value,

diff --git a/dev/Common/CornerRadiusToThicknessConverter.idl b/dev/Common/CornerRadiusToThicknessConverter.idl
@@ -10,8 +10,11 @@ runtimeclass CornerRadiusToThicknessConverter : Windows.UI.Xaml.DependencyObject
 
     [MUX_DEFAULT_VALUE("winrt::CornerRadiusToThicknessConverterKind::FilterLeftAndRightFromTop")]
     CornerRadiusToThicknessConverterKind  ConversionKind{ get; set; };
+    [MUX_DEFAULT_VALUE("1.0f")]
+    Double Multiplier{ get; set; };
 
     static Windows.UI.Xaml.DependencyProperty ConversionKindProperty{ get; };
+    static Windows.UI.Xaml.DependencyProperty MultiplierProperty{ get; };
 };
 
 [WUXC_VERSION_MUXONLY]
@@ -22,6 +25,14 @@ enum CornerRadiusToThicknessConverterKind
     FilterTopAndBottomFromRight,
     FilterLeftAndRightFromTop,
     FilterLeftAndRightFromBottom,
+    FilterTopFromTopLeft,
+    FilterTopFromTopRight,
+    FilterRightFromTopRight,
+    FilterRightFromBottomRight,
+    FilterBottomFromBottomRight,
+    FilterBottomFromBottomLeft,
+    FilterLeftFromBottomLeft,
+    FilterLeftFromTopLeft,
 };
 
 }
diff --git a/dev/CommonStyles/CornerRadius_themeresources.xaml b/dev/CommonStyles/CornerRadius_themeresources.xaml
@@ -31,4 +31,7 @@
     <primitives:CornerRadiusToThicknessConverter x:Key="LeftThicknessFilterConverter" ConversionKind="FilterTopAndBottomFromLeft"/>
     <primitives:CornerRadiusToThicknessConverter x:Key="RightThicknessFilterConverter" ConversionKind="FilterTopAndBottomFromRight"/>
 
+    <primitives:CornerRadiusToThicknessConverter x:Key="TabViewLeftInsetCornerConverter" ConversionKind="FilterLeftFromBottomLeft" Multiplier="-1"/>
+    <primitives:CornerRadiusToThicknessConverter x:Key="TabViewRightInsetCornerConverter" ConversionKind="FilterRightFromBottomRight" Multiplier="-1"/>
+
 </ResourceDictionary>
diff --git a/dev/Generated/CornerRadiusToThicknessConverter.properties.cpp b/dev/Generated/CornerRadiusToThicknessConverter.properties.cpp
@@ -14,6 +14,7 @@ namespace winrt::Microsoft::UI::Xaml::Controls::Primitives
 #include "CornerRadiusToThicknessConverter.g.cpp"
 
 GlobalDependencyProperty CornerRadiusToThicknessConverterProperties::s_ConversionKindProperty{ nullptr };
+GlobalDependencyProperty CornerRadiusToThicknessConverterProperties::s_MultiplierProperty{ nullptr };
 
 CornerRadiusToThicknessConverterProperties::CornerRadiusToThicknessConverterProperties()
 {
@@ -33,11 +34,23 @@ void CornerRadiusToThicknessConverterProperties::EnsureProperties()
                 ValueHelper<winrt::CornerRadiusToThicknessConverterKind>::BoxValueIfNecessary(winrt::CornerRadiusToThicknessConverterKind::FilterLeftAndRightFromTop),
                 nullptr);
     }
+    if (!s_MultiplierProperty)
+    {
+        s_MultiplierProperty =
+            InitializeDependencyProperty(
+                L"Multiplier",
+                winrt::name_of<double>(),
+                winrt::name_of<winrt::CornerRadiusToThicknessConverter>(),
+                false /* isAttached */,
+                ValueHelper<double>::BoxValueIfNecessary(1.0f),
+                nullptr);
+    }
 }
 
 void CornerRadiusToThicknessConverterProperties::ClearProperties()
 {
     s_ConversionKindProperty = nullptr;
+    s_MultiplierProperty = nullptr;
 }
 
 void CornerRadiusToThicknessConverterProperties::ConversionKind(winrt::CornerRadiusToThicknessConverterKind const& value)
@@ -52,3 +65,16 @@ winrt::CornerRadiusToThicknessConverterKind CornerRadiusToThicknessConverterProp
 {
     return ValueHelper<winrt::CornerRadiusToThicknessConverterKind>::CastOrUnbox(static_cast<CornerRadiusToThicknessConverter*>(this)->GetValue(s_ConversionKindProperty));
 }
+
+void CornerRadiusToThicknessConverterProperties::Multiplier(double value)
+{
+    [[gsl::suppress(con)]]
+    {
+    static_cast<CornerRadiusToThicknessConverter*>(this)->SetValue(s_MultiplierProperty, ValueHelper<double>::BoxValueIfNecessary(value));
+    }
+}
+
+double CornerRadiusToThicknessConverterProperties::Multiplier()
+{
+    return ValueHelper<double>::CastOrUnbox(static_cast<CornerRadiusToThicknessConverter*>(this)->GetValue(s_MultiplierProperty));
+}
diff --git a/dev/Generated/CornerRadiusToThicknessConverter.properties.h b/dev/Generated/CornerRadiusToThicknessConverter.properties.h
@@ -12,9 +12,14 @@ class CornerRadiusToThicknessConverterProperties
     void ConversionKind(winrt::CornerRadiusToThicknessConverterKind const& value);
     winrt::CornerRadiusToThicknessConverterKind ConversionKind();
 
+    void Multiplier(double value);
+    double Multiplier();
+
     static winrt::DependencyProperty ConversionKindProperty() { return s_ConversionKindProperty; }
+    static winrt::DependencyProperty MultiplierProperty() { return s_MultiplierProperty; }
 
     static GlobalDependencyProperty s_ConversionKindProperty;
+    static GlobalDependencyProperty s_MultiplierProperty;
 
     static void EnsureProperties();
     static void ClearProperties();

diff --git a/dev/Generated/TabViewItemTemplateSettings.properties.cpp b/dev/Generated/TabViewItemTemplateSettings.properties.cpp
@@ -14,8 +14,6 @@ namespace winrt::Microsoft::UI::Xaml::Controls
 #include "TabViewItemTemplateSettings.g.cpp"
 
 GlobalDependencyProperty TabViewItemTemplateSettingsProperties::s_IconElementProperty{ nullptr };
-GlobalDependencyProperty TabViewItemTemplateSettingsProperties::s_LeftInsetRadiusMarginProperty{ nullptr };
-GlobalDependencyProperty TabViewItemTemplateSettingsProperties::s_RightInsetRadiusMarginProperty{ nullptr };
 
 TabViewItemTemplateSettingsProperties::TabViewItemTemplateSettingsProperties()
 {
@@ -35,35 +33,11 @@ void TabViewItemTemplateSettingsProperties::EnsureProperties()
                 ValueHelper<winrt::IconElement>::BoxedDefaultValue(),
                 nullptr);
     }
-    if (!s_LeftInsetRadiusMarginProperty)
-    {
-        s_LeftInsetRadiusMarginProperty =
-            InitializeDependencyProperty(
-                L"LeftInsetRadiusMargin",
-                winrt::name_of<winrt::Thickness>(),
-                winrt::name_of<winrt::TabViewItemTemplateSettings>(),
-                false /* isAttached */,
-                ValueHelper<winrt::Thickness>::BoxedDefaultValue(),
-                nullptr);
-    }
-    if (!s_RightInsetRadiusMarginProperty)
-    {
-        s_RightInsetRadiusMarginProperty =
-            InitializeDependencyProperty(
-                L"RightInsetRadiusMargin",
-                winrt::name_of<winrt::Thickness>(),
-                winrt::name_of<winrt::TabViewItemTemplateSettings>(),
-                false /* isAttached */,
-                ValueHelper<winrt::Thickness>::BoxedDefaultValue(),
-                nullptr);
-    }
 }
 
 void TabViewItemTemplateSettingsProperties::ClearProperties()
 {
     s_IconElementProperty = nullptr;
-    s_LeftInsetRadiusMarginProperty = nullptr;
-    s_RightInsetRadiusMarginProperty = nullptr;
 }
 
 void TabViewItemTemplateSettingsProperties::IconElement(winrt::IconElement const& value)
@@ -78,29 +52,3 @@ winrt::IconElement TabViewItemTemplateSettingsProperties::IconElement()
 {
     return ValueHelper<winrt::IconElement>::CastOrUnbox(static_cast<TabViewItemTemplateSettings*>(this)->GetValue(s_IconElementProperty));
 }
-
-void TabViewItemTemplateSettingsProperties::LeftInsetRadiusMargin(winrt::Thickness const& value)
-{
-    [[gsl::suppress(con)]]
-    {
-    static_cast<TabViewItemTemplateSettings*>(this)->SetValue(s_LeftInsetRadiusMarginProperty, ValueHelper<winrt::Thickness>::BoxValueIfNecessary(value));
-    }
-}
-
-winrt::Thickness TabViewItemTemplateSettingsProperties::LeftInsetRadiusMargin()
-{
-    return ValueHelper<winrt::Thickness>::CastOrUnbox(static_cast<TabViewItemTemplateSettings*>(this)->GetValue(s_LeftInsetRadiusMarginProperty));
-}
-
-void TabViewItemTemplateSettingsProperties::RightInsetRadiusMargin(winrt::Thickness const& value)
-{
-    [[gsl::suppress(con)]]
-    {
-    static_cast<TabViewItemTemplateSettings*>(this)->SetValue(s_RightInsetRadiusMarginProperty, ValueHelper<winrt::Thickness>::BoxValueIfNecessary(value));
-    }
-}
-
-winrt::Thickness TabViewItemTemplateSettingsProperties::RightInsetRadiusMargin()
-{
-    return ValueHelper<winrt::Thickness>::CastOrUnbox(static_cast<TabViewItemTemplateSettings*>(this)->GetValue(s_RightInsetRadiusMarginProperty));
-}
diff --git a/dev/Generated/TabViewItemTemplateSettings.properties.h b/dev/Generated/TabViewItemTemplateSettings.properties.h
@@ -12,19 +12,9 @@ class TabViewItemTemplateSettingsProperties
     void IconElement(winrt::IconElement const& value);
     winrt::IconElement IconElement();
 
-    void LeftInsetRadiusMargin(winrt::Thickness const& value);
-    winrt::Thickness LeftInsetRadiusMargin();
-
-    void RightInsetRadiusMargin(winrt::Thickness const& value);
-    winrt::Thickness RightInsetRadiusMargin();
-
     static winrt::DependencyProperty IconElementProperty() { return s_IconElementProperty; }
-    static winrt::DependencyProperty LeftInsetRadiusMarginProperty() { return s_LeftInsetRadiusMarginProperty; }
-    static winrt::DependencyProperty RightInsetRadiusMarginProperty() { return s_RightInsetRadiusMarginProperty; }
 
     static GlobalDependencyProperty s_IconElementProperty;
-    static GlobalDependencyProperty s_LeftInsetRadiusMarginProperty;
-    static GlobalDependencyProperty s_RightInsetRadiusMarginProperty;
 
     static void EnsureProperties();
     static void ClearProperties();

diff --git a/dev/TabView/TabView.idl b/dev/TabView/TabView.idl
@@ -177,19 +177,8 @@ unsealed runtimeclass TabViewItemTemplateSettings : Windows.UI.Xaml.DependencyOb
     TabViewItemTemplateSettings();
 
     Windows.UI.Xaml.Controls.IconElement IconElement;
-    [WUXC_VERSION_PREVIEW]
-    {
-        Windows.UI.Xaml.Thickness LeftInsetRadiusMargin;
-        Windows.UI.Xaml.Thickness RightInsetRadiusMargin;
-    }
 
     static Windows.UI.Xaml.DependencyProperty IconElementProperty{ get; };
-
-    [WUXC_VERSION_PREVIEW]
-    {
-        static Windows.UI.Xaml.DependencyProperty LeftInsetRadiusMarginProperty{ get; };
-        static Windows.UI.Xaml.DependencyProperty RightInsetRadiusMarginProperty{ get; };
-    }
 }
 
 }

diff --git a/dev/TabView/TabView.xaml b/dev/TabView/TabView.xaml
@@ -625,7 +625,8 @@
                             Visibility="Collapsed"
                             VerticalAlignment="Bottom"
                             Height="{Binding Source={ThemeResource OverlayCornerRadius}, Path=BottomLeft}"
-                            Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TabViewTemplateSettings.LeftInsetRadiusMargin}"
+                            Margin="{Binding Source={ThemeResource OverlayCornerRadius},
+                                Converter={StaticResource TabViewLeftInsetCornerConverter}}"
                             Stretch="Uniform"
                             Fill="{ThemeResource TabViewItemHeaderBackgroundSelected}"
                             Data="M4 0 L4 4 L0 4 A4,4 90 0 0 4 0 Z" /> 
@@ -636,7 +637,8 @@
                             Visibility="Collapsed"
                             VerticalAlignment="Bottom"
                             Height="{Binding Source={ThemeResource OverlayCornerRadius}, Path=BottomRight}"
-                            Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TabViewTemplateSettings.RightInsetRadiusMargin}"
+                            Margin="{Binding Source={ThemeResource OverlayCornerRadius},
+                                Converter={StaticResource TabViewRightInsetCornerConverter}}"
                             Stretch="Uniform"
                             Fill="{ThemeResource TabViewItemHeaderBackgroundSelected}"
                             Data="M0 0 L0 4 L4 4 A4 4 90 0 1 0 0 Z" />

diff --git a/dev/TabView/TabViewItem.cpp b/dev/TabView/TabViewItem.cpp
@@ -24,12 +24,8 @@ TabViewItem::TabViewItem()
 
 void TabViewItem::OnApplyTemplate()
 {
-    auto const templateSettings = winrt::get_self<TabViewItemTemplateSettings>(TabViewTemplateSettings());
     auto popupRadius = unbox_value<winrt::CornerRadius>(ResourceAccessor::ResourceLookup(*this, box_value(c_overlayCornerRadiusKey)));
 
-    templateSettings->LeftInsetRadiusMargin(winrt::Thickness({ -popupRadius.BottomLeft,0,0,0 }));
-    templateSettings->RightInsetRadiusMargin(winrt::Thickness({0,0,-popupRadius.BottomRight,0}));
-
     winrt::IControlProtected controlProtected{ *this };
 
     auto tabView = SharedHelpers::GetAncestorOfType<winrt::TabView>(winrt::VisualTreeHelper::GetParent(*this));