windows phone 8.1 带有项目模板的列表视图

Question

我想在 Windows Phone 8.1 应用程序中显示一个列表。我添加了列表视图并创建了项目模板。

 <ListView x:Name="history" HorizontalAlignment="Left" Height="397" VerticalAlignment="Top" Width="381">
                    <ListView.Resources>
                        <DataTemplate x:Key="myCell">
                            <Grid x:Name="myGrid" Height="161" Width="389">
                                <TextBlock x:Name="title" HorizontalAlignment="Left" Margin="34,13,0,0" TextWrapping="Wrap" Text="Title" VerticalAlignment="Top" Height="52" Width="170" FontSize="48"/>
                                <TextBlock x:Name="content" HorizontalAlignment="Left" Margin="34,70,0,0" TextWrapping="Wrap" Text="content" VerticalAlignment="Top" Height="81" Width="345" FontSize="36"/>
                            </Grid>
                        </DataTemplate>
                    </ListView.Resources>
                    <ListView.ItemTemplate>
                        <StaticResource ResourceKey="myCell"/>
                    </ListView.ItemTemplate>
                </ListView>

我想以编程方式添加项目。类似的东西

myCell mm = new myCell();
mm.title.Text = "title";
mm.content.Text = "content";
history.Items.Add(mm);

但是我无法访问 myCell。任何人都可以帮助我吗？

Answer 1

由于您使用的是 ItemTemplate，因此您需要使用模型创建项目并将其添加到 ListView。

public class MyModel
{
    public string title {get; set;}
    public string content {get; set;}
}

然后像这样添加项目：

var item = new MyModel();
item.title = "some title";
item.content = "some content";

history.Add(item);

编辑

实际上最好的方法是创建 ObservableCollection<T> 并在代码中的某处将其设置为 ListView 的 ItemsSource。例如，您可以使用 ListView 的 Loaded 事件：

history_Loaded(object sender, RoutedEventArgs e)
{
    var historyCollection = new ObservableCollection<MyModel>();
    history.ItemsSource = historyCollection;
}

然后只需将项目添加到此 ObservableCollection 中，它们就会显示出来，因为它会在更改时向 ListView 报告。

并且您的 TextBlock 必须通过绑定定义 Text 属性：

<TextBlock Text="{Binding title}"/>

要了解有关 ObservableCollection<T> 及其与 List<T> 的区别的更多信息，您可能需要阅读此 - http://www.codeproject.com/Articles/42536/List-vs-ObservableCollection-vs-INotifyPropertyCha.

Answer 2

数据绑定有两个目的：您需要在后面的代码中提供数据，并且需要从 Xaml 绑定到它。如果你只做一个那么就没有连接。

要从代码中提供数据，您需要创建 collection 数据 objects 并将其放置在 ListView 可以看到的上下文中。我们可以将其直接设置为 ListView 的 ItemsSource，也可以将 ItemsSource 绑定到 ListView 的 DataContext。您选择的位置取决于您希望共享此数据的距离。通常你会为页面设置一个整体的 DataContext 并让 ListView 绑定到它的一个子集，但为了简单起见，我们只将它设置为 ListView 的 DataContext:

class myCell
{
    public string Title { get; set; }
    public string Content { get; set; }
}

public sealed partial class MainPage : Page
{
    // Create a collection of myCells. ObservableCollection will fire
    // change notifications so we can add new cells later and the binding
    // will update
    ObservableCollection<myCell> myCells = new ObservableCollection<myCell>();
    public MainPage()
    {
        this.InitializeComponent();

        this.NavigationCacheMode = NavigationCacheMode.Required;

        // Generate some dummy data
        for (int i=0;i<100;i++)
        {
            myCells.Add(new myCell() { Title = "Cell " + i, Content = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." });
        }

        // Set the cells to the Page's DataContext. All controls on 
        // the page will inherit this.
        this.DataContext = myCells;
    }
}

一旦我们有了数据，我们就需要从 Xaml 绑定到它。您现有的模板具有用于标题和内容的 TextBlocks，但它显式设置了文本属性，而不是绑定到列出的 objects。要解决这个问题，我们需要更改 TextBlocks 的 Text 属性以绑定到模板所表示的项目的标题和上下文。原来的模板太大放不下，所以我重新整理了一下。还要注意 ItemsTemplate={Binding} 添加到 ListView:

<ListView x:Name="history" ItemsSource="{Binding}">
    <ListView.Resources>
        <DataTemplate x:Key="myCell">
            <StackPanel>
                <TextBlock x:Name="title" HorizontalAlignment="Left"  TextWrapping="Wrap" Text="{Binding Title, Mode=OneTime}" VerticalAlignment="Top" Style="{StaticResource TitleTextBlockStyle}" />
                <TextBlock x:Name="content" HorizontalAlignment="Left"  TextWrapping="Wrap" Text="{Binding Content, Mode=OneTime}" VerticalAlignment="Top" Style="{StaticResource BodyTextBlockStyle}"  />
            </StackPanel>
        </DataTemplate>
    </ListView.Resources>
    <ListView.ItemTemplate>
        <StaticResource ResourceKey="myCell"/>
    </ListView.ItemTemplate>
</ListView>

有关详细信息，请参阅 Data binding overview (XAML) on MSDN, in particular the Binding to Collections 部分。

windows phone 8.1 带有项目模板的列表视图

windows phone 8.1 listview with item template

listview

windows-phone-8.1