WPF创建边栏导航

Question

我很好奇如何创建侧边栏导航：

我尝试使用统一的网格，但最终在＆＃34;按钮＆＃34;之间间隔过大。并且我不确定是否可以将标签控件修改为全宽按钮而不是顶部标签。

此外，如果它可以添加图标，那将是一个巨大的优势。

Answer 1

您可以使用希望的宽度在标准网格中创建网格列。在此列中，您可以放置​​一个从上到下填充按钮的堆栈面板。

喜欢那样：

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"/>
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <StackPanel Grid.Column="0">
            <Button Height="40">Test</Button>
            <Button Height="40">Test2</Button>
        </StackPanel>
    </Grid>

看起来像这样：

如果我想念你，请告诉我，我会对它进行编辑。

要添加图像，您可以在Button中创建另一个包含两列的网格：像这样：

            <Button>
                <Grid Height="40" Width="200">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="40"/>
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <Image Grid.Column="0" Source="pack://siteoforigin:,,,/Resources/dll.png"></Image>
                    <TextBlock Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Center">Text</TextBlock>
                </Grid>
            </Button>

请注意，您必须将网格设置为Width =“200”，就像设置主Grid.Column一样，因为如果不将其设置为200，则Grid不会是按钮的整个宽度。

然后列表看起来像这样：