Problem using OpacityMask (XAML)
Can someone explain this WPF behaviour?
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<!-- Rounded mask -->
<Border Name="mask" VerticalAlignment="Top" Background="Black" CornerRadius="48" Height="400" Width="400" />
<StackPanel>
<!-- Use a VisualBrush of 'mask' as the opacity mask -->
<StackPanel.OpacityMask>
<VisualBrush Visual="{Binding ElementName=mask}" />
</StackPanel.OpacityMask>
<Grid>
<Border Background="Red" Height="400" Width="400"/>
<Border Background="Blue" Height="200" Width="400"/>
</Grid>
</StackPanel>
</Grid>
</Page>
As I would expect, the above code generates the following image (Kaxaml):
alt text http://robbertdam.nl/share/11.png
When I change the line
<Border Background="Blue" Height="200" Width="400"/>
in
<Border Background="Blue" Height="200" Width="600"/>
the开发者_运维知识库 image is as follow (didn't expect):
alt text http://robbertdam.nl/share/12.png
The corners are not rounded anymore! This question is actually a "scaled down" example of a problem I'm experiencing in my software, which uses similar masks.
How can I work around this?
Add Stretch="None"
to the visual brush.
VisualBrush can (and by default will) stretch the image of the visual it is displaying even if the size of the original visual is fixed.
精彩评论