How to make the contents of a round-cornered border be also round-cornered?

Question

I have a border element with rounded corners containing a 3x3 grid. The corners of the grid are sticking out of the border. How can I fix that? I tried using ClipToBounds bu

Answer 1

I don't like to use a custom control. Created a behavior instead.

using System.Linq;
using System.Windows;
using System.Windows.Interactivity;

/// 

/// Base class for behaviors that could be used in style.
/// 
/// Component type.
/// Behavior type.
public class AttachableForStyleBehavior : Behavior
        where TComponent : System.Windows.DependencyObject
        where TBehavior : AttachableForStyleBehavior, new()
{
#pragma warning disable SA1401 // Field must be private.

    /// 

    /// IsEnabledForStyle attached property.
    /// 
    public static DependencyProperty IsEnabledForStyleProperty =
        DependencyProperty.RegisterAttached("IsEnabledForStyle", typeof(bool),
        typeof(AttachableForStyleBehavior), new FrameworkPropertyMetadata(false, OnIsEnabledForStyleChanged));

#pragma warning restore SA1401

    /// 

    /// Sets IsEnabledForStyle value for element.
    /// 
    public static void SetIsEnabledForStyle(UIElement element, bool value)
    {
        element.SetValue(IsEnabledForStyleProperty, value);
    }

    /// 

    /// Gets IsEnabledForStyle value for element.
    /// 
    public static bool GetIsEnabledForStyle(UIElement element)
    {
        return (bool)element.GetValue(IsEnabledForStyleProperty);
    }

    private static void OnIsEnabledForStyleChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        UIElement uie = d as UIElement;

        if (uie != null)
        {
            var behColl = Interaction.GetBehaviors(uie);
            var existingBehavior = behColl.FirstOrDefault(b => b.GetType() ==
                  typeof(TBehavior)) as TBehavior;

            if ((bool)e.NewValue == false && existingBehavior != null)
            {
                behColl.Remove(existingBehavior);
            }
            else if ((bool)e.NewValue == true && existingBehavior == null)
            {
                behColl.Add(new TBehavior());
            }
        }
    }
}

---

using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media;

/// 

/// Behavior that creates opacity mask brush.
/// 
internal class OpacityMaskBehavior : AttachableForStyleBehavior
{
    protected override void OnAttached()
    {
        base.OnAttached();

        var border = new Border()
        {
            Background = Brushes.Black,
            SnapsToDevicePixels = true,
        };

        border.SetBinding(Border.CornerRadiusProperty, new Binding()
        {
            Mode = BindingMode.OneWay,
            Path = new PropertyPath("CornerRadius"),
            Source = AssociatedObject
        });

        border.SetBinding(FrameworkElement.HeightProperty, new Binding()
        {
            Mode = BindingMode.OneWay,
            Path = new PropertyPath("ActualHeight"),
            Source = AssociatedObject
        });

        border.SetBinding(FrameworkElement.WidthProperty, new Binding()
        {
            Mode = BindingMode.OneWay,
            Path = new PropertyPath("ActualWidth"),
            Source = AssociatedObject
        });

        AssociatedObject.OpacityMask = new VisualBrush(border);
    }

    protected override void OnDetaching()
    {
        base.OnDetaching();

        AssociatedObject.OpacityMask = null;
    }
}

---