为什么我的用户控件尺寸会变大而不是变小？

Question

我在使用简单控件时遇到问题：加载窗口时，它会正确加载用户控件。当我最大化时，用户控件及其内容按预期大小增大。当我恢复下来时，控件没有按预期缩小。黄色块占据了整个空间，但您可以使用鼠标滚轮向下滚动。

我尝试过各种东西，即网格和堆栈面板。所有人都做同样的事情。我做错了什么？

<Window x:Class="gridtest2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:gridtest2"
        xmlns:uc="clr-namespace:gridtest2.UserControls"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">

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

        <ScrollViewer Grid.Column="1" Grid.Row="1" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Hidden" >

            <StackPanel Orientation="Horizontal" x:Name="parentPanelOfControls" Background="Pink">

                <uc:VerticalTextStackControl Text1="ONE" Text2="TWO" Height="{Binding ActualHeight, ElementName=parentPanelOfControls}"/>

            </StackPanel>
            
        </ScrollViewer>

        
        
    </Grid>
    
</Window>

<UserControl x:Class="gridtest2.UserControls.VerticalTextStackControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d" 
             d:DesignHeight="200" d:DesignWidth="100" Background="Yellow">
    <DockPanel x:Name="MainDockPanel" Background="Aqua" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=UserControl}}">

        <Border BorderBrush="Black" BorderThickness="1" Margin="0" x:Name="FirstBorder" DockPanel.Dock="Top" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=DockPanel}, Converter={StaticResource PerCon}, ConverterParameter=0.5}">

            <TextBlock x:Name="TextBlock1" Background="Yellow"/>

        </Border>

        <Border BorderBrush="Black" BorderThickness="1" Margin="0" x:Name="SecondBorder" DockPanel.Dock="Top" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=DockPanel}, Converter={StaticResource PerCon}, ConverterParameter=0.5}">

            <TextBlock x:Name="TextBlock2" Background="Green"/>

        </Border>
        
    </DockPanel>

</UserControl>

using System;
using System.Collections.Generic;
using System.Globalization;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Data;
using System.Windows;

namespace gridtest2.Converters
{
    public class PercentageConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value is double parentWidth && parameter is string percentageStr)
            {
                if (double.TryParse(percentageStr, out double percentage))
                {
                    return parentWidth * percentage;
                }
            }
            return DependencyProperty.UnsetValue;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

Answer 1

您的用户控件中应该有一个包含两行的简单网格。通常，您也不应该将元素的宽度或高度绑定到其父元素的宽度或高度。这一切都应该由框架的常规布局系统来完成。对于诸如“总高度的 50%”之类的相对尺寸，请使用网格。

<UserControl ...>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Border Grid.Row="0" BorderBrush="Black" BorderThickness="1">
            <TextBlock x:Name="TextBlock1" Background="Yellow"/>
        </Border>
        <Border Grid.Row="1" BorderBrush="Black" BorderThickness="1">
            <TextBlock x:Name="TextBlock2" Background="Green"/>
        </Border>
    </Grid>
</UserControl>

在MainWindow的XAML中，您也不会绑定控件的高度：

<ScrollViewer Grid.Column="1" Grid.Row="1" ...>
    <StackPanel Orientation="Horizontal" Background="Pink">
        <local:VerticalTextStackControl Text1="ONE" Text2="TWO"/>
    </StackPanel>
</ScrollViewer>