c# - MahApp Flyout CloseCommand and IsOpen are Not Binding Properly -

i'm following strict mvvm pattern.

in flyoutcontrol, i've bound following:

    <controls:flyoutscontrol>         <controls:flyout isopen="{binding flyoutisopen, updatesourcetrigger=propertychanged, mode=twoway}"                          closecommand="{binding closeflyoutcommand}">             ...         </controls:flyout>     </controls:flyoutscontrol> 

i have 2 scenarios, both not work:

---

scenario 1:

i set flyoutisopen true in viewmodel constructor, , bind closeflyoutcommand delegatecommand accepts method sets flyoutisopen false.

in scenario, view loads flyout open (as expected). however, when click flyout close button, nothing happens unless click again. if print output of method, can confirm command sets flyoutisopen false, reason, require second click (after flyoutisopen set false) close flyout.

---

scenario 2:

i set flyoutisopen false (or uninitialized) in constructor. bind button delegatecommand accepts method sets flyoutisopen true.

the view loads flyout closed (as expected). however, when click button i've bound method sets flyoutisopen true, nothing happens , flyout not appear.

---

has experienced non-responsive issues flyoutscontrol? if so, how did resolve it?

i had problems binding isopen property, managed styling itemcontainer , binding isopen there instead of inside flyout. don't need closecommand anymore, setting visible false in viewmodel closes flyout.

the mainwindow.xaml define itemcontainer bindings:

<controls:metrowindow.flyouts>     <controls:flyoutscontrol itemssource="{binding flyouts}">         <controls:flyoutscontrol.resources>             <view:flyoutpositionconverter x:key="flyoutpositionconverter"/>         </controls:flyoutscontrol.resources>         <controls:flyoutscontrol.itemtemplate>             <datatemplate datatype="{x:type viewmodel:settingsviewmodel}">                 <view:settingsflyout/>             </datatemplate>         </controls:flyoutscontrol.itemtemplate>         <controls:flyoutscontrol.itemcontainerstyle>             <style basedon="{staticresource {x:type controls:flyout}}"                targettype="{x:type controls:flyout}">                 <setter property="header"                     value="{binding header}" />                 <setter property="isopen"                     value="{binding visible}" />                 <setter property="position"                     value="{binding position, converter={staticresource flyoutpositionconverter}}" />                 <setter property="ismodal"                     value="{binding ismodal}" />                 <setter property="theme" value="accent" />             </style>         </controls:flyoutscontrol.itemcontainerstyle>     </controls:flyoutscontrol> </controls:metrowindow.flyouts> 

the mainviewmodel has observablecollection<iflyoutviewmodel> named flyouts , contains flyout viewmodels. of course have implement iflyoutviewmodel:

using system.componentmodel;  namespace myapplication.viewmodel {     internal interface iflyoutviewmodel : inotifypropertychanged     {         string header { get; }         bool visible { get; set; }         position position { get; set; }         bool ismodal { get; set; }     }      public enum position     {         top,         left,         right,         bottom     } } 

the flyoutpositionconverter mapper between position enum , mahapps.metro.controls.position because didn't want use real positon in viewmodel interface.