以Grid作爲模板的ItemsControl：將控件添加到Grid

Question

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：名稱SuperImage），我收到以下錯誤：無法明確修改面板的Children集合作爲ItemsPanel爲ItemsControl的。 ItemsControl爲Panel生成子元素。

我已經嘗試了幾件事，但我無法設法讓它工作。當然，我可以將它添加到itemtemplate，並且只能在第一項中顯示，但這非常非常難看。

Answer 1

如何在ItemsControl的頂部疊加Image，將它們放置在允許重疊控件的父面板中，如Grid或Canvas？

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

在我剛纔設置的5餘量爲頂部和左邊緣的代碼示例，但你可能會需要弄亂了一下，一行的圖像與你的第一個網格單元格。

此外，如果你需要動態設置圖像的高度/寬度，使其大小相同的網格單元，可以綁定圖片到ItemsControl中的的ActualHeight/ActualWidth的的Height和Width性能和使用轉換器要弄清楚該尺寸的1/10（我有一個MathConverter on my blog這將使這容易）

我能想到的是將其添加到已生成的項目後的代碼背後的唯一選擇

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 
    } 
} 

雖然這並不是很理想，但我w應該盡我所能將圖像放在ItemsControl上面。