如何将WPF窗口拆分为两部分？

I want to create an app that has a listbox on the left side (I'll style it to make it look good later).

我想创建一个在左侧有一个列表框的应用程序(我会设置它以使其看起来很好)。

On the right side, I want to have an area where I can add controls, etc

在右侧,我想要一个可以添加控件等的区域

So the question is what do I need to do to split the Window into two unequal parts (left side approx 350 pixels wide and height should be the entire window) and the remainder is for my "canvas."

所以问题是我需要做什么才能将Window分成两个不相等的部分(左边约350像素宽,高度应该是整个窗口),其余部分用于我的“画布”。

2 个解决方案

#1

You can use a Grid:

你可以使用网格:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="350" /> <!-- Or Auto -->
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <ListBox Grid.Column="0" />
    <Canvas Grid.Column="1" />
</Grid>

Or you could use a DockPanel:

或者您可以使用DockPanel:

<DockPanel>
    <ListBox DockPanel.Dock="Left" Width="350" />
    <Canvas />
</DockPanel>

The benefit of the Grid is you have finer control over the layout and could allow the end user to dynamically resize the columns using a GridSplitter.

Grid的好处是您可以更好地控制布局,并允许最终用户使用GridSplitter动态调整列的大小。

#2

An alternate approach to CodeNaked's solution can be to use DockPanel where Canvas takes all space that is left automatically and you don't have to work out splits.

CodeNaked解决方案的另一种方法是使用DockPanel,其中Canvas占用自动留下的所有空间,而您不必计算拆分。

Of course this has the limitation of docking only to the four edges (with possibility of stacking up at edges) but I tend to prefer DockPanel when I'm making initial UI as they're rather quick and easy to setup compared to Grid setup which can get complex fairly quickly.

当然这有限制只能对接到四个边缘(有可能在边缘堆叠)但我倾向于在制作初始UI时更喜欢DockPanel,因为与网格设置相比,它们设置起来相当快速且容易。可以很快地变得复杂。

<DockPanel LastChildFill="True">
    <ListBox DockPanel.Dock="Left" Width="350"/>
    <Canvas />
</DockPanel>

#1