Question

我尝试在c＃-WPF项目中使用矢量图形。

我的问题是：

我的图形（由插图画家创建并导出到XAML）比我的窗口大小更大，因此我的矢量图形仍然可以在窗口框架外看到（在边框咏叹调中）。

如何在容器中限制它？

这是我服装橱窗中图形的一个简单示例：

<Window x:Class="WpfApplication3.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="319" 
    WindowStartupLocation="CenterScreen"  
    ResizeMode="NoResize"
    AllowsTransparency="true" Background ="Transparent"
    Topmost="True"
    WindowStyle="None"  ShowInTaskbar="False" Height="453.487"  >
    <Window.Resources>
    </Window.Resources>
    <Border Margin="10" BorderBrush="#dcdfe1" BorderThickness="1" x:Name="border" Background="white">
        <Border.Effect >
            <DropShadowEffect x:Name="DropShadowEffect" BlurRadius="10" Color="Black" RenderingBias="Quality"  ShadowDepth="0"  Opacity="0.6"/>
        </Border.Effect>
        <Grid >
            <Grid.RowDefinitions >
                <RowDefinition Height="auto"/>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>





            <Grid.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="White" Offset="0.44"/>
                <GradientStop Color="Orange" Offset="1"/>

            </LinearGradientBrush>
        </Grid.Background>
        <Path Grid.RowSpan="4" Data="M20,202 C20,202 583,167 607,197" Margin="10,46.447,0,-218" Stretch="Fill" Grid.Row="1">
            <Path.Fill>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="White" Offset="0"/>
                    <GradientStop Offset="1"/>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>





            <Grid Grid.ColumnSpan="2" Height="30" Background="#dcdfe1"  Name="titleBar"  >
                <Grid.ColumnDefinitions >
                    <ColumnDefinition  Width="*"/>
                    <ColumnDefinition  Width="auto"/>
                </Grid.ColumnDefinitions>
           </Grid>



            <StackPanel Grid.Row="2"  Orientation="Vertical" FlowDirection="LeftToRight"/>
        <Grid Grid.Row="5">
                <Grid.ColumnDefinitions >
                    <ColumnDefinition />
                    <ColumnDefinition Width=" auto" />
                    <ColumnDefinition Width=" auto"/>
                </Grid.ColumnDefinitions>
                <Button Width="60"  Grid.Column="2" Content="close" Margin="5"   Name="btn_ok" Click="btn_ok_Click" />
            </Grid>
        </Grid>
    </Border>
</Window>

感谢您的帮助。

Answer 1

您的直接问题是由您应用于边框的位图效果造成的你不应该把边框放在这样的东西周围，因为里面的一切都应用了位图效果移动边框：

<Grid >
        <Grid.RowDefinitions >
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
    <Border Grid.RowSpan="5" Margin="10" BorderBrush="#dcdfe1" BorderThickness="1" x:Name="border" Background="white">
        <Border.Effect >
            <DropShadowEffect x:Name="DropShadowEffect" BlurRadius="10" Color="Black" RenderingBias="Quality"  ShadowDepth="0"  Opacity="0.6"/>
        </Border.Effect>
    </Border>

这也可以让网格剪辑我一点也不清楚你的意图是什么，也许网格应该有一定的余地。

Answer 2

这是由你所有方向的边界值10引起的：

<Border Margin="10" BorderBrush="#dcdfe1" BorderThickness="1" x:Name="border" Background="white">

我认为您需要使用它来移除窗口底部的矢量图形溢出：

<Border Margin="10,10,10,0" BorderBrush="#dcdfe1" BorderThickness="1" x:Name="border" Background="white">

Answer 3

谢谢Andrii Nikolaienko。我将ClipToBounds =“True”设置为完美无缺。

<Grid ClipToBounds="True">

感谢andy的建议。我编辑我的xaml文件就好了吗？

   <Window x:Class="WpfApplication3.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="319" 
    WindowStartupLocation="CenterScreen"  
    ResizeMode="NoResize"
    AllowsTransparency="true" Background ="Transparent"
    Topmost="True"
    WindowStyle="None"  ShowInTaskbar="False" Height="453.487"  >
    <Window.Resources>
    </Window.Resources>
    <Grid Margin="10"  >
        <Grid.Effect >
            <DropShadowEffect x:Name="DropShadowEffect" BlurRadius="10" Color="Black" RenderingBias="Quality"  ShadowDepth="0"  Opacity="0.6"/>
        </Grid.Effect>
        <Border Margin="10" BorderBrush="#dcdfe1" BorderThickness="1" x:Name="border" Background="Red" ></Border>
        <Grid ClipToBounds="True">
            <Grid.RowDefinitions >
                <RowDefinition Height="auto"/>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>

            <Grid.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="White" Offset="0.44"/>
                    <GradientStop Color="Orange" Offset="1"/>

                </LinearGradientBrush>
            </Grid.Background>
            <Path Grid.RowSpan="4" Data="M20,202 C20,202 583,167 607,197" Margin="10,46.447,0,-218" Stretch="Fill" Grid.Row="1">
                <Path.Fill>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="White" Offset="0"/>
                        <GradientStop Offset="1"/>
                    </LinearGradientBrush>
                </Path.Fill>
            </Path>

            <Grid Grid.ColumnSpan="2" Height="30" Background="#dcdfe1"  Name="titleBar"  >
                <Grid.ColumnDefinitions >
                    <ColumnDefinition  Width="*"/>
                    <ColumnDefinition  Width="auto"/>
                </Grid.ColumnDefinitions>
            </Grid>



            <StackPanel Grid.Row="2"  Orientation="Vertical" FlowDirection="LeftToRight"/>
            <Grid Grid.Row="5">
                <Grid.ColumnDefinitions >
                    <ColumnDefinition />
                    <ColumnDefinition Width=" auto" />
                    <ColumnDefinition Width=" auto"/>
                </Grid.ColumnDefinitions>
                <Button Width="60"  Grid.Column="2" Content="close" Margin="5"   Name="btn_ok" Click="btn_ok_Click" />
            </Grid>
        </Grid>
    </Grid>
</Window>

wpf xaml中的矢量图形在窗口框架外可见

3 个答案: