Question

Is it possible in Silverlight 4 to create a border with rounded corners that clips any of it child UI Element? So far I have attempted to do so by setting a button as a child element of a border control but the buttons does not get clipped when I set the corner radius to create rounded corners in the border.

Was it helpful?

Solution

Take a look at the ClippingBehavior that is part of the Expression Blend Samples on CodePlex. It's a Blend behavior, so to add it you have to reference System.Windows.Interactivity.dll from the Blend SDK and drop the behavior on the element in Blend or add it in XAML:

<UserControl x:Class="MyApplication.MainPage"
    ...other xmlns imports...
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    xmlns:samples="clr-namespace:Expression.Samples.Interactivity;assembly=Expression.Samples.Interactivity"
    >

    <Border>
        <i:Interaction.Behaviors>
            <samples:ClippingBehavior CornerRadius="15"/>
        </i:Interaction.Behaviors>
        <!-- content to be clipped goes here -->
    </Border>
</UserControl>

This is a straightforward and reusable way to add rounded corners/clipping to any UI Element.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top