Clever Geek Handbook

MahApp Flyout CloseCommand and IsOpen are not bound properly

I am following the strict MVVM schema.

In mine, FlyoutControl

I have linked the following:

    <controls:FlyoutsControl>
        <controls:Flyout IsOpen="{Binding FlyoutIsOpen, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
                         CloseCommand="{Binding CloseFlyoutCommand}">
            ...
        </controls:Flyout>
    </controls:FlyoutsControl>

I have two scripts both of which are not working:

Scenario 1:

I set FlyoutIsOpen

to true

in my constructor ViewModel

, and I bind CloseFlyoutCommand

to DelegateCommand

, which takes a method that sets FlyoutIsOpen

to false

.

In this case, my view is loaded with it Flyout

already open (as expected). However, when I click the Flyout

close button , nothing happens unless I click again. If I print the output of my method, I can confirm that the command is setting FlyoutIsOpen

to false

, but for some reason I need a second click (after being FlyoutIsOpen

set to false

) to actually close Flyout

.

Scenario 2:

I have set FlyoutIsOpen

to false

(or uninitialized) in my constructor. I am binding another button to DelegateCommand

that takes a method that sets FlyoutIsOpen

in true

.

The view is loaded with closed Flyout

(as expected). However, when I click on the button associated with the method that sets FlyoutIsOpen

in true

, nothing happens and Flyout

does not appear.

Has anyone faced the same unresponsive issues with FlyoutsControl

? If so, how did you resolve it?

+3


source to share


1 answer


I also had problems binding to the property isOpen

, but I managed to style ItemContainer

and bind isOpen

there instead of inside mine Flyout

. I don't need it anymore CloseCommand

, setting Visible

to false in my viewmodel closes the popup.

MainWindow.xaml

where I define the bindings ItemContainer

:

<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 is ObservableCollection<IFlyoutViewModel>

named Flyouts

and contains all my viewtodels to fly out. Of course they have to 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
    }
}

FlyoutPositionConverter

- it's just a mapping between my position enum and MahApps.Metro.Controls.Position

because I didn't want to use real positon in my viewmodel interface.

0


source






More articles:


All Articles