WPF几何(路径)部分填充形状

时间:2010-02-03 08:01:55

标签: wpf path geometry

这个想法是获得评级控制,它可以具有0.3的值,并将其绘制为部分填充的形状 我使用的方法在CodeProject文章中描述。有Path,添加遮罩(矩形),添加轮廓 原始代码使用Margin作为掩码和固定宽度路径 问题是使用矩形作为蒙版重新绘制背景,这是渐变,所以我不能为蒙版设置相同的背景值。 我改变颜色只是为了让它更清晰。

是否可以模拟部分填充的路径?

<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">

    <Grid x:Name="gdStar" Width="Auto" Height="Auto">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.5*"/>
            <ColumnDefinition Width="0.5*"/>
        </Grid.ColumnDefinitions>

        <Path 
            Grid.ColumnSpan="2"
        Fill="Red" Stretch="Fill" Stroke="Blue" StrokeThickness="1"  Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z"/>

        <Rectangle Grid.Column="1"
        Fill="Yellow"/>

        <Path 
            Grid.ColumnSpan="2"
            Fill="Transparent" Stretch="Fill" Stroke="Red" StrokeThickness="1" Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z"/>

    </Grid>


</Page>

修改
这可能是错误的做法。还能用什么呢? OpacityBrush /剪辑

1 个答案:

答案 0 :(得分:1)

你在寻找这样的东西:

<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">   
    <Grid x:Name="gdStar" Width="Auto" Height="Auto">
        <Path 
        Fill="Red" Stretch="Fill" Stroke="Blue" StrokeThickness="1"  Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z">
            <Path.OpacityMask>
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                    <GradientStop Color="Transparent" Offset="0.3"/>
                    <GradientStop Color="White" Offset="0.3"/>
                </LinearGradientBrush>
            </Path.OpacityMask>
        </Path>
        <Path 
            Fill="Transparent" Stretch="Fill" Stroke="Red" StrokeThickness="1" Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z"/> 
    </Grid>
</Page>

编辑这是一个版本,通过在其后面添加一个白色星星来更改非填充区域的背景,我已经离开了前一个示例,因为它更清晰了。

<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" Background="yellow">   
    <Grid x:Name="gdStar" Width="Auto" Height="Auto">
        <Path 
        Fill="White" Stretch="Fill" Stroke="Blue" StrokeThickness="1"  Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z"/>
        <Path 
        Fill="Red" Stretch="Fill" Stroke="Blue" StrokeThickness="1"  Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z">
            <Path.OpacityMask>
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                    <GradientStop Color="Transparent" Offset="0.3"/>
                    <GradientStop Color="White" Offset="0.3"/>
                </LinearGradientBrush>
            </Path.OpacityMask>
        </Path>
        <Path 
            Fill="Transparent" Stretch="Fill" Stroke="Red" StrokeThickness="1" Margin="-0.5,-0.5,-0.5,-0.019" Data="M63.50031,-0.50054431 L47.500523,55.499079 -0.49883747,55.499079 39.50063,95.498578 23.500843,159.49799 63.833676,128.4989 103.7623,160.51698 87.095797,95.850405 127.49946,55.499079 79.500097,55.499079 z"/> 
    </Grid>
</Page>