使用 ObservableCollection 进行 WPF 模板答案

【问题标题】：WPF templating with ObservableCollection使用 ObservableCollection 进行 WPF 模板
【发布时间】：2014-11-22 00:25:38
【问题描述】：

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

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

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，但您唯一能做的就是选择整个项目，但我还希望链接是可点击的。

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

【问题讨论】：

您确定您没有误点击链接吗？是否设置为可见的命中测试？点击事件应该first点击那个控件。
将ListView 替换为ItemsControl 并使用您的自定义模板。将ItemsControl 的ItemsSource 绑定到您的Collection。

标签： c# wpf listview templates itemsource

【解决方案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。

【讨论】：

【解决方案2】：

感谢使用 ItemsControl 及其模板的想法。但是我使它与 Click 属性一起使用的超链接并给它一个：

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

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

【讨论】：

是的，当然还有更多方法可以做到这一点。由于这是您的第一个问题，我请您不要忘记通过单击旁边的得分上下控制下方的复选标记将帮助您（在本例中为我的）的答案标记为已接受。谢谢和欢迎。