WPF使用网格作为背景

本文关键字:背景 网格 WPF | 更新日期: 2023-09-27 18:11:13

目前,我可以创建一个网格标签,其中包含背景图像和kinect照片(都是图像标签)。

<Grid Name="CompositeImage">
    <Image Source="bg.png" Strech="Fill" HorizontalAlignment="Strech" VerticalAlignment="Strech"/>
    <Image Source="{Binding kinectPhoto}" Strech="UniformToFill"  HorizontalAlignment="Strech" VerticalAlignment="Strech"/>
</Grid>

但是现在,我想使用这个网格作为背景,但我不能在背景标签下使用它。这样的

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="3*"/>
        <ColumnDefinition Width="15*"/>
        <ColumnDefinition Width="3*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Width="3*"/>
        <RowDefinition Width="8*"/>
        <RowDefinition Width="3*"/>
    </Grid.RowDefinitions>
    <Grid.Background>
        <Grid Name="CompositeImage"> ... same as above ... </Grid>
    </Grid.Background>
    <!-- other components -->
</Grid>

是否有任何解决方案使网格合成图像作为背景或使其适合外部网格?

WPF使用网格作为背景

你可以通过设置Grid.RowSpanGrid.ColumnSpan属性让"background"网格跨越所有行和列:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="3*"/>
        <ColumnDefinition Width="15*"/>
        <ColumnDefinition Width="3*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Width="3*"/>
        <RowDefinition Width="8*"/>
        <RowDefinition Width="3*"/>
    </Grid.RowDefinitions>
    <Grid x:Name="CompositeImage" Grid.ColumnSpan="3" Grid.RowSpan="3">
        ...
    </Grid>
    <!-- other components -->
</Grid>

你实际做的是命名两个网格相同的名称CompositeImage。你要做的是:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="3*"/>
        <ColumnDefinition Width="15*"/>
        <ColumnDefinition Width="3*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Width="3*"/>
        <RowDefinition Width="8*"/>
        <RowDefinition Width="3*"/>
    </Grid.RowDefinitions>
    <Grid.Background>
        <VisualBrush>
            <VisualBrush.Visual>
                <Grid>
                    <Image Source="bg.png" Strech="Fill" HorizontalAlignment="Strech" VerticalAlignment="Strech"/>
                    <Image Source="{Binding kinectPhoto}" Strech="UniformToFill"  HorizontalAlignment="Strech" VerticalAlignment="Strech"/>
                </Grid>
            </VisualBrush.Visual>
        </VisualBrush>
    </Grid.Background>
    <!-- other components -->
</Grid>

如果你真的想用它作为Background,那么请注意,这个属性需要一个Brush。

你可以建立一个VisualBrush,将渲染你的网格与图像,然后使用这样的画笔作为背景。

然而,我认为所有你想要的是使用它作为"背景"(而不是作为背景),在这种情况下,只是把它放入目标网格,然后"最大化它"(colspan=xxxx rowspan=xxx水平=拉伸垂直=拉伸),并移动它"向后"(zindex=somelowvalue或只是把它作为网格的第一子)