使用ObservableCollection进行模板化的WPF

Question

我正在开展一个本地项目，但我遇到了一些问题。

我想为一些包含3个字符串（其中1是超链接）和图片的结果创建一个模板，它们作为结果类型的ObservableCollection绑定到ItemSource。

public TestClass {
  public string Title { get; set; }
  public string Description { get; set; }
  public string Link { get; set; }
  public BitmapImage Thumbnail { get; set; }
}

所以，我想在WPF中显示这些结果，我想为每个项目使用一个模板并在StackPanel（或ListView）中显示它们。

我尝试使用ListView，但你唯一能做的就是选择整个项目，但我也希望链接可以点击。

我的问题是：如何创建一个模板用于每个项目，然后将它们添加到一个可单击的字符串列表中？

Answer 1

正如Unflux所说，这是一个很好的方法。至于可点击链接，请使用Hyperlink控件，如下所示。

<ItemsControl ItemsSource="{Binding Persons}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <TextBlock Text="{Binding FirstName}" Grid.Row="0" Grid.Column="0" />
                <TextBlock Text="{Binding LastName}" Grid.Row="0" Grid.Column="1" />
                <TextBlock Text="{Binding Age}" Grid.Row="0" Grid.Column="2" />
                <TextBlock Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3">
                    <Hyperlink NavigateUri="{Binding BlogAddress}" Click="Hyperlink_OnClick">
                        <TextBlock Text="{Binding BlogAddress}" />
                    </Hyperlink>
                </TextBlock>                        
            </Grid>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

和代码隐藏

private void Hyperlink_OnClick(object sender, RoutedEventArgs e)
{
    var link = sender as Hyperlink;
    Process.Start(link.NavigateUri.ToString());
}

结果

您可能希望对其进行一些设计，并可能应用不同的ItemsPanel来真正自定义您的收藏品的外观。您还可以使用滚动来装饰ItemsControl。

Answer 2

感谢您使用ItemsControl及其模板。但是Hyperlink我使用了Click属性并给它一个：

 public ICommand RunHyperlink {
     get {
         return new ActionCommand(this.ButtonClick);
     }
 }

 private void ButtonClick() {
        Process.Start(new ProcessStartInfo(this.Link));
 }