如何使用x:Bind和System.Collections.Generic.List填充ListView并生成列

时间:2015-11-22 20:02:03

标签: c# listview gridview win-universal-app xbind

我正在尝试使用ListView填充List,同时将ItemsSource设置为x:Bind,我无法弄清楚如何制作列并使项目正确显示。< / p>

这是我到目前为止所得到的:

Database.cs中的Customer类

public class Customer
{
    [PrimaryKey, AutoIncrement]
    public int Id { get; set; }
    public string CompanyName { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public int Phone { get; set; }
    public string Email { get; set; }
    public string Adress { get; set; }
    public int PostCode { get; set; }
    public string PostArea { get; set; }
    public string CreatedDate { get; set; }
    public string UpdatedDate { get; set; }
}

Database.cs中的FetchCustomer方法,返回Customer对象列表

public List<Customer> FetchCustomer()
{
    using (SQLiteConnection _connection = new SQLiteConnection(sqlitePlatform, dbFilePath))
    {
        List<Customer> customers = new List<Customer>();
        var _customers = _connection.Table<Customer>();
        foreach (Customer customer in _customers)
        {
            customers.Add(customer);
        }
        return customers;
    }
}

CustomerView页面

public sealed partial class CustomerView : Page
{
    public List<Customer> CustomersFromDB { get; set; }

    public CustomerView()
    {
        this.InitializeComponent();
        ReadyCustomers();
    }

    private void ReadyCustomers()
    {
        var db = new Database();
        CustomersFromDB = db.FetchCustomer();
    }
}

我绑定ItemsSource的XAML

<ListView Grid.Row="1" ItemsSource="{x:Bind CustomersFromDB}"/>

如何进行此操作以便自动生成列并正确显示项目?

我试图添加ListViewHeaderItem并浏览不同的属性,但还没有找到。

<ListView Grid.Row="1" ItemsSource="{x:Bind CustomersFromDB}">
    <ListView.Header>
        <ListViewHeaderItem ???></ListViewHeaderItem>
    </ListView.Header>
</ListView> 

我得到的结果除了绑定之外别无其他:

Snapshot of the app illustrating that the ItemsSource is working but not as intended as it only shows: AuraFaktura.Customer in each ListViewItem

更新

我今天取得了一些进展,现在我有正确的数据输出。我发现使用DataTemplate我可以在元素上设置Binding。

我仍然很难以正确的方式显示数据。

这是我现在写的XAML:

<GridView Grid.Row="1" ItemsSource="{x:Bind CustomersFromDB}" HorizontalAlignment="Stretch">
    <GridViewHeaderItem Content="CompanyName"></GridViewHeaderItem>
    <GridViewHeaderItem Content="FirstName"></GridViewHeaderItem>
    <GridViewHeaderItem Content="LastName"></GridViewHeaderItem>
    <GridViewHeaderItem Content="Phone"></GridViewHeaderItem>
    <GridViewHeaderItem Content="Email"></GridViewHeaderItem>
    <GridViewHeaderItem Content="Adress"></GridViewHeaderItem>
    <GridViewHeaderItem Content="PostCode"></GridViewHeaderItem>
    <GridViewHeaderItem Content="PostArea"></GridViewHeaderItem>
    <GridViewHeaderItem Content="Comment"></GridViewHeaderItem>
    <GridView.ItemTemplate>
        <DataTemplate>
            <GridViewItem BorderThickness="0" BorderBrush="Transparent">
                <GridViewItem.Content>
                    <StackPanel Orientation="Horizontal" BorderThickness="0" BorderBrush="Transparent">
                        <TextBlock Text="{Binding CompanyName}"></TextBlock>
                        <TextBlock Text="{Binding FirstName}"></TextBlock>
                        <TextBlock Text="{Binding LastName}"></TextBlock>
                        <TextBlock Text="{Binding Phone}"></TextBlock>
                        <TextBlock Text="{Binding Email}"></TextBlock>
                        <TextBlock Text="{Binding Adress}"></TextBlock>
                        <TextBlock Text="{Binding PostCode}"></TextBlock>
                        <TextBlock Text="{Binding PostArea}"></TextBlock>
                        <TextBlock Text="{Binding Comment}"></TextBlock>
                        <TextBlock Text="{Binding CreatedDate}"></TextBlock>
                        <TextBlock Text="{Binding UpdatedDate}"></TextBlock>
                    </StackPanel>
                </GridViewItem.Content>
            </GridViewItem>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

结果:

Snapshot of the app illustrating that the DataTemplate is somehow working but not displaying as intended as the items are truncated and the header items are not showing.

因此,你可以看到GridViewHeaderItem没有显示,并且GridViewItem没有正确显示。

以下是我希望最终得到的结果:

Snapshot of the result i want to end up with

我如何继续编写我的XAML来实现这样的结果?

1 个答案:

答案 0 :(得分:0)

只需将余量应用于textblocks margin =&#34; 5,0,5,0&#34;