Question

我创建了一个简单的窗口，其背景图片和顶部的菜单。当我刚刚使用Grid.Background块时，显示的图像。添加菜单块后，图像拒绝显示。那是为什么？

<Window x:Class="wpf_tutorial.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window" Width="521" Height="600"
        WindowStartupLocation="CenterScreen">

    <Grid>
        <Grid.Background>
            <ImageBrush ImageSource="bkgd.jpg"/>
        </Grid.Background>

        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem Header="_Open"/>
            </MenuItem>
        </Menu>
    </Grid>
</Window>

Answer 1

最简单的方法是使用DockPanel，然后将菜单停靠在顶部。它可以很容易地将状态停靠在底部，然后让主页占用页面的其余部分（因此调整大小不是问题）。

这是一个让你走上正确道路的例子：

<Grid x:Name="LayoutRoot">
    <DockPanel >
        <!--                                                           -->
        <!--    Your application menu. You have default commands, and  -->
        <!--    you can add your own commands. They work like nomrmal  -->
        <!--    button commands, so you can reuse them                 -->
        <!--                                                           -->
        <Menu DockPanel.Dock="Top"
          HorizontalAlignment="Left"
          Background="White"
          BorderBrush="Black"
          IsTabStop="False"
        >
            <MenuItem Header="_Default commands" IsTabStop="False">
                <MenuItem Command="ApplicationCommands.Copy" />
                <MenuItem Command="ApplicationCommands.Cut" />
                <MenuItem Command="ApplicationCommands.Paste" />
            </MenuItem>
        </Menu>


        <!--                                                        -->
        <!--   Last child fills the dockbar, so this will take      -->
        <!--    the "main" window and fill it.                      -->
        <!--                                                        -->
        <TabControl>

            <TabItem Header="One" HorizontalAlignment="Left" >
                <ContentControl Content="{Binding One_VM}"  />
            </TabItem>

            <TabItem Header="Two" HorizontalAlignment="Left" >
                <ContentControl Content="{Binding Two_VM}"  />
            </TabItem>
        </TabControl>
    </DockPanel>
</Grid>

Answer 2

正在发生的事情是，Menu占据了整个Grid，因为其尺寸与Grid尺寸完全相同。因此，它将掩盖背景图像。 DockPanel.Top仅在元素位于DockPanel范围内时生效，并且由于您有Grid，因此您无法看到所需的效果。

您必须将Menu放在DockPanel内，同时为您的内容添加Grid：

<DockPanel>
    <Menu DockPanel.Dock="Top">
        <MenuItem Header="_File">
            <MenuItem Header="_Open"/>
        </MenuItem>
    </Menu>
    <Grid>
        <Grid.Background>
            <ImageBrush ImageSource="bkgd.jpg"/>
        </Grid.Background>
    </Grid>
</DockPanel>

...或将Menu放在Grid.Row内并将该行的Height设置为Auto，与第一个示例类似，我会使用第二个其余内容为Grid：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition />
    </Grid.RowDefinitions>

    <Menu Grid.Row="0">
        <MenuItem Header="_File">
            <MenuItem Header="_Open"/>
        </MenuItem>
    </Menu>
    <Grid Grid.Row="1">
        <Grid.Background>
            <ImageBrush ImageSource="bkgd.jpg"/>
        </Grid.Background>
    </Grid>
</Grid>

为什么添加菜单会阻止网格背景显示？

2 个答案: