Question

我在WPF应用程序中有一个如下所示的GUI：

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
    <StackPanel Orientation="Horizontal">
        <StackPanel Orientation="Vertical">
            <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Width="100" Height="50" Margin="2"></Border>

            <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Width="100" Height="90" Margin="2"></Border>
        </StackPanel>

        <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Margin="2">
            <StackPanel>
            <StackPanel Orientation="Horizontal">
                <Button Content="Some"/>
                <Button Content="Buttons"/>
            </StackPanel>
                <Label Content="Some Label"/>
                <ListView ScrollViewer.VerticalScrollBarVisibility="Auto">
                    <ListViewItem>Item1</ListViewItem>
                    <ListViewItem>Item2</ListViewItem>
                    <!-- and so on...-->
                    <ListViewItem>Item8</ListViewItem>
                    </ListView>
            </StackPanel>
        </Border>
    </StackPanel>
    </Grid>

左侧的两个边界只是实际应用程序中GUI元素的占位符。 GUI元素如下所示：

我希望右侧StackPanel与左侧StackPanel一样高，如以下屏幕截图所示：

对于屏幕截图，我手动将MaxHeight的{{1}}属性设置为正确的值，但是当然这不是令人满意的解决方案，如果我不知道如何编译，它将变得不可能。左边的ListView中填充的时间和数量。

这个问题有解决方案吗？我正在尝试绑定：

StackPanel

但是当我绑定到左侧<Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <StackPanel Orientation="Horizontal"> <StackPanel Orientation="Vertical" Name="Left"> <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Width="100" Height="50" Margin="2"></Border> <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Width="100" Height="90" Margin="2"></Border> </StackPanel> <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Margin="2" Height="{Binding ElementName=Left, Path=Height}">  </Border> </StackPanel> </Grid>的{{1}}时，我也没有成功。有什么建议吗？

Answer 1

堆栈面板会扩展以适合其内容。相反，您需要将ListView放在固定大小的容器中（我使用了高度为*的行的Grid），该容器的大小取自第一列的框。

我使用了与ActualHeight的绑定，与您的绑定非常相似。

另一个重要的区别是在第一个堆栈面板上设置了VerticalAlignment="Top"，否则它的大小会自动调整为与边框相同的高度。

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <StackPanel Orientation="Horizontal">

        <StackPanel Orientation="Vertical" Name="Left" VerticalAlignment="Top">
            <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Width="100" Height="50" Margin="2"></Border>
            <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Width="100" Height="90" Margin="2"></Border>
        </StackPanel>

        <Border Height="{Binding ElementName=Left, Path=ActualHeight}" >
            <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Margin="2">
                <Grid >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <StackPanel Grid.Row="0" Orientation="Horizontal">
                        <Button Content="Some"/>
                        <Button Content="Buttons"/>
                    </StackPanel>
                    <Label  Grid.Row="1" Content="Some Label"/>
                    <ListView Grid.Row="2" ScrollViewer.VerticalScrollBarVisibility="Auto">
                        <ListViewItem>Item1</ListViewItem>
                        <ListViewItem>Item2</ListViewItem>
                        <ListViewItem>Item2</ListViewItem>
                        <ListViewItem>Item2</ListViewItem>
                        <ListViewItem>Item2</ListViewItem>
                        <ListViewItem>Item2</ListViewItem>
                        <!-- and so on...-->
                        <ListViewItem>Item8</ListViewItem>
                    </ListView>
                </Grid>
            </Border>
        </Border>
    </StackPanel>
</Grid>

Answer 2

<StackPanel>
    <Grid Width="300" Height="200">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="2*"/>
                <RowDefinition Height="3*"/>
            </Grid.RowDefinitions>
            <Border Background="Beige" BorderThickness="1" BorderBrush="Black" Margin="2"></Border>

            <Border Grid.Row="1" Background="Beige" BorderThickness="1" BorderBrush="Black" Margin="2"></Border>
        </Grid>
        <Border Grid.Column="1" Background="Beige" BorderThickness="1" BorderBrush="Black" Margin="2">
            <StackPanel>
                <StackPanel Orientation="Horizontal">
                    <Button Content="Some"/>
                    <Button Content="Buttons"/>
                </StackPanel>
                <Label Content="Some Label"/>
                <ListView ScrollViewer.VerticalScrollBarVisibility="Auto">
                    <ListViewItem>Item1</ListViewItem>
                    <ListViewItem>Item2</ListViewItem>
                    <!-- and so on...-->
                    <ListViewItem>Item8</ListViewItem>
                </ListView>
            </StackPanel>
        </Border>

    </Grid>
</StackPanel>

Answer 3

尝试一下：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>

    <StackPanel
        Name="FirstPanel" 
        Grid.Column="0"
        VerticalAlignment="Top">

        <Border 
            Background="Beige" 
            BorderThickness="1" 
            BorderBrush="Black"
            Width="100" 
            Height="50" 
            Margin="2"/>

        <Border 
            Background="Beige" 
            BorderThickness="1" 
            BorderBrush="Black"
            Width="100" 
            Height="90" 
            Margin="2"/>

    </StackPanel>

    <Border 
        Name="ContainerBorder"
        Grid.Column="1"
        Background="Beige" 
        BorderThickness="1"
        BorderBrush="Black"
        Margin="2"
        VerticalAlignment="Top"
        MaxHeight="{Binding ElementName=FirstPanel, Path=ActualHeight}">

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

            <StackPanel Grid.Row="0" Orientation="Horizontal">
                <Button Content="Some"/>
                <Button Content="Buttons"/>
            </StackPanel>

            <Label Grid.Row="1" Content="Some Label"/>

            <ListView Grid.Row="2" ScrollViewer.VerticalScrollBarVisibility="Auto">
                <ListViewItem>Item1</ListViewItem>
                <ListViewItem>Item2</ListViewItem>
                <ListViewItem>Item3</ListViewItem>
                <ListViewItem>Item4</ListViewItem>
                <ListViewItem>Item5</ListViewItem>
                <ListViewItem>Item6</ListViewItem>
                <ListViewItem>Item7</ListViewItem>
                <ListViewItem>Item8</ListViewItem>
            </ListView>
        </Grid>
    </Border>
</Grid>

输出：

将元素的高度设置为相邻元素的高度

3 个答案: