WPF 元素与动态生成的 UI 元素绑定

Question

我有一个页面，其中有一个包含 2 列的网格，一列可容纳 80* 宽度，另一列可容纳 20* 宽度。网格下方是一个堆栈面板，我在运行时向其中加载 UI 元素（子堆栈面板）。

我的目标是将堆栈面板的宽度绑定到网格的列。如果动态内容在设计视图中被模拟为静态，则效果非常好，并且堆栈面板会调整大小。但是当应用程序运行时，绑定失败并且宽度未绑定。

有什么方法可以刷新绑定，以便我可以通知堆栈面板引用网格的宽度并配置其大小？

更新： 这就是我的 XAML 的样子：

<Page x:Class="WPFTestApp.Page1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Page1">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <Grid x:Name="resizeGrid"
              Grid.Column="0" Grid.Row="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition x:Name="leftColumn"
                                  Width="80*" />
                <ColumnDefinition x:Name="rightColumn"
                                  Width="20*" />
            </Grid.ColumnDefinitions>            
        </Grid>

        <StackPanel x:Name="contentPanel"
                    Grid.Column="0" Grid.Row="0" >
            <!-- Dynamic StackPanels are added here -->
        </StackPanel>
    </Grid>
</Page>

在我的代码中，我创建 StackPanel 元素并将其添加到 contentPanel 中，方法是： contentPanel.Children.Add(...);

不幸的是，我必须在这里使用 StackPanels。 :-(

动态创建的 StackPanel 元素的标记如下（请注意，我使用了 XAML 中已有的绑定到网格）：

<StackPanel x:Name="element01"
             Orientation="Horizontal"
             Width="{Binding ElementName=resizeGrid, Path=ActualWidth}" >
    <StackPanel x:Name="leftPanel"
                Orientation="Vertical"
                Width="{Binding ElementName=leftColumn, Path=ActualWidth}">
        <!-- Content goes here -->
    </StackPanel>
    <StackPanel x:Name="rightPanel"
                Orientation="Vertical"
                Width="{Binding ElementName=rightColumn, Path=ActualWidth}">
        <!-- Content goes here -->
    </StackPanel>
</StackPanel>

我的动态 StackPanel 元素的 XAML 代码是通过 XSLT 转换生成的，

请注意 xmlns:x 命名空间动态 StackPanel 也必须完成，因为它是通过 XSLT 生成的。

Answer 1

据我所知，使用 Orientation="Horizo​​ntal" 设置 StackPanel 的 Width 不会产生任何效果。 StackPanel 的大小不超过其内容在其方向上的大小。

为什么你“必须”在这里使用StackPanel？考虑到您的目标，您几乎肯定需要 DockPanel。您无需绑定或设置任何内容，因为 DockPanel 会自动填充单元格。

Answer 2

尝试绑定 ActualWidth 而不是 Width。

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

    <Grid x:Name="resizeGrid"
          Grid.Column="0" Grid.Row="0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition x:Name="leftColumn"
                              Width="{Binding ElementName=contentPanel, Path=ActualWidth}" />
            <ColumnDefinition x:Name="rightColumn"
                              Width="*" />
        </Grid.ColumnDefinitions>
    </Grid>       


    <StackPanel x:Name="contentPanel"
                Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" >
        <StackPanel Background="Yellow" Width="100" Height="25" />
        <StackPanel Background="Green" Width="120" Height="25" />
        <StackPanel Background="Red" Width="140" Height="25" />
        <TextBlock Background="Gray" Text="{Binding ElementName=contentPanel, Path=ActualWidth}" />
    </StackPanel>
</Grid>

我在上面做了以下更改：
1) 将leftColumn设置为contentPanel的ActualWidth
2) 将 rightColumn 设置为 *
3) contentPanel Horizo​​ntalAlignment 应更改为 Stretch 以外的值。这里我把它改成了Left

HTH

Answer 3

我找到了这个问题的解决方案。 （抱歉回复晚了）

我所做的是将“resizeGrid”网格控件剪切并粘贴到“contentPanel”堆栈面板中。

正如我上面提到的，contentPanel 中的内容是通过 XSLT 转换生成的，这肯定会产生命名空间引用问题。我注意到每当加载此窗口时，输出窗口中都会出现“未找到元素...”消息 - 这证明我是对的。

将“resizeGrid”插入“contentPanel”会有所帮助，因为两个控件都位于同一命名空间内，并且可以使用“ElementName”属性引用 PropertyBinding。

感谢您的支持！ :-)