MahApps.Metro 弹出按钮不覆盖列

Question

我有一个简单的布局，我正在尝试放入弹出窗口以用作用户输入屏幕。这是 xaml:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="9*"/>
        <ColumnDefinition Width="1*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <StackPanel Orientation="Vertical" Grid.Column="1" Grid.Row="0">
        <Button Content="Add New Task" Command="{Binding NewTaskCommand}" Margin="{StaticResource CenteredToolMargin}"/>
        <Button Content="Archive Tasks" Command="{Binding ArchiveTasksCommand}" Margin="{StaticResource CenteredToolMargin}"/>
        <Button Content="Complete Tasks" Command="{Binding CompleteTasksCommand}" Margin="{StaticResource CenteredToolMargin}"/>
    </StackPanel>
    <Controls:Flyout Header="Flyout" Position="Right" Width="200" IsOpen="True">
        <Controls:FlyoutsControl>
            <TextBlock FontSize="24">Hello World</TextBlock>
        </Controls:FlyoutsControl>
    </Controls:Flyout>
</Grid>

问题是，弹出按钮出现在第 1 列的左侧而不是顶部。不过，当我关闭弹出窗口时，它会在第 1 列上显示动画。我尝试交换 "Controls:Flyout" 和 "Controls:FlyoutsControl" 标签，因为我找不到关于它们应该走哪条路的一致指导，但无论哪种方式，它的行为都是一样的。我错过了什么吗？

Answer 1

如果您想要固定宽度，我将第 1 列宽度设置为自动，而不是在弹出窗口中添加此行 Grid.Column="0" Grid.ColumnSpan="2" 并删除 Grid.Column="1"

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>


    <StackPanel Orientation="Vertical" Grid.Column="1" Grid.Row="0">
        <Button Content="Add New Task" />
        <Button Content="Archive Tasks" />
        <Button Content="Complete Tasks" />
    </StackPanel>

    <Controls:Flyout Grid.Column="1" Header="Flyout" Position="Right" Width="200" IsOpen="True">
        <Controls:FlyoutsControl>
            <TextBlock FontSize="24">Hello World</TextBlock>
        </Controls:FlyoutsControl>
    </Controls:Flyout>
</Grid>

MahApps.Metro 弹出按钮不覆盖列

MahApps.Metro Flyout not overlaying a column

c#

wpf

xaml

mahapps.metro