WPF文字叠加网格

时间:2017-01-23 17:47:02

标签: c# wpf xaml

我搜索了整个stackoverflow,无法找到解决问题的简单解决方案。

我有网格,我想用一些文字/图像覆盖整个网格。你有什么想法我该怎么办?

实际上它是俄罗斯方块游戏,我想向用户显示文字/图像" Game Over"在他输了之后,我需要从c#手动完成。有什么想法吗?

感谢您的帮助:-)

<Window x:Class="TetrisWPF.MainWindow"
       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"
    xmlns:local="clr-namespace:TetrisWPF"
    mc:Ignorable="d"
    Title="MainWindow" 
     AllowsTransparency="True" 
  ResizeMode="CanResizeWithGrip"
  WindowStyle="None"
  ShowInTaskbar="True"
    WindowState="Maximized"
    KeyDown="HandleKeyDown"
    Initialized="MainWindow_Initilized" Background="#222222">
<Window.Resources>

    <FontFamily x:Key="FontAwesome">/Fonts/fontawesome-webfont.ttf#FontAwesome</FontFamily>
</Window.Resources>
<DockPanel LastChildFill="false">
    <Button DockPanel.Dock="Right" Visibility="Hidden" Width="300">Right</Button>
    <StackPanel DockPanel.Dock="Right" Width="311" >
        <Button x:Name="btnPlay" Content="Play" Click="btnPlay_Click" Width="50" Height="25" Margin="5"/>
        <Label Content="Score " Height="56" x:Name="Score" HorizontalAlignment="Center" FontSize="28" FontWeight="Bold" Margin="0,0,0,0"/>
        <Label Content="Lines " Height="56" x:Name="Lines" HorizontalAlignment="Center" FontSize="28" FontWeight="Bold" Margin="0,0,0,0"/>
        <Label Content="Level 1" Height="56" x:Name="level" HorizontalAlignment="Center" FontSize="28" FontWeight="Bold" Margin="0,0,0,0" />
        <Button  x:Name="buttonPlay" HorizontalAlignment="Right" VerticalAlignment="Top" Height="60" Margin="0,20,0,0" Width="205" Click="buttonPlay_Click" >
            <Button.Template>
                <ControlTemplate TargetType="Button">
                    <Image Name="img1" Source="C:\Users\xx\Pictures\btn.png" />
                </ControlTemplate>
            </Button.Template>
        </Button>
        <Button x:Name="buttonPause" Content="Pause (L1)" HorizontalAlignment="Right"  VerticalAlignment="Top" Height="60" Margin="0,20,0,0" Width="205" Click="buttonPause_Click" />
        <Button x:Name="buttonRestart" Content="Restart" HorizontalAlignment="Right" VerticalAlignment="Top" Height="60" Margin="0,20,0,0" Width="205" Click="buttonRestart_Click" />
        <Button x:Name="buttonStop" Content="Stop" HorizontalAlignment="Right" VerticalAlignment="Top" Height="60" Margin="0,20,0,0" Width="205" Click="buttonStop_Click" />
        <Button x:Name="buttonDemo" Content="Demo" HorizontalAlignment="Right" VerticalAlignment="Top" Height="60" Margin="0,20,0,0" Width="205" Click="buttonDemo_Click" />
        <Button x:Name="buttonExit" Content="Exit" HorizontalAlignment="Right" VerticalAlignment="Top" Height="60" Margin="0,20,0,0" Width="205" Click="buttonExit_Click"  />
        <TextBlock x:Name="GameOverText" Height="56" FontSize="28" FontWeight="Bold" TextWrapping="Wrap" Text="Game Over" Foreground="#FFD41A1A"/>
        <TextBlock x:Name="GamePausedText" Height="56" FontSize="28" FontWeight="Bold" TextWrapping="Wrap" Text="Game Paused" Foreground="#FF0D15B6" Margin="0,0,-0.8,0"/>
    </StackPanel>
    <Grid Name="MainGrid" Height="750" Width="375" DockPanel.Dock="Right">
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
    </Grid>
</DockPanel>

1 个答案:

答案 0 :(得分:3)

使用网格,您可以简单地添加占据相同空间的对象,它们将按照您添加它们的顺序重叠。在您的示例中,您有很多列和行,因此要覆盖所有列和行,您必须将它的RowSpan和ColumnSpan设置为您拥有的行/列数以填充所有空间。

更简单的方法可能是将网格放在另一个网格中(只有一行和一列),然后添加一些内容(这就是我想要覆盖组件时的操作,只需将它们粘贴在自己的小1x1中网格)。

像这样:

<Grid>
    <Grid Name="MainGrid" Height="750" Width="375" DockPanel.Dock="Right">
        ... all those columns
    </Grid>
    <Border Name="GameOverlay" Background="Black" Visibility="Hidden">
        <TextBlock Text="Game Over!" Foreground="White" FontWeight="Bold"
                   FontSize="24"
                   HorizontalAlignment="Center"
                   VerticalAlignment="Center"/>
    </Border>
</Grid>

请注意,如果您想隐藏原始内容,请务必设置背景(尽管半透明背景看起来很酷!)。

要在代码中显示和隐藏它,只需显示&amp;使用GameOverlay.Visibility = Visibility.VisibleGameOverlay.Visibility = Visibility.Hidden隐藏它,或将其绑定到您可以更改的属性。

通过这种方式,您可以将其设置为您想要的位置,将其放置在您想要的位置,在设计器中将其设置为Visible,然后将其更改为Hidden(这样您就可以在代码中看到它)。

比在需要时在代码中构建代码并手动将其添加到UX中容易得多。