如何将数据绑定到多列列表框

本文关键字:列表 数据绑定 | 更新日期: 2023-09-27 18:09:27

我对WP8.1的XAML数据绑定很陌生。我一直在网上搜索,但我似乎找不到一个直截了当的答案。

我有一个ListBox控件在我的页面上有3列。我需要做的是用它各自的数据填充每一列。

我有一个类,定义了一个"CompleteStation",它是由3个字符串(StationName, Distance,和GasPrice)

这是列表框的XAML代码…我如何能够传递ListBox一个CompleteStation(3个字符串),并有它分开每个字符串到正确的列?下面是我的XAML代码。在我的主类中,我只是向ListBox添加了一个completestation项目。

另外,我需要在XAML代码中引用CompleteStation类吗?如果是,我该怎么做?

<ListBox Name="listBoxStations" FontSize="20" Grid.Row="1">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Width="480" Background="#e6e6e6" Margin="0,10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Station}"/>
                        <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Distance}"/>
                        <TextBlock Grid.Row="0" Grid.Column="2" Text="{Binding Price}"/>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

谢谢!

johan

如何将数据绑定到多列列表框

假设您的CompleteStation是实现NotifyPropertyChangedObservableCollection,那么XAML应该如下

<ListBox Name="listBoxStations" ItemSource={Binding CompleteStation} FontSize="20" Grid.Row="1">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Width="480" Background="#e6e6e6" Margin="0,10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Station}"/>
                        <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Distance}"/>
                        <TextBlock Grid.Row="0" Grid.Column="2" Text="{Binding Price}"/>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

你的模型:

public sealed class CommpleteStation
{
  public string Station{get;set;}
  public string Distance{get;set;}
  public string Price{get;set;}
}

你的视图模型:

public sealed class MyViewModel
{
  public ObservableCollection<CommpleteStation> CommpleteStations{get;private set;}
  public MyViewModel()
  {
    CommpleteStations = new ObservableCollection<CommpleteStation>();
    CommpleteStations.Add(new CommpleteStation{Station="One", Distance="15",Price="130"};
  }
}

,

在你的UI的代码后面,"视图",你实例化你的ViewModel,并设置它为你的视图的数据上下文。

public MyView()
{
  this.DataContext = new MyViewModel();
}