绘制在WPF跨(Draw a cross in WPF)

2019-09-16 13:09发布

我有一个WPF控件。

我需要在后台有一个十字,像这样的:

在那之后,我能够在我的“交叉”背景添加其他控件:

我应该如何画十字,知道当我rezize控制,交叉应该遵循它的大小?

Answer 1:

快速和肮脏的方法是使用线路,将其坐标一些父容器的宽度和高度。 事情是这样的:

<Grid Name="parent">
    <Line  X1="0" Y1="0" X2="{Binding ElementName='parent', Path='ActualWidth'}" Y2="{Binding ElementName='parent', Path='ActualHeight'}" 
           Stroke="Black" StrokeThickness="4" />
    <Line  X1="0" Y1="{Binding ElementName='parent', Path='ActualHeight'}" X2="{Binding ElementName='parent', Path='ActualWidth'}" Y2="0" Stroke="Black" StrokeThickness="4" />
</Grid>

使用网格作为父指添加到网格线后的任何其他的孩子会出现在线条之上:

<Grid Name="parent">
    <Line  X1="0" Y1="0" X2="{Binding ElementName='parent', Path='ActualWidth'}" Y2="{Binding ElementName='parent', Path='ActualHeight'}" 
           Stroke="Black" StrokeThickness="4" />
    <Line  X1="0" Y1="{Binding ElementName='parent', Path='ActualHeight'}" X2="{Binding ElementName='parent', Path='ActualWidth'}" Y2="0" Stroke="Black" StrokeThickness="4" />
    <Label Background="Red" VerticalAlignment="Center" HorizontalAlignment="Center">My Label</Label>
</Grid>


Answer 2:

解决这个另一种方式是干脆把一切都在Viewbox ,并使用Stretch="fill" 。 它将处理大小调整适合你,同时保持适当的比例。 您不需要在这种情况下使用数据绑定。

<Grid  HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" >
    <Viewbox HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" Stretch="Fill">
        <Grid>
            <Line  X1="0" Y1="0" X2="100" Y2="100" Stroke="Black" StrokeThickness="1" />
            <Line  X1="0" Y1="100" X2="100" Y2="0" Stroke="Black" StrokeThickness="1" />
        </Grid>
    </Viewbox>
    <Label Background="Red" VerticalAlignment="Center" HorizontalAlignment="Center">My Label</Label>
</Grid>


Answer 3:

马特Burland的回答让我的应用程序不断闪烁(因为我想引用“父”调整它...然后调整线路,等...)

所以就用弹力= Fill和抑制参考“父”。 现在工作得很好。

<Line x:Name="Line1" Visibility="Hidden" Stroke="Red" StrokeThickness="2" Stretch="Fill"
                X1="0" Y1="0" X2="1" Y2="1" />
<Line x:Name="Line2" Visibility="Hidden" Stroke="Red" StrokeThickness="2" Stretch="Fill"
                X1="0" Y1="1" X2="1" Y2="0" />

这是该解决方案,这混合一个



Answer 4:

    <Line  X1="10" Y1="10" X2="50" Y2="50" Stroke="Black" StrokeThickness="4" />
    <Line  X1="10" Y1="50" X2="50" Y2="10" Stroke="Black" StrokeThickness="4" />

如果你想知道其中x和y的值来了,刚刚抽出笛卡尔坐标和插上

line 1 - point 1:(10,10), point 2:(50,50)
line 2 - point 1:(10,50), point 2:(50,10)

形状上的参考http://msdn.microsoft.com/en-us/library/ms747393.aspx

把标签后/ XAML中的元素线以下,这将使它在画线



文章来源: Draw a cross in WPF