我有一个非常基本的布局,但仍然无法获得我想要的行为。愚蠢的我...
我的网格有两列,左边是动态大小的列,右边是固定大小的列。这是有效的。在右列中,我有包含两个按钮的堆栈面板,它们会正确调整窗口大小。
在左栏中,我有包含两个分组框的停靠面板,下部具有固定高度并停靠在底部。这个 groupbox 正确地跟随窗口调整大小,就像我想要的一样。
但我无法让上组框填充停靠面板的上半部分。我只能将其高度设置为固定或将其设置为“自动”时,它的高度为 23 的奇怪...?我希望它填充该区域并跟随窗口大小调整。我也在本专栏中尝试使用 stackpanel,但没有成功。
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="220"/>
</Grid.ColumnDefinitions>
<DockPanel x:Name="GroupPanel" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<GroupBox x:Name="AlarmGroup" Header="Alarms" Margin="10" DockPanel.Dock="Top" />
<GroupBox x:Name="LogGroup" Header="Log" Height="188" Margin="10" VerticalAlignment="Bottom" />
</DockPanel>
<StackPanel x:Name="ButtonPanel" Width="190" Grid.Column="1">
<Button x:Name="StartButton" DockPanel.Dock="Right" Width="150" Height="40" VerticalAlignment="Top" Margin="0,20,10,0">Start</Button>
<Button x:Name="StopButton" DockPanel.Dock="Right" Width="150" Height="40" VerticalAlignment="Top" Margin="0,10,10,0">Stop</Button>
</StackPanel>
</Grid>
答案 0 :(得分:1)
默认情况下,DockPanel
用它的最后一个孩子填充它的剩余空间。
您已将 AlarmGroup
GroupBox
设置为第一个孩子,因此它仅占用所需的空间;它是default。第二个孩子有固定的高度,所以它不占用剩余的空间。
要实现您正在寻找的布局,请将 LogGroup
移动为 GroupPanel
的第一个子项并将其 DockPanel.Dock
属性设置为 Bottom
。
示例
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="220"/>
</Grid.ColumnDefinitions>
<DockPanel x:Name="GroupPanel">
<GroupBox x:Name="LogGroup" Header="Log"
DockPanel.Dock="Bottom"
Height="188" Margin="10"/>
<GroupBox x:Name="AlarmGroup" Header="Alarms"
DockPanel.Dock="Top"
Margin="10"/>
</DockPanel>
<StackPanel x:Name="ButtonPanel"
Width="190"
Grid.Column="1">
<Button x:Name="StartButton"
Width="150" Height="40"
VerticalAlignment="Top"
Margin="0,20,10,0">Start</Button>
<Button x:Name="StopButton"
Width="150" Height="40"
VerticalAlignment="Top"
Margin="0,10,10,0">Stop</Button>
</StackPanel>
</Grid>
结果
答案 1 :(得分:0)
这对你有用吗?
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="220"/>
</Grid.ColumnDefinitions>
<DockPanel x:Name="GroupPanel" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<GroupBox x:Name="LogGroup" Header="Log" Height="188" Margin="10" DockPanel.Dock="Bottom"/>
<GroupBox x:Name="AlarmGroup" Header="Alarms" Margin="10" DockPanel.Dock="Top" />
</DockPanel>
<StackPanel x:Name="ButtonPanel" Width="190" Grid.Column="1">
<Button x:Name="StartButton" DockPanel.Dock="Right" Width="150" Height="40" VerticalAlignment="Top" Margin="0,20,10,0">Start</Button>
<Button x:Name="StopButton" DockPanel.Dock="Right" Width="150" Height="40" VerticalAlignment="Top" Margin="0,10,10,0">Stop</Button>
</StackPanel>
</Grid>
在 DockPanel 中,LastChildFill 属性默认设置为 true,这意味着您放置的最后一个 coltrol 将占用所有空间。我还将 VerticalAligment="Bottom" 更改为 DockPanel.Dock="Bottom"
答案 2 :(得分:0)
根据屏幕尺寸,日志和警报屏幕同样变小。我试图通过将它分成网格中的分区来做到这一点。你够了吗?
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="220"/>
</Grid.ColumnDefinitions>
<Grid x:Name="GroupPanel" Grid.Column="0" Grid.Row="0" Grid.RowSpan="3">
<Grid.RowDefinitions>
<RowDefinition Height="1*"/>
<RowDefinition Height="10"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<GroupBox x:Name="LogGroup" Header="Log" Grid.Column="0" Grid.Row="0" Margin="10"/>
<GroupBox x:Name="AlarmGroup" Header="Alarms" Grid.Column="0" Grid.Row="2" Margin="10"/>
</Grid>
<StackPanel x:Name="ButtonPanel"
Width="190"
Grid.Column="1">
<Button x:Name="StartButton"
Width="150" Height="40"
VerticalAlignment="Top"
Margin="0,20,10,0">Start</Button>
<Button x:Name="StopButton"
Width="150" Height="40"
VerticalAlignment="Top"
Margin="0,10,10,0">Stop</Button>
</StackPanel>
</Grid>