c# - MVVM based Item binding to two Windows Phone controls -

c# - MVVM based Item binding to two Windows Phone controls -

i have 2 controls on single page : 1. radslider 2. listbox

<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>

i want bind 2 controls single item source such if selection of 1 changes other's selection should alter . interested in mvvm based solution. code :

class categoryviewmodel : viewmodelbase { public observablecollection<imagesource> imagecollection { get; set; } private imagesource _currentimage; public imagesource currentimage { { homecoming _currentimage; } set { _currentimage = value; raisepropertychanged("currentimage"); } } }

in add-on have piece of code returns ienumerable , want item source.

public static async task<ienumerable<object>> getcategorynames() { if (categories == null) { jdir dir = newtonsoft.json.jsonconvert.deserializeobject<jdir>(await loadfromjson()); categories = convertjdirtocategory(dir); homecoming categories.select(p => new { name = p.name, src = "images/" + p.name + ".jpg" }); } else { homecoming categories.select(p => new { name = p.name, src = "images/" + p.name + ".jpg" }); } }

am doing in right way ? how should proceed ?

thanks in advance !

edit - comments:

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())) { homecoming await streamreader.readtoendasync(); } }

thanks every body, problem has been solved :

xaml :

datacontext="{binding category, source={staticresource locator}}"

two controls :

<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>

view model :

public class categoryviewmodel : viewmodelbase { private string _categoryname; public string categoryname { { homecoming _categoryname; } set { dispatcherhelper.checkbegininvokeonui(() => { set<string>(ref _categoryname, value); }); } } private uri _selecteditem; public uri selecteditem { { homecoming _selecteditem; } set { dispatcherhelper.checkbegininvokeonui(() => { set<uri>(ref _selecteditem, value); }); } } private observablecollection<uri> _images; public observablecollection<uri> images { { homecoming _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 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)); } }); }); } }

c# xaml windows-phone-8 mvvm async-await