2013-02-12 99 views
2

下面这段代码应该在圆形容器内绘制一个菜单栏。你会注意到底部是圆形的,但是菜单的边角不是。我跟着选择答案的方向,因为它似乎是最有效的:如何创建一个剪辑儿童的WPF舍入容器?

How do I create a WPF Rounded Corner container?

为了记录在案,我运行.NET 4.5与WPF的最新版本。这里是我的代码:

<Window 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="240" Height="320" Background="Black" > 
     <Border BorderBrush="Red" CornerRadius="10" BorderThickness="1" Background="Gray" > 
     <StackPanel> 
      <Menu IsMainMenu="True" HorizontalAlignment="Stretch" > 
         <MenuItem Header="_File" /> 
         <MenuItem Header="_Edit" /> 
         <MenuItem Header="_View" /> 
         <MenuItem Header="_Window" /> 
         <MenuItem Header="_Help" /> 
        </Menu> 

     </StackPanel> 
     </Border> 
</Window> 

编辑: 有一个在同一职位建议由克里斯·卡瓦纳提出了一个更复杂的解决方案的另一个答案。他的解决方案不是那么简单或者很快,但是它确实夹住了我想要的角落。这个问题没有说明剪裁,并且建议的答案也没有。希望问题和/或答案将被更新以反映这一点。

回答

2

Chris Cavanagh有一个关于舍入控制的blog post。它应该可以帮助你实现你想要的。

编辑: 下面是该博客的代码。

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Background="Black"> 
    <!-- Rounded yellow border --> 
    <Border BorderThickness="3" BorderBrush="Yellow" CornerRadius="10" Padding="2" HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <Grid> 
      <!-- Rounded mask (stretches to fill Grid) --> 
      <Border Name="mask" Background="White" CornerRadius="7"/> 
      <!-- Main content container --> 
      <StackPanel> 
       <!-- Use a VisualBrush of 'mask' as the opacity mask --> 
       <StackPanel.OpacityMask> 
        <VisualBrush Visual="{Binding ElementName=mask}"/> 
       </StackPanel.OpacityMask> 
       <!-- Any content --> 
       <Image Source="https://chriscavanagh.files.wordpress.com/2006/12/chriss-blog-banner.jpg"/> 
       <Rectangle Height="50" Fill="Red"/> 
       <Rectangle Height="50" Fill="White"/> 
       <Rectangle Height="50" Fill="Blue"/> 
      </StackPanel> 
     </Grid> 
    </Border> 
</Page> 

它所做的是包括“面具” Border元素,你要裁剪的内容的兄弟姐妹。在内容中,它使用绑定到该掩码的VisualBrush。面具会根据您的内容自动调整大小,所以这是一个不错的“一劳永逸”解决方案