4

Windows Phone 7.1 项目 (XAML)。我有一个以网格为模板的 itemscontrol，绑定到数据元素的集合，一切正常。但是，我必须向网格中添加一个额外的图像，它不会绑定到集合。某种标题图像。

我有这个代码：

<ItemsControl ...>
    <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Grid ShowGridLines="True" x:Name="ShipsGrid">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                        <ColumnDefinition Width="0.1*"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                        <RowDefinition Height="0.1*"></RowDefinition>
                    </Grid.RowDefinitions>

                    <!--<Image Source="/images/image.png" x:Name="SuperImage"/>-->

                </Grid>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>

        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Image x:Name="ElementImage" Source="{Binding ImageUri, Mode=OneWay}" />
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </controls:ShipItemsGridControl>

如果我取消注释 ItemsPanelTemplate (x:Name SuperImage) 中的图像，我会收到以下错误：无法显式修改用作 ItemsControl 的 ItemsPanel 的 Panel 的 Children 集合。ItemsControl 为 Panel 生成子元素。

我已经尝试了几件事，但我无法让它工作。当然，我可以将它添加到 itemtemplate 中，并且只让它在第一个 item 中可见，但这非常非常难看。

4

1 回答 1

3

通过将两者放在允许重叠控件（例如 a或 a ）的父面板中，将它们堆叠在Image您的顶部怎么样？ItemsControlGridCanvas

<Grid>
    <ItemsControl ... />
    <Image Source="/images/image.png"
           VerticalAlignment="Top" HorizontalAlignment="Left" 
           Margin="5,5,0,0" />
</Grid>

在代码示例中，我只是为顶部和左侧边距设置了 5 的边距，但您可能需要稍微弄乱一下，以便将图像与您的第一个 Grid 单元格对齐。

此外，如果您需要动态设置图像的高度/宽度以使其与网格单元格大小相同，您可以将图像的Height和Width属性绑定到 ItemsControl 的 ActualHeight/ActualWidth 并使用转换器计算出 1/10th那个大小（我的博客上有一个 MathConverter可以很容易）

我能想到的唯一其他选择是在生成项目后将其添加到代码隐藏中

void MyItemsControl_Loaded(object sender, EventArgs e)
{
    MyItemsControl.ItemContainerGenerator.StatusChanged += 
        ItemContainerGenerator_StatusChanged;
}

void ItemContainerGenerator_StatusChanged(object sender, EventArgs e)
{
    if (MyItemsControl.ItemContainerGenerator.Status == 
        System.Windows.Controls.Primitives.GeneratorStatus.ContainersGenerated)
    {
        // Remove ItemContainerGenerator event
        MyItemsControl.ItemContainerGenerator.StatusChanged
            -= ItemContainerGenerator_StatusChanged;

        // Add Image to ItemsControl here
    }
}

不过，这并不是很理想，我会尽力先将 Image 放在 ItemsControl 的顶部。

于 2013-03-13T14:42:47.973 回答