c# - 动态调整 UserControl 大小的 WPF XAML 数据绑定(bind)

Question

我有一个带有包含文本框的网格的用户控件。该对象根据框中的文本动态调整自身大小。我需要将此对象的尺寸绑定(bind)到我的模型。绑定(bind) UserControl 或 Grid 的“宽度”和“高度”将破坏动态调整大小，因为我现在坚持使用模型中声明的初始大小。我尝试使用“minHeight”和“minWidth”，但它们不会将数据发送回模型，因为最小尺寸永远不会改变。我曾尝试摆弄不同的模式(Oneway、ToWay 等)，但没有成功。

总结一下:我需要一种方法来绑定(bind)尺寸，同时保持文本框中文本的动态调整大小。

<UserControl x:Class="_02350Demo.View.ClassBoxUserControl"
         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" 
         xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
         xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Platform"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300"
         Canvas.Left="{Binding X}" Canvas.Top="{Binding Y}"
         Width="{Binding Width}" Height="{Binding Height}">
<UserControl.InputBindings>
    <KeyBinding Modifiers="Control" Key="Z" Command="{Binding UndoCommand}" />
    <KeyBinding Modifiers="Control" Key="Y" Command="{Binding RedoCommand}" />
</UserControl.InputBindings>


<Grid>
    <Rectangle Opacity="{Binding DataContext.ModeOpacity, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" StrokeThickness="6" StrokeDashArray="3.1">
        <!-- The fill (background) color of the ellipse is a radial (center to edge) gradient (more than one color) brush. -->
        <Rectangle.Fill>
            <RadialGradientBrush>
                <GradientStop Color="Black" Offset="0.0" />
            </RadialGradientBrush>
        </Rectangle.Fill>


        <i:Interaction.Triggers>
            <i:EventTrigger EventName="MouseDown">
                <cmd:EventToCommand Command="{Binding DataContext.MouseDownShapeCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" PassEventArgsToCommand="True"/>
            </i:EventTrigger>
            <i:EventTrigger EventName="MouseMove">
                <cmd:EventToCommand Command="{Binding DataContext.MouseMoveShapeCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" PassEventArgsToCommand="True"/>
            </i:EventTrigger>
            <i:EventTrigger EventName="MouseUp">
                <cmd:EventToCommand Command="{Binding DataContext.MouseUpShapeCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}}" PassEventArgsToCommand="True"/>
            </i:EventTrigger>
        </i:Interaction.Triggers>
    </Rectangle>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition />
        </Grid.RowDefinitions>
        <TextBox Text="{Binding ContentClass}"  HorizontalAlignment="Stretch" AcceptsReturn="True" TextWrapping="Wrap" VerticalAlignment="Stretch" Grid.Row="0" BorderThickness="1,1,1,1" BorderBrush="Gray" TextAlignment="Center" Margin="30,0,30,0"/>
        <TextBox Text="{Binding ContentFields}" HorizontalAlignment="Stretch" AcceptsReturn="True" TextWrapping="Wrap" VerticalAlignment="Stretch" Grid.Row="1" BorderThickness="1,1,1,1" BorderBrush="Gray"/>
        <TextBox Text="{Binding ContentMethods}" HorizontalAlignment="Stretch" AcceptsReturn="True" TextWrapping="Wrap" VerticalAlignment="Stretch" Grid.Row="2" BorderThickness="1,1,1,1" BorderBrush="Gray"/>
    </Grid>

</Grid>

Answer 1

如果您只是想让您的 View 模型知道 UserControl 的动态大小，您可以处理 UserControl 的 SizeChanged 事件并将 View 模型的 Width 和 Height 源属性设置为 的 ActualWidth 和 ActualHeight 属性>UserControl 分别为:

private void UserControl_SizeChanged(object sender, SizeChangedEventArgs e)
{
    var vm = DataContext as YourViewModel;
    vm.Height = ActualHeight;
    vm.Width = ActualWidth;
}

如果你想，你可以把它包装在一个行为中:https://www.codeproject.com/Articles/28959/Introduction-to-Attached-Behaviors-in-WPF