集合项不会显示在设计视图中

时间:2016-08-10 03:05:47

标签: c# xaml data-binding

有人可以帮助我理解为什么我的设计视图不会显示Dog,Cat和Horse,而只是在列表视图中显示三个0和CommonName吗?一旦我只是应用程序,列表视图就会填充正确的数据,但它在设计视图中不起作用。

这就是它的样子 enter image description here

ViewModel代码:

public class MainPageViewModel : ViewModelBase
{
    public ObservableCollection<Animal> Animals { get; } = new ObservableCollection<Animal>();
    public MainPageViewModel()
    {
        SQLiteConnection db = new SQLiteConnection("Animals.sqlite");

        db.CreateTable<Animal>();

        if (db.Table<Animal>().Count() == 0)
        {
            initCollection();
        }
    }

    private void initCollection()
    {
        Animals.Clear();

        Animals.Add(new Animal() { ID = 0, CommonName = "Dog" });
        Animals.Add(new Animal() { ID = 1, CommonName = "Cat" });
        Animals.Add(new Animal() { ID = 2, CommonName = "Horse" });
    }
}

动物类:

public class Animal
{
    [PrimaryKey]
    public int ID { get; set; }
    public string CommonName { get; set; }
}

在XAML中设置对ViewModel的引用

xmlns:vm="using:Module3_SQLite.ViewModels" 

然后我设置了DataContext

<Page.DataContext>
    <vm:MainPageViewModel />
</Page.DataContext>

这是列表视图

<ListView x:Name="lvCollectionItems" 
          ItemsSource="{Binding Animals}"
          HorizontalAlignment="Left"
          Width="500" Height="200" Margin="0,10,0,10">
    <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding ID}" Margin="0,0,40,0" />
                <TextBlock Text="{Binding CommonName}" />
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

如果您需要,这是一个完整的XAML页面:

<Page x:Class="Module3_SQLite.Views.MainPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
      xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
      xmlns:controls="using:Template10.Controls"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:vm="using:Module3_SQLite.ViewModels" 
      xmlns:local="using:Module3_SQLite.Views"
      mc:Ignorable="d" RequestedTheme="Dark">

    <Page.DataContext>
        <vm:MainPageViewModel />
    </Page.DataContext>

    <RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <controls:PageHeader x:Name="pageHeader" Content="Main Page"
                             RelativePanel.AlignLeftWithPanel="True"
                             RelativePanel.AlignRightWithPanel="True"
                             RelativePanel.AlignTopWithPanel="True" />

        <Grid 
            RelativePanel.Below="pageHeader" 
            RelativePanel.AlignLeftWithPanel="True"
            RelativePanel.AlignRightWithPanel="True"
            Padding="10">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="2*" />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>

            <StackPanel Grid.Row="0">
                <TextBlock Text="Collection Items" FontSize="{ThemeResource TextStyleExtraLargeFontSize}" />
                <ListView x:Name="lvCollectionItems" 
                          ItemsSource="{Binding Animals}"
                          HorizontalAlignment="Left"
                          Width="500" Height="200" Margin="0,10,0,10">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="{Binding ID}" Margin="0,0,40,0" />
                                <TextBlock Text="{Binding CommonName}" />
                            </StackPanel>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
                <StackPanel Orientation="Horizontal">
                    <Button x:Name="btnDeleteSelected" Content="Delete Selected" Margin="0,0,10,0" />
                    <Button x:Name="btnClearList" Content="Clear List" Margin="0,0,10,0" />
                    <Button x:Name="btnLoadFromDB" Content="Load From DB" Margin="0,0,10,0" />
                    <Button x:Name="btnResetCollection" Content="Reset Collection" />
                </StackPanel>
            </StackPanel>

            <StackPanel Grid.Row="1">
            <TextBlock Text="Database Items" FontSize="{ThemeResource TextStyleExtraLargeFontSize}" />
                <ListView x:Name="lvDatabaseItems" Width="500" Height="200" Margin="0,10,0,10">

                </ListView>
                <StackPanel Orientation="Horizontal">
                    <Button x:Name="btnSaveToDB" Content="Save Collection to DB" Margin="0,0,10,0" />
                    <Button x:Name="btnDeleteSelectedFromDB" Content="Delete Selected From DB" Margin="0,0,10,0" />
                    <Button x:Name="btnDeleteAllFromDB" Content="Delete All From DB" Margin="0,0,10,0" />
                </StackPanel>
            </StackPanel>

            <StackPanel Grid.Column="1" Grid.RowSpan="2" Orientation="Vertical">
                <TextBlock Text="Edit Selected Item" FontSize="{ThemeResource TextStyleExtraLargeFontSize}" />
                <StackPanel Orientation="Horizontal" Margin="0,10,0,10">
                    <TextBlock Text="Name:" FontSize="{ThemeResource TextStyleLargeFontSize}" Width="70"/>
                    <TextBox x:Name="txtbName" Width="200" />
                </StackPanel>
                <StackPanel Orientation="Horizontal" Margin="0,0,0,50">
                    <TextBlock Text="ID:" FontSize="{ThemeResource TextStyleLargeFontSize}" Width="70" />
                    <TextBox x:Name="txtbId" Width="200" />
                </StackPanel>

                <Button x:Name="btnSaveToCollection" Content="Save To Collection" Margin="0,0,0,10" />
                <Button x:Name="btnInsertToDB" Content="Insert into DB" Margin="0,0,0,10" />
                <Button x:Name="btnUpdateDB" Content="Update in DB" Margin="0,0,0,50" />

                <TextBlock Text="Modify Collection" FontSize="{ThemeResource TextStyleExtraLargeFontSize}" />
                <StackPanel Orientation="Horizontal" Margin="0,10,0,10" >
                    <TextBlock Text="Name:" Width="70" />
                    <TextBox x:Name="txtbItemNameCollection" Width="200"/>
                </StackPanel>
                <StackPanel Orientation="Horizontal" Margin="0,0,0,10">
                    <TextBlock Text="ID:" Width="70" />
                    <TextBox x:Name="txtbItemIDCollection" Width="200" />
                </StackPanel>
                <Button x:Name="btnUpdateCollection" Content="Update" HorizontalAlignment="Center" Width="115" />
            </StackPanel>
        </Grid>
    </RelativePanel>
</Page>

1 个答案:

答案 0 :(得分:0)

您是否以编程方式将数据源添加到列表视图?设计人员可以看到绑定数据内部的唯一方法是通过设计视图为其提供此数据。每当我使用数据源绑定控件时,我通过控件的弹出菜单在设计视图中看到了数据。这是因为设计师无法知道源数据背后的数据,除非它连接到它(当你运行你的应用程序并从数据库获取数据时 - 但对于设计师来说为时已晚)。