c# - Hide/Show stackpanel on click on a button using MVVM -

i using mvvm first time , not using framwork that. have view has stackpanel , stackpanel has children button. want click button , hide stackpanel , children. using

interactiontriggers not helping me ! kindly check , assist doing wrong

view.xaml

<scrollviewer scrollviewer.verticalscrollbarvisibility="hidden" margin="0,5,0,0"                grid.row="1">     <stackpanel x:name="menuappmemtopapps1" height="485" width="534">         <stackpanel height="80.667" margin="1.767,0,0,0"                      visibility="{binding topappstwittercommand,converter={staticresource bool2visible}}">             <textblock margin="129.249,6,24,0" textwrapping="wrap"                         fontsize="17.333" foreground="#ff8fa3ad" text="7%"                         height="28.408" rendertransformorigin="0.458,0.526"                         horizontalalignment="right" width="32.751"/>             <textblock textwrapping="wrap" fontsize="20" foreground="white"                         text="angry birds" height="28.408" width="134.499"                         horizontalalignment="left" margin="62,-29,0,3"/>             <button x:name="btnrestartwifi1_copy19" content="repair now"                      height="32" width="118" background="#ffced7db"                      fontsize="13.333" margin="24,6,0,0" horizontalalignment="left">                 <i:interaction.triggers>                     <i:eventtrigger eventname="click">                         <i:invokecommandaction command="{binding repairappsusingbatterycommand}"></i:invokecommandaction>                     </i:eventtrigger>                 </i:interaction.triggers>             </button>             <image x:name="image18" horizontalalignment="left" height="24"                     margin="24,-109,0,0" width="24"                     source="/windowsdeviceassist;component/images/angry-birds-logo.png"/>         </stackpanel> 

vm.cs

public vm()  {      this.repairappsusingbatterycommand = new relaycommand(this.executerepairappsusingbatterycommand); }  private void executerepairappsusingbatterycommand(object obj) {     this.topappstwittercommand = false; }    public icommand repairappsusingbatterycommand { get; set; }  private bool topappstwittercommand; public bool topappstwittercommand {     { return this.topappstwittercommand; }     set { this.healthtabcommand = true; } } 

i don't think there's lot of value in using eventtrigger here.

you can this:

<button x:name="btnrestartwifi1_copy19"          content="repair now" height="32"          width="118" background="#ffced7db"          fontsize="13.333" margin="24,6,0,0"          horizontalalignment="left"         command="{binding repairappsusingbatterycommand}" /> 

also vm class should implement inotifypropertychanged interface, ui notified change of topappstwittercommand property.

public class vm : inotifypropertychanged 

and property:

private bool _topappstwittercommand; public bool topappstwittercommand {     { return this._topappstwittercommand; }     set     {          this._topappstwittercommand = value;          onpropertychanged("topappstwittercommand");     } } 

you had this.healthtabcommand = true; reason.

the rest of inotifypropertychanged implementation:

public event propertychangedeventhandler propertychanged;  protected virtual void onpropertychanged([callermembername] string propertyname = null) {     if (propertychanged != null)     {         propertychanged.invoke(this, new propertychangedeventargs(propertyname));     } }