如何在水平堆棧面板WPF中以垂直模式對齊控件

Question

我已經使用堆棧面板在水平模式下對齊兩個單選按鈕，但是我想在垂直模式下在同一堆棧面板中添加一個數據網格。

<GroupBox Grid.Column="2" Header="Approfondimento pronostici" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" >
                    <StackPanel Orientation="Horizontal">
                        <RadioButton Content="Primo tempo" Margin="3,5,0,128" />
                        <RadioButton Content="Parziale/Finale" Margin="8,5,8,128" />
                        <DataGrid ColumnWidth="*" Grid.Row="2" Grid.Column="2" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Auto" AutoGenerateColumns="False"  Width="auto">
                            <DataGrid.Columns>
                                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="Squadra" MinWidth="100"/>
                                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="1" MinWidth="40" CanUserResize="False" />
                                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="X" MinWidth="40" CanUserResize="False" />
                                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="2" MinWidth="40" CanUserResize="False" />
                                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="un 1.5" MinWidth="40" CanUserResize="False" />
                                <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="ov 1.5" MinWidth="40" CanUserResize="False" />
                            </DataGrid.Columns>
                        </DataGrid>
                    </StackPanel>

我設置了控制邊距，以使您知道應該如何設置。.單選按鈕和數據網格位於組框中。 我該如何解決？

Answer 1

為什么不使用兩個堆棧面板？

 <GroupBox Grid.Column="2" Header="Approfondimento pronostici" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" >
    <StackPanel Orientation="Vertical">
                        <StackPanel Orientation="Horizontal">
                            <RadioButton Content="Primo tempo" Margin="3,5,0,128" />
                            <RadioButton Content="Parziale/Finale" Margin="8,5,8,128" />
    </StackPanel>
                            <DataGrid ColumnWidth="*" Grid.Row="2" Grid.Column="2" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Auto" AutoGenerateColumns="False"  Width="auto">
                                <DataGrid.Columns>
                                    <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="Squadra" MinWidth="100"/>
                                    <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="1" MinWidth="40" CanUserResize="False" />
                                    <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="X" MinWidth="40" CanUserResize="False" />
                                    <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="2" MinWidth="40" CanUserResize="False" />
                                    <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="un 1.5" MinWidth="40" CanUserResize="False" />
                                    <DataGridTextColumn Binding="{x:Null}" ClipboardContentBinding="{x:Null}" Header="ov 1.5" MinWidth="40" CanUserResize="False" />
                                </DataGrid.Columns>
                            </DataGrid>
                        </StackPanel>
</GroupBox>

Answer 2

GroupBox的內容只能包含一個子元素。 因此，您將需要重新布置布局以解決此問題。 我建議一個Grid 。

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

            <StackPanel/>

            <DataGrid Grid.Row="1"/>
        </Grid>
    </GroupBox>

您可以輕松使用DockPanel 。

Answer 3

<DockPanel LastChildFill="True">
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" DockPanel.Dock="Top" Background="SkyBlue">
        <RadioButton Content="First Radio Button" HorizontalAlignment="Center" Margin="5,2"/>
        <RadioButton Content="Second Radio Button" HorizontalAlignment="Center" Margin="5, 2"/>
    </StackPanel>
    <DataGrid DockPanel.Dock="Bottom" Background="SlateGray" >

    </DataGrid>
</DockPanel>

這可以解決。

根據顏色，您也有示例圖片。