c# - Update Image source in data template long list selector WP8 -
my problem : in long list selector, when list items loaded , click on edit button activate/inactive items
when active / d-activate top items on scrolling down long list selector some- middle items automatically got selected.
please suggest me rid of issue:
mainpage.xaml
<phone:phoneapplicationpage x:class="longlistselector.mainpage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:microsoft.phone.controls;assembly=microsoft.phone" xmlns:shell="clr-namespace:microsoft.phone.shell;assembly=microsoft.phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:ignorable="d" fontfamily="{staticresource phonefontfamilynormal}" fontsize="{staticresource phonefontsizenormal}" foreground="{staticresource phoneforegroundbrush}" supportedorientations="portrait" orientation="portrait" shell:systemtray.isvisible="true"> <phone:phoneapplicationpage.resources> <phone:jumplistitembackgroundconverter x:key="backgroundconverter"/> <phone:jumplistitemforegroundconverter x:key="foregroundconverter"/> <datatemplate x:key="customheadertemplate"> <stackpanel background="darkkhaki" orientation="horizontal" width="450" > <textblock text="{binding name}" fontsize="36" fontfamily="{staticresource phonefontfamilysemilight}"/> </stackpanel> </datatemplate> <datatemplate x:key="customexpandertemplate"> <stackpanel orientation="horizontal"> <image source="{binding image}" stretch="none"/> </stackpanel> </datatemplate> <datatemplate x:key="customitemtemplate"> <stackpanel background="blueviolet" margin="0,0,0,10" height="55" orientation="horizontal" width="412"> <border borderthickness="1" cornerradius="10" background="white" width="280" height="50"> <textblock text="{binding unitname}" foreground="black" fontweight="bold" /> </border> <stackpanel margin="0,6,15,0"> <image height="32" width="32" source="/assets/images/edit.png"></image> </stackpanel> <stackpanel margin="0,6,15,0"> <image height="32" width="32" source="/assets/images/trash.png"></image> </stackpanel> <stackpanel margin="0,6,15,0"> <image height="32" width="32" source="{binding imagesource}"></image> </stackpanel> </stackpanel> </datatemplate> <datatemplate x:key="customnonexpandableheadertemplate"> <stackpanel orientation="vertical"> <textblock text="{binding name}" fontsize="{staticresource phonefontsizeextralarge}" fontfamily="{staticresource phonefontfamilysemilight}"/> </stackpanel> </datatemplate> </phone:phoneapplicationpage.resources> <!--layoutroot root grid page content placed--> <grid x:name="layoutroot" background="transparent"> <grid.rowdefinitions> <rowdefinition height="auto"/> <rowdefinition height="*"/> </grid.rowdefinitions> <!--titlepanel contains name of application , page title--> <stackpanel x:name="titlepanel" grid.row="0" margin="12,17,0,28"> <textblock text="my application" style="{staticresource phonetextnormalstyle}" margin="12,0"/> <textblock text="page name" margin="9,-7,0,0" style="{staticresource phonetexttitle1style}"/> </stackpanel> <!--contentpanel - place additional content here--> <grid x:name="contentpanel" grid.row="1" margin="12,0,12,0"> <phone:longlistselector x:name="grouplistbox" width="auto" background="#d1eefc" borderthickness="1" isgroupingenabled="false" layoutmode="list" hideemptygroups="true" verticalalignment="stretch" > <phone:longlistselector.itemtemplate> <datatemplate> <stackpanel background="white" horizontalalignment="stretch" verticalalignment="stretch" width="auto" height="auto"> <grid x:name="subgrid" width="auto" horizontalalignment="stretch"> <grid.columndefinitions> <columndefinition x:name="subgridcol"/> <columndefinition width="80"/> </grid.columndefinitions> <stackpanel grid.column="0" name="subpnl" orientation="horizontal" horizontalalignment="stretch" width="auto" maxheight="200" minheight="100"> <textblock textwrapping="wrap" horizontalalignment="left" height="auto" width="250" textalignment="left" foreground="black" fontsize="25" verticalalignment="center" text="{binding name}" style="{staticresource phonetextnormalstyle}" fontfamily="{staticresource phonefontfamilysemibold}" /> </stackpanel> <stackpanel grid.column="1" horizontalalignment="stretch" verticalalignment="center" background="transparent" > <image source="{binding content}" horizontalalignment="stretch" verticalalignment="stretch" width="auto" visibility="{binding controlvisibility}" tap="activeinactiveimage_tap_1"> </image> </stackpanel> </grid> <rectangle fill="gray" height="1" horizontalalignment="stretch" width="1000" /> </stackpanel> </datatemplate> </phone:longlistselector.itemtemplate> </phone:longlistselector> </grid> </grid> <phone:phoneapplicationpage.applicationbar> <shell:applicationbar mode="default" opacity="1.0" ismenuenabled="true" isvisible="true"> <shell:applicationbariconbutton click="applicationbariconbutton_click_1" iconuri="/assets/appbar/edit.png" text="edit"/> </shell:applicationbar> </phone:phoneapplicationpage.applicationbar> </phone:phoneapplicationpage> mainpage.xaml.cs
using system; using system.collections.generic; using system.linq; using system.net; using system.windows; using system.windows.controls; using system.windows.navigation; using microsoft.phone.controls; using microsoft.phone.shell; using longlistselector.resources; using system.windows.media.imaging; using system.collections.objectmodel; namespace longlistselector { public partial class mainpage : phoneapplicationpage { // constructor list<groupclass> list = new list<groupclass>(); observablecollection<groupclass> datalist = null; static bool iseditable = false; public mainpage() { initializecomponent(); // sample code localize applicationbar //buildlocalizedapplicationbar(); list.add(new groupclass() { name = "temp", isactive = false, iscustom = false, iseditable = false, unitgroupid = 1 }); list.add(new groupclass() { name = "temp1", isactive = false, iscustom = false, iseditable = false, unitgroupid = 2 }); list.add(new groupclass() { name = "temp2", isactive = false, iscustom = false, iseditable = false, unitgroupid = 3 }); list.add(new groupclass() { name = "temp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 4 }); list.add(new groupclass() { name = "aemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 5 }); list.add(new groupclass() { name = "aemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 6 }); list.add(new groupclass() { name = "aemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 7 }); list.add(new groupclass() { name = "bemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 8 }); list.add(new groupclass() { name = "bemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 9 }); list.add(new groupclass() { name = "bemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 10 }); list.add(new groupclass() { name = "cemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 11 }); list.add(new groupclass() { name = "cemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 12 }); list.add(new groupclass() { name = "cemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 13 }); list.add(new groupclass() { name = "demp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 14 }); list.add(new groupclass() { name = "demp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 15 }); list.add(new groupclass() { name = "demp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 16 }); list.add(new groupclass() { name = "eemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 17 }); list.add(new groupclass() { name = "eemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 18 }); list.add(new groupclass() { name = "eemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 19 }); list.add(new groupclass() { name = "eemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 20 }); list.add(new groupclass() { name = "femp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 21 }); list.add(new groupclass() { name = "femp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 22 }); list.add(new groupclass() { name = "gemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 23 }); list.add(new groupclass() { name = "gemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 24 }); list.add(new groupclass() { name = "hemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 25 }); list.add(new groupclass() { name = "hemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 26 }); list.add(new groupclass() { name = "jemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 27 }); list.add(new groupclass() { name = "jemp3", isactive = false, iscustom = false, iseditable = false, unitgroupid = 28 }); datalist = new observablecollection<groupclass>(list); this.grouplistbox.itemssource = datalist; } private void activeinactiveimage_tap_1(object sender, system.windows.input.gestureeventargs e) { image imgobj = sender image; groupclass gcobj = (groupclass)imgobj.datacontext; if (gcobj != null) { gcobj.isactive = !gcobj.isactive; imgobj.datacontext = gcobj; datalist.firstordefault(x => x.unitgroupid == gcobj.unitgroupid).isactive = gcobj.isactive; imgobj.source = new bitmapimage(new uri(gcobj.isactive ? "/assets/images/active.png" : "/assets/images/inactive.png", urikind.relative)); } grouplistbox.itemssource = datalist; } private void applicationbariconbutton_click_1(object sender, eventargs e) { iseditable = !iseditable; foreach (var obj in datalist) { obj.iseditable = iseditable; obj.ischecked = false; } this.grouplistbox.itemssource = null; this.grouplistbox.itemssource = datalist; } } } groupclass.cs
using system; using system.collections.generic; using system.componentmodel; using system.linq; using system.text; using system.threading.tasks; using system.windows; namespace longlistselector { class groupclass { public string imagesource { get; set; } public string content { { return isactive ? "/assets/images/active.png" : "/assets/images/inactive.png"; } } public string name { get; set; } public long unitgroupid { get; set; } public bool isactive { get; set; } public bool iscustom { get; set; } public bool ischecked { get; set; } public bool iseditable { ; set; } public visibility controlvisibility { { return iseditable? visibility.visible : visibility.collapsed; } } } }
finally after struggling 2 day, solve issue , fix it.
replace groupclass.cs code:
groupclass.cs
using system; using system.collections.generic; using system.componentmodel; using system.linq; using system.text; using system.threading.tasks; using system.windows; namespace longlistselector { class groupclass : inotifypropertychanged { public string imagesource { get; set; } public string content { get; set; } public string name { get; set; } public long unitgroupid { get; set; } private bool isactive; public bool isactive { { return isactive; } set { isactive = value; content = isactive ? "/assets/images/active.png" : "/assets/images/inactive.png"; onpropertychanged("isactive"); onpropertychanged("content"); } } public bool iscustom { get; set; } public bool ischecked { get; set; } private bool iseditable; public bool iseditable { { return iseditable; } set { if (value != iseditable) { iseditable = value; onpropertychanged("iseditable"); controlvisibility = iseditable ? visibility.visible : visibility.collapsed; onpropertychanged("controlvisibility"); } } } public visibility iscustomcontrolvisibility { { return iseditable & iscustom ? visibility.visible : visibility.collapsed; } } public visibility controlvisibility { get; set; } public event propertychangedeventhandler propertychanged; protected void onpropertychanged(string propertyname) { propertychangedeventhandler handler = this.propertychanged; if (handler != null) { handler(this, new propertychangedeventargs(propertyname)); } } } } we need call inotifypropertychanged @ couple of more places in code.
Comments
Post a Comment