windows phone 8.1 listview与项目模板

时间:2015-02-28 16:54:24

标签: listview windows-phone-8.1

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

 <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。有人可以帮帮我吗?

2 个答案:

答案 0 :(得分:2)

由于您正在使用ItemTemplate,因此您需要使用Model。

为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设置为ListView。例如,您可以使用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

答案 1 :(得分:0)

数据绑定有两个目的:你需要在你的代码中提供数据,你需要从Xaml绑定它。如果你只做一个则没有连接。

提供创建数据对象集合所需的代码数据,并将其放在ListView可以看到的上下文中。我们可以直接将它设置为ListView的ItemsSource,也可以将ItemsSource绑定到ListView的DataContext。您选择的位置取决于您希望共享此数据的距离。通常,您将为Page设置一个整体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,但它显式设置Text属性,而不是绑定到列出的对象。要解决这个问题,我们需要更改TextBlocks&#39;要绑定到模板表示的项的标题和上下文的文本属性。原始模板太大而不适合,所以我对它进行了一些重组。另请注意ListView的ItemsTemplate = {Binding}添加:

<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>

有关详情,请参阅MSDN上的Data binding overview (XAML),特别是Binding to Collections部分。