How to Clip content with rounded corners in Windows Store App

Question

I've attempted to have a <Grid/> (with interactive stuff inside, not just an image) clipped with rounded corners (a <Border/> or a <Rectangle/>, whatever works).

I've attempted multiple solutions, but none of them was compatible with a Windows Store App.

No brush:

• RadialGradientBrush is not supported in a Windows App project.
• DrawingBrush is not supported in a Windows App project.
• The type 'VisualBrush' was not found. Verify that you are not missing an assembly reference and that all referenced assemblies have been built.

No mask:

• The attachable property 'OpacityMask' was not found in type 'Image'.
• The attachable property 'OpacityMask' was not found in type 'StackPanel'.
• The attachable property 'OpacityMask' was not found in type 'Grid'.

No rounded geometry:

• The property 'RadiusX' was not found in type 'RectangleGeometry'.
• MultiBinding is not supported in a Windows App project.

Is it something technically impossible in a C#/XAML Windows store app?

Answer 1

Have you tried putting your control inside a border? Just set the border's corner radius to 150 and you have a perfectly round control. Here's an example with a button.

    <Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Center"  Height="200" Margin="0,0,0,0" VerticalAlignment="center" Width="200" CornerRadius="150">

        <Button x:Name="btnPlayback" Content="Play" HorizontalAlignment="Center" Height="200" Margin="0,0,0,0" VerticalAlignment="center" Width=" 200" BorderThickness="0"  Click="btnPlayback_Click_1"/>

    </Border>