基于MVVM的项目绑定到两个Windows Phone控件

Question

我在单个页面上有两个控件：
1. RadSlider
2.列表框

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="100"></RowDefinition>
        </Grid.RowDefinitions>
        <telerik:RadSlideView Name="imgSlidView" >

        <telerik:RadSlideView.ItemTemplate>
            <DataTemplate>
                <Image  Source="{Binding Src}"></Image>
            </DataTemplate>
            </telerik:RadSlideView.ItemTemplate>
            <telerik:RadSlideView.ItemPreviewTemplate>
                <DataTemplate>
                    <telerik:RadBusyIndicator></telerik:RadBusyIndicator>
                </DataTemplate>

            </telerik:RadSlideView.ItemPreviewTemplate>
        </telerik:RadSlideView>

        <ListBox Grid.Row="1" Name="lstImage">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"></StackPanel>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Image Height="100" Margin="0,0,5,0" Source="{Binding Src}"></Image>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

我想将两个控件绑定到单个Item Source，这样，如果一个选项的选择更改了，其他选项的选择也应该更改。
我对基于MVVM的解决方案感兴趣。 我的代码：

 class CategoryViewModel : ViewModelBase
{
    public ObservableCollection<ImageSource> ImageCollection { get; set; }
    private ImageSource _CurrentImage;

    public ImageSource CurrentImage
    {
        get { return _CurrentImage; }
        set
        {
            _CurrentImage = value;
            RaisePropertyChanged("CurrentImage");
        }
    }
}

除此之外，我还有一段代码返回IEnumerable，我希望它可以作为Item Source。

 public static async Task<IEnumerable<Object>> GetCategoryNames()
    {
        if (Categories == null)
        {
            JDir dir = Newtonsoft.Json.JsonConvert.DeserializeObject<JDir>(await LoadFromJson());
            Categories = ConvertJDirToCategory(dir);
            return Categories.Select(p => new { Name = p.Name, Src = "Images/" + p.Name + ".jpg" });
        }
        else
        {
            return Categories.Select(p => new { Name = p.Name, Src = "Images/" + p.Name + ".jpg" });
        }
    }

我做对了吗？ 我应该如何进行？

提前致谢 ！

编辑 -从评论：

private static async Task<string>   LoadFromJson()
{
    string theData = string.Empty; 
    StorageFile file = await Windows.Storage.StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///data.json"));  
    using (StreamReader streamReader = new StreamReader(await file.OpenStreamForReadAsync()))             
    {
        return await streamReader.ReadToEndAsync();         
    }        
}

Answer 1

谢谢大家，我的问题现在已经解决：

XAML：

DataContext="{Binding Category, Source={StaticResource Locator}}"

两个控件：

     <telerik:RadSlideView Name="imgSlidView" SelectedItem="{Binding SelectedItem,Mode=TwoWay}" ItemsSource="{Binding Images}">

            <telerik:RadSlideView.ItemTemplate>
                <DataTemplate>
                    <Image  Source="{Binding}">
                        <telerik:RadContextMenu.ContextMenu>
                            <telerik:RadContextMenu IsZoomEnabled="False"  OpenGesture="Tap">
                                <telerik:RadContextMenuItem  Tap="RadContextMenuItem_Tap" Content="Share">

                                </telerik:RadContextMenuItem>
                            </telerik:RadContextMenu>
                        </telerik:RadContextMenu.ContextMenu>
                    </Image>
                </DataTemplate>
            </telerik:RadSlideView.ItemTemplate>
            <telerik:RadSlideView.ItemPreviewTemplate>
                <DataTemplate>
                    <telerik:RadBusyIndicator></telerik:RadBusyIndicator>
                </DataTemplate>

            </telerik:RadSlideView.ItemPreviewTemplate>
        </telerik:RadSlideView>

        <ListBox Grid.Row="1" ScrollViewer.HorizontalScrollBarVisibility="Auto" Name="lstImage" SelectedItem="{Binding SelectedItem,Mode=TwoWay}" ItemsSource="{Binding Images}">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"></StackPanel>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Image Height="100" Margin="0,0,5,0" Source="{Binding}">

                    </Image>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

查看模型：

 public class CategoryViewModel : ViewModelBase
{
    private string _CategoryName;

    public string CategoryName
    {
        get { return _CategoryName; }
        set
        {
            DispatcherHelper.CheckBeginInvokeOnUI(() => { Set<string>(ref _CategoryName, value); });
        }
    }

    private Uri _SelectedItem;

    public Uri SelectedItem
    {
        get { return _SelectedItem; }
        set
        {
            DispatcherHelper.CheckBeginInvokeOnUI(() => { Set<Uri>(ref _SelectedItem, value); });
        }
    }


    private ObservableCollection<Uri> _Images;

    public ObservableCollection<Uri> Images
    {
        get { return _Images; }
        set { Set<ObservableCollection<Uri>>(ref _Images, value); }
    }

    public CategoryViewModel()
    {
        CategoryName = string.Empty;
        Images = new ObservableCollection<Uri>();
    }

}

XAML.cs

 protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);
        string Category = string.Empty;
        NavigationContext.QueryString.TryGetValue("category", out Category);

        if (this.DataContext is CategoryViewModel)
        {
            var vm = (CategoryViewModel)this.DataContext;
            vm.Images.Clear();
            JSONHelper.LoadFromJson().ContinueWith(t =>
            {
                vm.CategoryName = Category;
                var images = t.Result.Dirs.FirstOrDefault(p => p.DirName == Category).Files;
                Dispatcher.BeginInvoke(() =>
                {
                    foreach (var img in images)
                    {

                        vm.Images.Add(new Uri(string.Format("Data/{0}/{1}", Category, img), UriKind.Relative));
                    }
                });

            });
        }
    }