Question

我之前发布了一个类似的问题，但是我遇到了将ViewModel中的数据导入View的问题。问题在于在绑定到View时将数据从存储它的对象中取出。我创建了一个声明3个项目的类，用于帮助填充将绑定到视图中ListBox的项目的ObservableCollection。我不确定我是否正确地解决了这个问题，所以为了说明我将在下面展示：

ListItem.cs（这是我为帮助填充项目集合而定义的自定义类）

public string Favicon
    {
        get;
        set;
    }

    public string Name
    {
        get;
        set;
    }

    public string Address
    {
        get;
        set;
    }

MainPage.xaml.cs（这里我想保存要在ObservableCollection中添加的每个项目的数据）

void addToFavorites_Click(object sender, EventArgs e)
    {
        var favoriteItem = new ListItem { Favicon = "/Image/1.jpg", Name = "item1", Address = "some address" };
        Settings.FavoritesList.Value.Add(favoriteItem);            
    }

Settings.cs（用于存储FavoritesList ObservableCollection的设置类）

public class Settings
{
    public static Setting<ObservableCollection<ListItem>> FavoritesList = new Setting<ObservableCollection<ListItem>>("Favorites", new ObservableCollection<ListItem>());
}

现在我试图在我的ViewModel中调用这个存储的ObservableCollection FavoritesList，以便我可以将它绑定到另一个页面中的视图。

MainViewModel.cs

public ObservableCollection<ListItem> FavoriteItems { get; private set; }

public MainViewModel()
    {
        FavoriteItems = Settings.FavoritesList.Value;
    }

public event PropertyChangedEventHandler PropertyChanged;
    private void NotifyPropertyChanged(String propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (null != handler)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }

然后导航到我的FavoritesPage.xaml，我想将ViewModel绑定到要显示在列表框中的视图

FavoritesPage.xaml

<ListBox x:Name="FavoritesListBox" ItemsSource="{Binding FavoriteItems}" SelectionChanged="FavoritesListBox_SelectionChanged">

            <StackPanel Orientation="Horizontal" Margin="12,0,12,0">
                <Image x:Name="favicon" Source="{Binding Favicon}" Width="50" Height="50"/>
                <StackPanel>
                    <TextBlock x:Name="favoritesName" Text="{Binding Name}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/>
                    <TextBlock x:Name="favoritesAddress" Text="{Binding Address}" Margin="12,0,0,0"/>
                </StackPanel>
            </StackPanel>

        </ListBox>

FavoritesPage.xaml.cs

public FavoritesPage()
    {
        InitializeComponent();

        // Set the data context of the listbox control to the sample data
        DataContext = App.ViewModel;
    }

由于某种原因，我无法设置DataContext = App.ViewModel;。我相信我将问题缩小到最初使用ListItem类保存MainPage.xaml.cs中的值时。我不确定如何从这里填充ListPicker？我在某处做错了什么，或者我应该做些不同的事情来正确设置datacontext？

Answer 1

只要DataContext被正确设置为App.ViewModel类的实例，MainViewModel的设置就不会出错。

但是，您正在错误地定义ListBox XAML。

要定义商品在ListBox中的显示方式，您必须使用ItemsControl.ItemTemplate属性。

<ListBox x:Name="FavoritesListBox" ItemsSource="{Binding FavoriteItems}" SelectionChanged="FavoritesListBox_SelectionChanged">
        <ListBox.ItemTemplate>
            <DataTemplate>    
                <StackPanel Orientation="Horizontal" Margin="12,0,12,0">
                    <Image x:Name="favicon" Source="{Binding Favicon}" Width="50" Height="50"/>
                    <StackPanel>
                        <TextBlock x:Name="favoritesName" Text="{Binding Name}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/>
                        <TextBlock x:Name="favoritesAddress" Text="{Binding Address}" Margin="12,0,0,0"/>
                    </StackPanel>
                </StackPanel>
            </DataTemplate>  
        </ListBox.ItemTemplate>
    </ListBox>

Answer 2

在App.xaml.cs中执行：

    private static MainViewModel viewModel = null;
    public static MainViewModel ViewModel
    {
        get
        {
            // Delay creation of the view model until necessary
            if (viewModel == null)
            {
                viewModel = new MainViewModel();
            }

            return viewModel;
        }
    }

在丹尼尔推荐的Xaml中：

    <ListBox x:Name="FavoritesListBox" ItemsSource="{Binding FavoriteItems}" SelectionChanged="FavoritesListBox_SelectionChanged">
    <ListBox.ItemTemplate>
        <DataTemplate>    
            <StackPanel Orientation="Horizontal" Margin="12,0,12,0">
                <Image x:Name="favicon" Source="{Binding Favicon}" Width="50" Height="50"/>
                <StackPanel>
                    <TextBlock x:Name="favoritesName" Text="{Binding Name}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/>
                    <TextBlock x:Name="favoritesAddress" Text="{Binding Address}" Margin="12,0,0,0"/>
                </StackPanel>
            </StackPanel>
        </DataTemplate>  
    </ListBox.ItemTemplate>
</ListBox>

在MainViewModel.cs中执行：

public ObservableCollection<ListItem> FavoriteItems 
{ 
    get;
    private set;
}

现在您的DataContext = App.ViewModel应该有效。

实施IS设置，如here

所示

如何将视图模型中的数据导入视图

2 个答案: