WPF 剪辑矩形

Posted 2023-02-25

【中文标题】WPF 剪辑矩形

【英文标题】：WPF Clip Rectangle

【发布时间】：2011-07-28 15:09:15

【问题描述】：

我有一个 45x45 的 UserControl（硬编码大小 - 它是项目网格的一部分）。当某个属性具有值时，我想在右上角显示一个“剪辑”来指示这一点。可见性本身很容易实现，但是我的 Rectangle 超出了控件的范围并与其他控件重叠。我尝试使用“ClipToBounds”属性，但它没有做任何事情。当我将其添加到整体控件时，剪辑工作完美，但我在主矩形（填充单元格）上的悬停效果停止工作。

有什么想法吗？我相信这很容易做到，但对于 WPF 来说仍然很新（并且在几何方面很糟糕 - 因此不使用多边形）我有点迷路了。

这是完整的标记：

<Grid>        
    <Rectangle x:Name="MainRectangle" Fill="Binding Background" Opacity="0" MouseEnter="MainRectangle_MouseEnter" MouseLeave="MainRectangle_MouseLeave">
        <Rectangle.Triggers>
            <EventTrigger RoutedEvent="Rectangle.MouseEnter">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0.0" To="0.8" Duration="0:0:0.33" AutoReverse="False" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="Rectangle.MouseLeave">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0.8" To="0.0" Duration="0:0:0.33" AutoReverse="False" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Rectangle.Triggers>
    </Rectangle>
    <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="Binding VisualCount" />
    <Rectangle Fill="Black" HorizontalAlignment="Right" Height="20" Margin="0,-14,-20,0" Stroke="Black" VerticalAlignment="Top" Width="20" Visibility="Binding HasNotes">
        <Rectangle.RenderTransform>
            <RotateTransform CenterX="0" CenterY="0" Angle="45" />
        </Rectangle.RenderTransform>
    </Rectangle>
</Grid>

【参考方案1】：

这是一个简单的路径：

<Path Fill="Black" HorizontalAlignment="Right" Visibility="Binding HasNotes">
    <Path.Data>
        <PathGeometry>
            <PathFigure StartPoint="0,0">
                <LineSegment Point="14,0"/>
                <LineSegment Point="14,14"/>
            </PathFigure>
        </PathGeometry>
    </Path.Data>
</Path>

【讨论】：

完美。我怀疑我是否会自己解决这个问题。谢谢！

没那么难，一定要试试！