如何使用WrapPanel的DataTemplate

Question

我有一個WrapPanel來顯示一些元素。但我想用DataTemplate來顯示它們。 這裏是WrapPanel

<WrapPanel Margin="10,57,12,10" x:Name="wrp1"> 
     <WrapPanel.Resources> 
      <DataTemplate DataType="{x:Type local:DateItem}"> 
       <Grid VerticalAlignment="Top" HorizontalAlignment="Stretch" Width="250" Height="300" Background="Blue"> 
        <Label Content="{Binding Path=DateString}" FontSize="20" Cursor="Hand" Foreground="White" Background="Red" FontWeight="Bold" VerticalAlignment="Bottom" HorizontalAlignment="Left" Height="38" VerticalContentAlignment="Center" Padding="5,0,5,0"/> 
       </Grid> 
      </DataTemplate> 
     </WrapPanel.Resources> 
    </WrapPanel> 

我的XAML代碼這是代碼DateItem

public class DateItem : UIElement 
{ 
    public string DateString { get; set; } 
} 

當窗口初始化，我創建一個DateItem與DateString參數，並補充說，到WrapPanel作爲孩子。

DateItem di = new DateItem(); 
    di.DateString = "28.04.2014"; 
    wrp1.Children.Add(di); 

我覺得一切都很好，但包裝面板不顯示任何內容:(

你能幫我嗎？

Answer 1

你混淆了UI控件與用於定義的演示文稿的DataTemplates您數據爲了渲染數據，你必須設置可以使用ContentControl完成的控制內容 另外，如果你想添加多次，你可以使用ItemsControl

XAML：背後

<WrapPanel x:Name="wrp1"> 
    <WrapPanel.Resources> 
     <DataTemplate DataType="{x:Type local:DateItem}"> 
      <Grid VerticalAlignment="Top" HorizontalAlignment="Stretch" Width="250" 
        Height="300" Background="Blue"> 
       <Label Content="{Binding Path=DateString}" FontSize="20" Cursor="Hand" 
         Foreground="White" Background="Red" FontWeight="Bold" 
         VerticalAlignment="Bottom" HorizontalAlignment="Left" 
         Height="38" VerticalContentAlignment="Center" 
         Padding="5,0,5,0"/> 
      </Grid> 
     </DataTemplate> 
    </WrapPanel.Resources> 
    <ItemsControl x:Name="itemsControl"/> 
</WrapPanel> 

代碼：

DateItem di = new DateItem(); 
di.DateString = "28.04.2014"; 
itemsControl.Items.Add(di); 

DateItem：

public class DateItem 
{ 
    public string DateString { get; set; } 
} 

---

如果您仍然有興趣將其渲染爲控件，則必須定義默認樣式而不是默認模板。

XAML：背後

<WrapPanel x:Name="wrp1"> 
    <WrapPanel.Resources> 
     <Style TargetType="{x:Type local:DateItem}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate> 
         <Grid VerticalAlignment="Top" HorizontalAlignment="Stretch" 
           Width="250" Height="300" Background="Blue"> 
          <Label 
           Content="{Binding Path=DateString, RelativeSource= 
              {RelativeSource Mode=TemplatedParent}}" 
           FontSize="20" Cursor="Hand" Foreground="White" 
           Background="Red" FontWeight="Bold" 
           VerticalAlignment="Bottom" 
           HorizontalAlignment="Left" 
           Height="38" VerticalContentAlignment="Center" 
           Padding="5,0,5,0"/> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </WrapPanel.Resources> 
</WrapPanel> 

代碼：

DateItem di = new DateItem(); 
di.DateString = "28.04.2014"; 
wrp1.Children.Add(di); 

DateItem：

public class DateItem : Control 
{ 
    public string DateString { get; set; } 
}