将自定义项目添加到堆栈面板

Question

我正在做一个项目（Windows Phone 8 with Visual Studio 2012 with C#）我想显示一些项目，每个项目都有：

一张图片
一个标题
描述
能够被点击（这样我就可以导航到某个页面）

所以我想我可以用堆栈面板来做到这一点。但我不确定如何添加具有上述属性的项目以及如何从 XAML 添加这些项目。我厌倦了通过堆栈面板中的 ItemsControl 添加项目，但我不确定如何添加我想要的更复杂的项目。

Answer 1

最好的方法是使用 ListBox 或 LongListSelector 而不是 StackPanel。然后你可以：

数据将列表绑定到控件本身，它将自动处理来自控件的 adding/deleting 个项目
使用 ListBox 的 ItemTemplate 为每个控件定义视图属性

首先，在您的 code-behind/ViewModel/what-have-you 中，您需要创建一个要显示的对象的 ObservableCollection。 ObservableCollection 将让控件知道在添加、删除项目等情况下进行更新。

public ObservableCollection<T> foo = new ObservableCollection<T>();

在 XAML 中，您需要将此 ObservableCollection 数据绑定到您创建的 ListBox：

<ListBox x:Name="ListBox" ItemsSource="{Binding foo}" />

最后，您可以像这样定义 ListBox 的 ItemTemplate：

<ListBox x:Name="ListBox" ItemsSource="{Binding foo}" >
   <ListBox.ItemTemplate>
      <DataTemplate>
         <StackPanel Orientation="Horizontal" Margin="2">
            <TextBlock Text="{Binding Title}" />
            <TextBlock Text="{Binding Description}" />
            <Image Source="{Binding Image}" />
         </StackPanel>
      </DataTemplate>
   </ListBox.ItemTemplate>
</ListBox>

我强烈建议阅读 this guide，尤其是 "Binding a control to a collection of objects" 和后面有关 DataTemplates 的部分。 :)

将自定义项目添加到堆栈面板

Adding custom items to stackpanel

c#

custom-controls

itemscontrol

visual-studio-2012

windows-phone-8